@1001tv/manara 0.0.3-beta.0

package/dist/components/VideoPlayer/PlayerUI/PlayerUI.types.d.ts

@@ -0,0 +1,30 @@
+import { HTMLAttributes } from 'react';
+import { TrackFrameProps } from '../TrackFrame/TrackFrame.types';
+/**
+ * Pure controls overlay (scrim + back + playback cluster + TrackFrame). Position `absolute inset-0` inside a
+ * relative video stage (Bitmovin/Shaka/HLS.js mount point or a plain `<video>`). Every TrackFrame knob extends
+ * through, so consumers wire progress, type, side actions, and menus directly on PlayerUI.
+ */
+export interface PlayerUIProps extends Omit<TrackFrameProps, 'isArabic' | 'className'>, Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'onVolumeChange'> {
+    /** Show the dark top/bottom gradient for legibility over the media. @default true */
+    showScrim?: boolean;
+    /** Show the center play/pause + skip cluster. @default true */
+    showPlaybackActions?: boolean;
+    /** Show the bottom TrackFrame strip. @default true */
+    showTrackFrame?: boolean;
+    /** @default true */
+    isArabic?: boolean;
+    /** Back navigation — button renders top-left (right in RTL) when provided. */
+    onBack?: () => void;
+    /** @default false */
+    isPaused?: boolean;
+    /** @default 10 */
+    skipSeconds?: number;
+    onPlayPause?: () => void;
+    onSkipBack?: () => void;
+    onSkipForward?: () => void;
+    /** HUD auto-hide idle window in ms. The HUD stays visible while `isPaused` is true. @default 3500 */
+    idleMs?: number;
+    /** Current playback position in seconds. Drives the visibility gating for `textActions.skipIntro` and `textActions.nextEpisode`. */
+    currentTimeSec?: number;
+}

package/dist/components/VideoPlayer/PlayerUI/PlayerUI.utils.d.ts

@@ -0,0 +1,5 @@
+import { TextActionsConfig } from '../TrackFrame/TrackFrame.types';
+/** Two stacked vertical gradients — top fade-in and bottom fade-out — matching the Figma scrim spec. */
+export declare const SCRIM_BG: string;
+/** Filters Skip Intro / Next Episode against the current playback time. Returns the same object when `currentTimeSec` is undefined (no gating). */
+export declare const gateTextActions: (textActions: TextActionsConfig | undefined, currentTimeSec: number | undefined) => TextActionsConfig | undefined;

package/dist/components/VideoPlayer/ProgressBar/ProgressBar.d.ts

@@ -0,0 +1,3 @@
+import { ProgressBarProps } from './ProgressBar.types';
+/** 4px scrubber bar — track + brand fill + handle. While hovering or dragging, calls `renderScrollingCard(percent)` and floats the returned node above the cursor; the card position is clamped horizontally to keep it inside the bar's bounds. */
+export declare const ProgressBar: import('react').ForwardRefExoticComponent<ProgressBarProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/ProgressBar/ProgressBar.types.d.ts

@@ -0,0 +1,22 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export type ProgressBarAppearance = 'brand' | 'critical' | 'warning';
+export interface ProgressBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** 0–100 @default 0 */
+    progress?: number;
+    /** @default 'brand' */
+    appearance?: ProgressBarAppearance;
+    /** @default true */
+    showHandle?: boolean;
+    /**
+     * Render a preview node above the cursor while it is hovering or dragging
+     * the bar. Receives the hover position as a percent (0–100). When omitted,
+     * no preview is rendered.
+     */
+    renderScrollingCard?: (percent: number) => ReactNode;
+    /** Click/drag to seek. */
+    onSeek?: (progress: number) => void;
+    /** Fires once on pointer-down at the start of a drag. */
+    onDragStart?: () => void;
+    /** Fires once on pointer-up at the end of a drag (or on unmount mid-drag). */
+    onDragEnd?: () => void;
+}

package/dist/components/VideoPlayer/ProgressBar/ProgressBar.variants.d.ts

@@ -0,0 +1,6 @@
+export declare const progressFillVariants: (props?: ({
+    appearance?: "critical" | "brand" | "warning" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const progressHandleVariants: (props?: ({
+    appearance?: "critical" | "brand" | "warning" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/VideoPlayer/ScrollingCard/ScrollingCard.d.ts

@@ -0,0 +1,3 @@
+import { ScrollingCardProps } from './ScrollingCard.types';
+/** Seek-bar hover preview — 208×117 thumbnail with optional top-left tags and a centered timestamp below. Consumers compose it inside `track.renderScrollingCard`. */
+export declare const ScrollingCard: ({ thumbnailUrl, thumbnailAlt, timestamp, tags }: ScrollingCardProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/ScrollingCard/ScrollingCard.types.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export interface ScrollingCardProps {
+    /** Thumbnail image URL. When omitted, the card shows a solid dark surface. */
+    thumbnailUrl?: string;
+    /** Alt text for the thumbnail. Empty string by default — the card is decorative. */
+    thumbnailAlt?: string;
+    /** Timestamp text below the thumbnail (e.g. "32:12"). */
+    timestamp: string;
+    /** Optional badges rendered in the top-left of the thumbnail (e.g. chapter chips). */
+    tags?: ReactNode;
+}

package/dist/components/VideoPlayer/TrackFrame/TrackFrame.d.ts

@@ -0,0 +1,6 @@
+import { TrackFrameProps } from './TrackFrame.types';
+/**
+ * Bottom controls strip — info row on top (faded with HUD via `isInfoVisible`), scrubber row below (always visible/interactive so the seek-bar stays hoverable even when the HUD is idle).
+ * Orientation is fixed LTR in both languages (Arabic & English track frames share one layout — only text/font is localized).
+ */
+export declare const TrackFrame: import('react').ForwardRefExoticComponent<TrackFrameProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/TrackFrame/TrackFrame.types.d.ts

@@ -0,0 +1,167 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export type TrackFrameType = 'default' | 'live' | 'ad';
+/** One menu entry on a side-actions icon — body shown in the popover plus a click callback. */
+export interface MenuConfig {
+    /** Popover body (usually a list of menu rows). */
+    content?: ReactNode;
+    /** Fires alongside the open/close toggle. */
+    onClick?: () => void;
+}
+/** Title + subtitle stack on the leading side of the frame (default/live variants only). */
+export interface PlayerLabelConfig {
+    title?: ReactNode;
+    subtitle?: ReactNode;
+}
+/** Scrubber row — elapsed/duration labels plus the ProgressBar knobs. */
+export interface TrackConfig {
+    /** 0–100 */
+    progress?: number;
+    /** Formatted elapsed time, e.g. "0:48:24". */
+    currentTime?: string;
+    /** Formatted duration, or override (e.g. "LIVE", "00:27"). Defaults to "LIVE" for `type='live'`. */
+    endLabel?: string;
+    onSeek?: (progress: number) => void;
+    /**
+     * Renders a preview node above the cursor while it is hovering or dragging
+     * the bar. Receives the hover position as a percent (0–100); compose a
+     * `ScrollingCard` (or your own node) inside.
+     */
+    renderScrollingCard?: (percent: number) => ReactNode;
+    /** Fires once when the user starts dragging the seek handle. PlayerUI uses this to hide the HUD during scrub. */
+    onDragStart?: () => void;
+    /** Fires once when the drag ends (pointer-up or unmount). */
+    onDragEnd?: () => void;
+}
+/** Advertisement-variant info row: warning-yellow tag + optional Skip Ad button. */
+export interface AdConfig {
+    /** Tag label override — defaults to "Advertisement" / "إشهار". */
+    label?: string;
+    /** Skip-Ad button label — defaults to "Skip Ad" / "تخطى الإعلان". */
+    skipLabel?: string;
+    /** Enables the Skip Ad button (otherwise shown disabled). @default false */
+    isSkipEnabled?: boolean;
+    onSkip?: () => void;
+}
+/** A single text-CTA entry (Skip Intro, Watch Credit) — shown when provided. */
+export interface TextActionEntry {
+    onClick: () => void;
+    /** Override the default label (defaults are locale-aware: en/ar). */
+    label?: string;
+}
+/** Skip Intro entry — includes the intro time range; the pill only renders while `currentTimeSec ∈ [startSec, endSec)`. */
+export interface SkipIntroEntry extends TextActionEntry {
+    /** Intro start (inclusive), in seconds. */
+    startSec: number;
+    /** Intro end (exclusive), in seconds. */
+    endSec: number;
+}
+/** Next Episode entry — includes the credits start time; the pill renders once `currentTimeSec >= startSec`. The optional countdown ticks down each second and auto-fires `onClick` at 0. */
+export interface NextEpisodeEntry extends TextActionEntry {
+    /** Credits start, in seconds. */
+    startSec: number;
+    /** When set, the button label becomes "{label} {n}" and ticks down each second. Reaches 0 → fires `onClick`. */
+    countdownSec?: number;
+}
+/** Text CTAs in the side cluster — Skip Intro, Watch Credit, Next Episode. Skip Intro and Next Episode are time-gated against `currentTimeSec` from PlayerUI; Watch Credit renders whenever provided. */
+export interface TextActionsConfig {
+    skipIntro?: SkipIntroEntry;
+    watchCredit?: TextActionEntry;
+    nextEpisode?: NextEpisodeEntry;
+}
+/** Direct-action icons — Picture-in-Picture, Fullscreen. Each shown when its callback is provided. */
+export interface IconActionsConfig {
+    onPictureInPicture?: () => void;
+    onFullscreen?: () => void;
+}
+/** Share-menu callbacks. Each row renders only when its callback is provided. */
+export interface ShareConfig {
+    onCopyUrl?: () => void;
+    onShareFacebook?: () => void;
+    onShareTwitter?: () => void;
+    onShareWhatsApp?: () => void;
+    onShareEmail?: () => void;
+}
+/** One entry in the Subtitles menu. The menu prepends a synthesized "Off" row above the tracks. */
+export interface SubtitlesTrack {
+    /** Stable id passed to `onChange` when this row is picked. */
+    id: string;
+    /** Display label (e.g. "English", "Arabic"). A " - CC" suffix is appended when `isClosedCaption` is true. */
+    label: string;
+    /** Marks the track as closed-caption — renders the " - CC" suffix. */
+    isClosedCaption?: boolean;
+}
+/** Subtitles dropup config. Renders an "Off" row followed by the provided tracks; the active row shows a check. */
+export interface SubtitlesConfig {
+    tracks: SubtitlesTrack[];
+    /** Active track id, or 'off' to disable subtitles. */
+    selected: string | 'off';
+    onChange: (selected: string | 'off') => void;
+    /** Override for the synthesized "Off" row label. */
+    offLabel?: string;
+}
+/** One choice in a Settings list group (Quality, Speed, Audio). */
+export interface SettingsOption {
+    /** Stable id passed to the group's `onChange` when this row is picked. */
+    id: string;
+    /** Display label rendered in the submenu row and (for the selected option) inside the main row title. */
+    label: string;
+}
+/** A single-select list group inside the Settings dropup (Quality, Speed, or Audio). */
+export interface SettingsListGroup {
+    options: SettingsOption[];
+    /** Active option id; used to render the check + the main-row summary "(label)". */
+    selected: string;
+    onChange: (id: string) => void;
+    /** Override for the row title (defaults are English: "Quality", "Playback Speed", "Audio"). */
+    label?: string;
+}
+/** Auto-play toggle inside the Settings dropup. */
+export interface SettingsAutoPlay {
+    isEnabled: boolean;
+    onChange: (next: boolean) => void;
+    /** Override for the row label (defaults to "Auto Play"). */
+    label?: string;
+}
+/** Settings dropup config. Each section renders only when its config is provided. */
+export interface SettingsConfig {
+    /** Video quality picker — opens a submenu to the left of the main panel. */
+    quality?: SettingsListGroup;
+    /** Playback speed picker — opens a submenu to the left of the main panel. */
+    speed?: SettingsListGroup;
+    /** Audio source/track picker (original / dubbed / language) — opens a submenu to the left of the main panel. */
+    audio?: SettingsListGroup;
+    /** Auto Play toggle row — no submenu; the row hosts a Switch. */
+    autoPlay?: SettingsAutoPlay;
+}
+/** Icon popover menus shown in the side cluster. Each shown when its config is provided. */
+export interface MenusConfig {
+    /** Share dropup with per-target callbacks (Copy URL, Facebook, X, WhatsApp, Email). */
+    share?: ShareConfig;
+    /** Subtitles dropup — list of tracks with an "Off" entry on top. */
+    subtitles?: SubtitlesConfig;
+    episodes?: MenuConfig;
+    /** Settings dropup with Quality / Playback Speed / Audio submenus and an Auto Play toggle. */
+    settings?: SettingsConfig;
+}
+/** Controlled-volume config — drives the side-cluster Volume button's hover popover (vertical slider 0–100) and the mute toggle on click. */
+export interface VolumeConfig {
+    /** 0–100 */
+    value: number;
+    onChange: (next: number) => void;
+}
+/** Bottom controls strip — label/ad row on top, scrubber row below, side cluster of CTAs + icons + menus. */
+export interface TrackFrameProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'onVolumeChange'> {
+    /** @default 'default' */
+    type?: TrackFrameType;
+    /** @default true */
+    isArabic?: boolean;
+    label?: PlayerLabelConfig;
+    track?: TrackConfig;
+    ad?: AdConfig;
+    textActions?: TextActionsConfig;
+    iconActions?: IconActionsConfig;
+    menus?: MenusConfig;
+    volume?: VolumeConfig;
+    /** When false, the info row (title + side actions) fades out and becomes non-interactive; the scrubber row stays visible and hoverable. @default true */
+    isInfoVisible?: boolean;
+}

package/dist/components/VideoPlayer/TrackFrame/components/AdInfoRow.d.ts

@@ -0,0 +1,7 @@
+import { AdConfig } from '../TrackFrame.types';
+export interface AdInfoRowProps {
+    isArabic?: boolean;
+    ad?: AdConfig;
+}
+/** Top row of the TrackFrame in ad variant — yellow "Advertisement" tag and optional Skip Ad button. */
+export declare const AdInfoRow: ({ isArabic, ad }: AdInfoRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/DefaultInfoRow.d.ts

@@ -0,0 +1,15 @@
+import { MenuKey } from '../../hooks/useMenuToggle/useMenuToggle.types';
+import { IconActionsConfig, MenusConfig, PlayerLabelConfig, TextActionsConfig, TrackFrameType, VolumeConfig } from '../TrackFrame.types';
+export interface DefaultInfoRowProps {
+    type: TrackFrameType;
+    isArabic?: boolean;
+    label?: PlayerLabelConfig;
+    textActions?: TextActionsConfig;
+    iconActions?: IconActionsConfig;
+    menus?: MenusConfig;
+    volume?: VolumeConfig;
+    openMenu: MenuKey | null;
+    onToggleMenu: (key: MenuKey) => void;
+}
+/** Top row of the TrackFrame in default/live variants — PlayerLabel on the leading side, PlayerSideActions on the trailing side. */
+export declare const DefaultInfoRow: ({ label, isArabic, ...sideActionsProps }: DefaultInfoRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerLabel/PlayerLabel.d.ts

@@ -0,0 +1,3 @@
+import { PlayerLabelProps } from './PlayerLabel.types';
+/** Title + subtitle stack shown above the video player track (h-56). */
+export declare const PlayerLabel: import('react').ForwardRefExoticComponent<PlayerLabelProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerLabel/PlayerLabel.types.d.ts

@@ -0,0 +1,7 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface PlayerLabelProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    title?: ReactNode;
+    subtitle?: ReactNode;
+    /** @default true */
+    isArabic?: boolean;
+}

package/dist/components/VideoPlayer/TrackFrame/components/PlayerMenuPanel/PlayerMenuPanel.d.ts

@@ -0,0 +1,3 @@
+import { PlayerMenuPanelProps } from './PlayerMenuPanel.types';
+/** Dark popover panel hosting Subtitles / Episodes / Settings / Share menu contents inside the player. */
+export declare const PlayerMenuPanel: import('react').ForwardRefExoticComponent<PlayerMenuPanelProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerMenuPanel/PlayerMenuPanel.types.d.ts

@@ -0,0 +1,6 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface PlayerMenuPanelProps extends HTMLAttributes<HTMLDivElement> {
+    /** Shows a decorative scrollbar indicator on the right edge. @default false */
+    isScrollable?: boolean;
+    children?: ReactNode;
+}

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/MenusCluster.d.ts

@@ -0,0 +1,11 @@
+import { MenuKey } from '../../../hooks/useMenuToggle/useMenuToggle.types';
+import { MenusConfig, TrackFrameType, VolumeConfig } from '../../TrackFrame.types';
+export interface MenusClusterProps {
+    type: TrackFrameType;
+    menus?: MenusConfig;
+    volume?: VolumeConfig;
+    openMenu: MenuKey | null;
+    onToggleMenu: (key: MenuKey) => void;
+}
+/** Popover-opening icons in the side cluster: Subtitles, Episodes (default-only), Volume slider (when configured), Settings. */
+export declare const MenusCluster: ({ type, menus, volume, openMenu, onToggleMenu }: MenusClusterProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/PlayerSideActions.d.ts

@@ -0,0 +1,14 @@
+import { MenuKey } from '../../../hooks/useMenuToggle/useMenuToggle.types';
+import { IconActionsConfig, MenusConfig, TextActionsConfig, TrackFrameType, VolumeConfig } from '../../TrackFrame.types';
+export interface PlayerSideActionsProps {
+    type: TrackFrameType;
+    isArabic?: boolean;
+    textActions?: TextActionsConfig;
+    iconActions?: IconActionsConfig;
+    menus?: MenusConfig;
+    volume?: VolumeConfig;
+    openMenu: MenuKey | null;
+    onToggleMenu: (key: MenuKey) => void;
+}
+/** Trailing-side cluster for default/live variants. Composes the text, icon, and menu sub-clusters in Figma-spec order. */
+export declare const PlayerSideActions: ({ type, isArabic, textActions, iconActions, menus, volume, openMenu, onToggleMenu, }: PlayerSideActionsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/TextActionsCluster.d.ts

@@ -0,0 +1,7 @@
+import { TextActionsConfig } from '../../TrackFrame.types';
+export interface TextActionsClusterProps {
+    isArabic?: boolean;
+    textActions?: TextActionsConfig;
+}
+/** Text CTA pills: Skip Intro / Watch Credit / Next Episode. Each renders when its entry is provided; Next Episode appends `countdownSec` to its label when set. */
+export declare const TextActionsCluster: ({ isArabic, textActions }: TextActionsClusterProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/settings/SettingsAutoPlayRow.d.ts

@@ -0,0 +1,6 @@
+import { SettingsAutoPlay } from '../../../TrackFrame.types';
+export interface SettingsAutoPlayRowProps {
+    autoPlay: SettingsAutoPlay;
+}
+/** Auto Play toggle row inside the Settings dropup. Hosts a Switch instead of a submenu chevron. */
+export declare const SettingsAutoPlayRow: ({ autoPlay }: SettingsAutoPlayRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/settings/SettingsListGroupRow.d.ts

@@ -0,0 +1,17 @@
+import { ComponentType, SVGProps } from 'react';
+import { SettingsListGroup } from '../../../TrackFrame.types';
+export interface SettingsListGroupRowProps {
+    /** Leading icon for the row (e.g. Hd for Quality, Speed for playback rate). */
+    Icon: ComponentType<SVGProps<SVGSVGElement>>;
+    /** Default title prepended to the selected option's label, overridden by `group.label`. */
+    defaultTitle: string;
+    group: SettingsListGroup;
+    /** True when this row's submenu is the open one. */
+    isOpen: boolean;
+    /** Toggles this row's submenu open/closed. */
+    onToggle: () => void;
+    /** Closes the entire Settings dropup; called after the user picks an option. */
+    closeMenu: () => void;
+}
+/** Settings main-panel row that opens a 210px submenu to its left when active. The trailing chevron flips to indicate the open state. */
+export declare const SettingsListGroupRow: ({ Icon, defaultTitle, group, isOpen, onToggle, closeMenu }: SettingsListGroupRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/settings/SettingsMenuButton.d.ts

@@ -0,0 +1,9 @@
+import { MenuKey } from '../../../../hooks/useMenuToggle/useMenuToggle.types';
+import { SettingsConfig } from '../../../TrackFrame.types';
+export interface SettingsMenuButtonProps {
+    settings?: SettingsConfig;
+    openMenu: MenuKey | null;
+    onToggle: (key: MenuKey) => void;
+}
+/** Side-actions gear icon that opens a dropup with Quality / Speed / Audio submenus and the Auto Play toggle. Renders nothing when `settings` is undefined. */
+export declare const SettingsMenuButton: ({ settings, openMenu, onToggle }: SettingsMenuButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/settings/SettingsMenuRows.d.ts

@@ -0,0 +1,8 @@
+import { SettingsConfig } from '../../../TrackFrame.types';
+export interface SettingsMenuRowsProps {
+    settings: SettingsConfig;
+    /** Closes the parent Settings popover (called after the user picks any option). */
+    closeMenu: () => void;
+}
+/** Settings main-panel body. Renders the Quality / Speed / Audio rows (each opens a left-anchored submenu) plus the Auto Play toggle. Only one submenu is open at a time. */
+export declare const SettingsMenuRows: ({ settings, closeMenu }: SettingsMenuRowsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/share/ShareMenuButton.d.ts

@@ -0,0 +1,9 @@
+import { MenuKey } from '../../../../hooks/useMenuToggle/useMenuToggle.types';
+import { ShareConfig } from '../../../TrackFrame.types';
+export interface ShareMenuButtonProps {
+    share?: ShareConfig;
+    openMenu: MenuKey | null;
+    onToggle: (key: MenuKey) => void;
+}
+/** Side-actions share icon that opens a dropup menu with per-target sharing callbacks. Renders nothing when `share` is undefined. */
+export declare const ShareMenuButton: ({ share, openMenu, onToggle }: ShareMenuButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/share/ShareMenuRows.d.ts

@@ -0,0 +1,8 @@
+import { ShareConfig } from '../../../TrackFrame.types';
+export interface ShareMenuRowsProps {
+    share: ShareConfig;
+    /** Closes the parent popover after a row is activated. */
+    closeMenu: () => void;
+}
+/** Five-row share dropup body (Copy URL, Facebook, X, WhatsApp, Email). Each row renders only when its callback is provided. */
+export declare const ShareMenuRows: ({ share, closeMenu }: ShareMenuRowsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/shared/IconButton.d.ts

@@ -0,0 +1,8 @@
+import { ComponentType, SVGProps } from 'react';
+export type IconButtonProps = {
+    Icon: ComponentType<SVGProps<SVGSVGElement>>;
+    label: string;
+    onClick?: () => void;
+};
+/** Plain icon-only player-ghost button. Renders nothing when `onClick` is undefined. */
+export declare const IconButton: ({ Icon, label, onClick }: IconButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/shared/MenuIconButton.d.ts

@@ -0,0 +1,13 @@
+import { ComponentType, SVGProps } from 'react';
+import { MenuKey } from '../../../../hooks/useMenuToggle/useMenuToggle.types';
+import { MenuConfig } from '../../../TrackFrame.types';
+export type MenuIconButtonProps = {
+    Icon: ComponentType<SVGProps<SVGSVGElement>>;
+    label: string;
+    menuKey: MenuKey;
+    menu?: MenuConfig;
+    openMenu: MenuKey | null;
+    onToggle: (key: MenuKey) => void;
+};
+/** Icon button that opens a PlayerMenuPanel popover anchored above it. Renders nothing when `menu` is undefined. */
+export declare const MenuIconButton: ({ Icon, label, menuKey, menu, openMenu, onToggle }: MenuIconButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/shared/MenuListRow.d.ts

@@ -0,0 +1,9 @@
+export interface MenuListRowProps {
+    /** Row text. */
+    label: string;
+    /** When true, paints the brand surface, switches to dark brand text, and shows a trailing check. */
+    isSelected?: boolean;
+    onClick?: () => void;
+}
+/** Single-line list row used by Subtitles and Settings submenus. Selected variant shows green fill + check; non-selected rows pick up surface-manara-hover on hover. */
+export declare const MenuListRow: ({ label, isSelected, onClick }: MenuListRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/shared/menuRowClass.d.ts

@@ -0,0 +1,2 @@
+/** Shared Tailwind class string for main-panel menu rows (Share, Settings, etc.). Submenu rows use `MenuListRow` instead. */
+export declare const MENU_ROW_CLASS: string;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/subtitles/SubtitlesMenuButton.d.ts

@@ -0,0 +1,9 @@
+import { MenuKey } from '../../../../hooks/useMenuToggle/useMenuToggle.types';
+import { SubtitlesConfig } from '../../../TrackFrame.types';
+export interface SubtitlesMenuButtonProps {
+    subtitles?: SubtitlesConfig;
+    openMenu: MenuKey | null;
+    onToggle: (key: MenuKey) => void;
+}
+/** Side-actions subtitles icon that opens a dropup with the synthesized "Off" row plus the provided tracks. Renders nothing when `subtitles` is undefined. */
+export declare const SubtitlesMenuButton: ({ subtitles, openMenu, onToggle }: SubtitlesMenuButtonProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/subtitles/SubtitlesMenuRows.d.ts

@@ -0,0 +1,8 @@
+import { SubtitlesConfig } from '../../../TrackFrame.types';
+export interface SubtitlesMenuRowsProps {
+    subtitles: SubtitlesConfig;
+    /** Closes the parent popover after a row is activated. */
+    closeMenu: () => void;
+}
+/** Subtitles dropup body — synthesized "Off" row followed by each track. Closed-caption tracks render with a " - CC" suffix. */
+export declare const SubtitlesMenuRows: ({ subtitles, closeMenu }: SubtitlesMenuRowsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/PlayerSideActions/volume/VolumeButton.d.ts

@@ -0,0 +1,6 @@
+import { VolumeConfig } from '../../../TrackFrame.types';
+export interface VolumeButtonProps {
+    volume?: VolumeConfig;
+}
+/** Volume icon — hover opens the 28×144 vertical-slider popover (200 ms hover-out grace, click-outside or Escape dismisses immediately); click on the icon toggles mute and restores the prior value. Read-only slider at 25 % when `volume` is undefined. */
+export declare const VolumeButton: ({ volume }: VolumeButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VideoPlayer/TrackFrame/components/Track/Track.d.ts

@@ -0,0 +1,3 @@
+import { TrackProps } from './Track.types';
+/** Track — times + ProgressBar, with default/live/ad variants. */
+export declare const Track: import('react').ForwardRefExoticComponent<TrackProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/TrackFrame/components/Track/Track.types.d.ts

@@ -0,0 +1,15 @@
+import { ProgressBarProps } from '../../../ProgressBar/ProgressBar.types';
+export type TrackType = 'default' | 'live' | 'ad';
+/**
+ * Track extends ProgressBar — every ProgressBar knob (progress, showHandle,
+ * renderScrollingCard, onSeek) passes straight through. Track only adds `type`
+ * (which drives the bar's appearance) and the flanking time labels.
+ */
+export interface TrackProps extends Omit<ProgressBarProps, 'appearance'> {
+    /** @default 'default' */
+    type?: TrackType;
+    /** Formatted elapsed time (e.g. "0:48:24"). */
+    currentTime?: string;
+    /** Formatted duration, or override (e.g. "LIVE", "00:27"). Defaults to "LIVE" for `type='live'`. */
+    endLabel?: string;
+}

package/dist/components/VideoPlayer/TrackFrame/components/VolumeSlider/VolumeSlider.d.ts

@@ -0,0 +1,3 @@
+import { VolumeSliderProps } from './VolumeSlider.types';
+/** Vertical 4px volume slider — brand fill grows bottom-up; handle rides the top of the fill. */
+export declare const VolumeSlider: import('react').ForwardRefExoticComponent<VolumeSliderProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/TrackFrame/components/VolumeSlider/VolumeSlider.types.d.ts

@@ -0,0 +1,15 @@
+import { HTMLAttributes } from 'react';
+export interface VolumeSliderProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** 0–100 */
+    volume: number;
+    /** Fired on pointer drag and keyboard nudges. Omit to render read-only. */
+    onChange?: (next: number) => void;
+    /** Track height in px. @default 120 */
+    height?: number;
+    /** @default true */
+    showHandle?: boolean;
+    /** Fires once on pointer-down at the start of a drag. */
+    onDragStart?: () => void;
+    /** Fires once on pointer-up at the end of a drag. */
+    onDragEnd?: () => void;
+}

package/dist/components/VideoPlayer/VideoPlayer/VideoPlayer.d.ts

@@ -0,0 +1,7 @@
+import { VideoPlayerProps } from './VideoPlayer.types';
+/**
+ * Demo-only 16:9 frame (video or poster) with PlayerUI stacked on top — controls drive React state but the
+ * `<video>` is not wired. Use for Storybook and previews; in production the real player is Bitmovin (see
+ * `BITMOVIN_INTEGRATION.md`) and PlayerUI mounts directly over its container.
+ */
+export declare const VideoPlayer: import('react').ForwardRefExoticComponent<VideoPlayerProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/VideoPlayer/VideoPlayer/VideoPlayer.types.d.ts

@@ -0,0 +1,15 @@
+import { PlayerUIProps } from '../PlayerUI/PlayerUI.types';
+/**
+ * VideoPlayer — demo-only wrapper: renders a `<video>` (or `<img>` poster)
+ * inside a 16:9 frame, then stacks PlayerUI on top. The media element is not
+ * wired to PlayerUI callbacks — Storybook/preview use only.
+ *
+ * Production uses Bitmovin with `<PlayerUI>` over its mount; see
+ * `src/components/VideoPlayer/BITMOVIN_INTEGRATION.md`.
+ */
+export interface VideoPlayerProps extends PlayerUIProps {
+    /** Streaming media URL. When provided, renders a `<video>`; falls back to `<img>` if only `posterSrc`. */
+    videoSrc?: string;
+    /** Poster image URL — used as the video poster, or as the standalone background when no `videoSrc`. */
+    posterSrc?: string;
+}

package/dist/components/VideoPlayer/VideoPlayer.constants.d.ts

@@ -0,0 +1,3 @@
+export declare const ICON_SIZE_MEDIUM = "w-[24px] h-[24px]";
+export declare const ICON_SIZE_LARGE = "w-[32px] h-[32px]";
+export declare const DEFAULT_VOLUME = 25;

package/dist/components/VideoPlayer/formatPlayerTime.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Formats a duration in seconds for display in `Track` / `TrackFrame`.
+ * Returns `m:ss` under an hour and `h:mm:ss` from one hour onward.
+ * Always emits Latin digits in both languages (player clocks stay numeric
+ * regardless of locale — matches Netflix/Shahid/StarzPlay).
+ * Negative or non-finite inputs collapse to zero.
+ */
+export declare const formatPlayerTime: (seconds: number) => string;

package/dist/components/VideoPlayer/hooks/useHudVisibility/useHudVisibility.d.ts

@@ -0,0 +1,3 @@
+import { UseHudVisibilityOptions, UseHudVisibilityResult } from './useHudVisibility.types';
+/** HUD visibility — visible on activity (pointer move, key down) or while paused; hidden after `idleMs`. Returns the boolean plus a stable `wake` callers can forward to other interactions. */
+export declare const useHudVisibility: (options?: UseHudVisibilityOptions) => UseHudVisibilityResult;

package/dist/components/VideoPlayer/hooks/useHudVisibility/useHudVisibility.types.d.ts

@@ -0,0 +1,17 @@
+import { RefObject } from 'react';
+export interface UseHudVisibilityOptions {
+    /** When true, the HUD stays visible permanently (no auto-hide while paused). */
+    isPaused?: boolean;
+    /** Element to listen on for pointer activity. Defaults to the document. */
+    containerRef?: RefObject<HTMLElement | null>;
+    /** Idle duration in ms before the HUD hides. @default 3500 */
+    idleMs?: number;
+    /** Disables auto-hide entirely; the HUD stays visible. @default true */
+    enabled?: boolean;
+}
+export interface UseHudVisibilityResult {
+    /** Current HUD visibility — drives opacity, cursor, and `inert` on the controls layer. */
+    isHudVisible: boolean;
+    /** Manually mark activity; resets the idle timer and reveals the HUD. */
+    wake: () => void;
+}

package/dist/components/VideoPlayer/hooks/useMenuToggle/useMenuToggle.d.ts

@@ -0,0 +1,8 @@
+import { Ref } from 'react';
+import { MenuKey } from './useMenuToggle.types';
+/** Open-menu state + outside-pointerdown/Escape dismissal. Merges the caller's ref with the internal hit-test container ref. */
+export declare const useMenuToggle: (forwardedRef: Ref<HTMLDivElement>) => {
+    openMenu: MenuKey | null;
+    toggle: (key: MenuKey) => void;
+    setRefs: (node: HTMLDivElement | null) => void;
+};

package/dist/components/VideoPlayer/hooks/useMenuToggle/useMenuToggle.types.d.ts

@@ -0,0 +1 @@
+export type MenuKey = 'share' | 'subtitles' | 'episodes' | 'settings';