suada-components 1.6.0 → 1.8.0

package/dist/components/{DailyMotion-Cyo9mQyt.js → DailyMotion-SZKPSpD1.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{DailyMotion-MzOn9ju_.esm.js → DailyMotion-jrl4eEA1.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Facebook-CPs-Ms_X.js → Facebook-DS0ye_bL.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Facebook-CJbuSY04.esm.js → Facebook-Ha24RKIX.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{FilePlayer-DNH6fpJi.js → FilePlayer-B4_DDZXQ.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{FilePlayer-CQvxGYWG.esm.js → FilePlayer-D-n083nK.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Kaltura-UmIP8SbX.esm.js → Kaltura-BlDrsjbp.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Kaltura-CyreQk0X.js → Kaltura-DAMolg_c.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mixcloud-CIGHRTPD.esm.js → Mixcloud-B5AIgf8e.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mixcloud-DJ_299OT.js → Mixcloud-C1z9BVJ8.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mux-BWxS553y.js → Mux-Bgsc5vvM.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Mux-CPaUZQah.esm.js → Mux-f77ctQXE.esm.js}

@@ -1,4 +1,4 @@
-import { a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Preview-BO_4FDai.js → Preview-CKXk6Axz.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Preview-CMj6CzdF.esm.js → Preview-DhMMn7e2.esm.js}

@@ -1,4 +1,4 @@
-import { g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{SoundCloud-CWfPIUXj.js → SoundCloud-DHLHmaaB.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{SoundCloud-CFXXBy2Z.esm.js → SoundCloud-DyYFhGe5.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Streamable-DrNjqXjt.esm.js → Streamable-BBygdIqb.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Streamable-Dqtzhuip.js → Streamable-BDhbB3m3.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Twitch-DjgALZAq.esm.js → Twitch-CAbFCb5f.esm.js}

@@ -1,4 +1,4 @@
-import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BYbdvIBD.esm.js';
+import { r as requireUtils, a as requirePatterns, g as getDefaultExportFromCjs } from './index-BTR541gv.esm.js';
 import React__default from 'react';
 
 function _mergeNamespaces(n, m) {

package/dist/components/{Twitch-CJuQ6-kx.js → Twitch-ZG7WuoXD.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cb05_mlX.js');
+var index = require('./index-XiB9Yp2-.js');
 var React = require('react');
 
 function _mergeNamespaces(n, m) {

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

@@ -17,12 +17,14 @@ export interface ControlsProps {
     volumeChangeHandler: (event: ChangeEvent<HTMLInputElement>) => void;
     formatDuration: string;
     handleFullScreen: () => void;
+    handlePictureInPicture: () => void;
     playing: boolean;
     isSubtitlesChecked: boolean;
     toggleSubtitlesCheck: () => void;
     isFavorite: boolean;
     toggleIsFavorite: () => Promise<void>;
     isFullscreen: boolean;
+    isPiPActive: boolean;
     subtitle?: boolean;
     handleSkipBackward?: () => void;
     handleSkipForward?: () => void;
@@ -33,4 +35,5 @@ export interface ControlsProps {
     downloadUrl?: string;
     downloadFileName?: string;
     onDownload?: () => void;
+    showPictureInPicture?: boolean;
 }

package/dist/components/VideoPlayer/Controls/Controls.js

@@ -46,12 +46,12 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StyledControls, StyledSlider, StyledVolumeWrapper, StyledVolumeSlider, StyledControllerLeft, StyledControllerRight, StyledTimeTrack, StyledHeartIconContainer, StyledSubtitlesIconContainer, StyledFullscreenIconContainer, StyledVolumeIconContainer, StyledPlayPauseIconContainer, StyledDownloadIconContainer, StyledRewindIconContainer, } from './Controls.styles';
-import { HeartIcon, MaximizeIcon, MinimizeIcon, PauseIcon, PlayIcon, RewindIcon, SkipIcon, SubtitlesIcon, VolumeMuteIcon, VolumeUpIcon, DownloadIcon, } from '../../../icons';
+import { StyledControls, StyledSlider, StyledVolumeWrapper, StyledVolumeSlider, StyledControllerLeft, StyledControllerRight, StyledTimeTrack, StyledHeartIconContainer, StyledSubtitlesIconContainer, StyledFullscreenIconContainer, StyledPictureInPictureIconContainer, StyledVolumeIconContainer, StyledPlayPauseIconContainer, StyledDownloadIconContainer, StyledRewindIconContainer, } from './Controls.styles';
+import { HeartIcon, MaximizeIcon, MinimizeIcon, PauseIcon, PlayIcon, PictureInPictureIcon, RewindIcon, SkipIcon, SubtitlesIcon, VolumeMuteIcon, VolumeUpIcon, DownloadIcon, } from '../../../icons';
 import { CustomTooltip } from '../../Tooltip';
 import PlaybackSpeedMenu from '../PlaybackSpeedMenu';
 var Controls = function (_a) {
-    var setVideoState = _a.setVideoState, playbackRate = _a.playbackRate, rewindHandler = _a.rewindHandler, playPauseHandler = _a.playPauseHandler, handleFastForward = _a.handleFastForward, formatCurrentTime = _a.formatCurrentTime, played = _a.played, onSeekMouseDownHandler = _a.onSeekMouseDownHandler, seekHandler = _a.seekHandler, seekMouseUpHandler = _a.seekMouseUpHandler, volume = _a.volume, muted = _a.muted, muteHandler = _a.muteHandler, volumeChangeHandler = _a.volumeChangeHandler, formatDuration = _a.formatDuration, handleFullScreen = _a.handleFullScreen, playing = _a.playing, isSubtitlesChecked = _a.isSubtitlesChecked, toggleSubtitlesCheck = _a.toggleSubtitlesCheck, isFavorite = _a.isFavorite, toggleIsFavorite = _a.toggleIsFavorite, isFullscreen = _a.isFullscreen, subtitle = _a.subtitle, handleSkipBackward = _a.handleSkipBackward, handleSkipForward = _a.handleSkipForward, isNextVideo = _a.isNextVideo, isPreviousVideo = _a.isPreviousVideo, showFavorite = _a.showFavorite, showDownload = _a.showDownload, downloadUrl = _a.downloadUrl, downloadFileName = _a.downloadFileName, onDownload = _a.onDownload;
+    var setVideoState = _a.setVideoState, playbackRate = _a.playbackRate, rewindHandler = _a.rewindHandler, playPauseHandler = _a.playPauseHandler, handleFastForward = _a.handleFastForward, formatCurrentTime = _a.formatCurrentTime, played = _a.played, onSeekMouseDownHandler = _a.onSeekMouseDownHandler, seekHandler = _a.seekHandler, seekMouseUpHandler = _a.seekMouseUpHandler, volume = _a.volume, muted = _a.muted, muteHandler = _a.muteHandler, volumeChangeHandler = _a.volumeChangeHandler, formatDuration = _a.formatDuration, handleFullScreen = _a.handleFullScreen, handlePictureInPicture = _a.handlePictureInPicture, playing = _a.playing, isSubtitlesChecked = _a.isSubtitlesChecked, toggleSubtitlesCheck = _a.toggleSubtitlesCheck, isFavorite = _a.isFavorite, toggleIsFavorite = _a.toggleIsFavorite, isFullscreen = _a.isFullscreen, isPiPActive = _a.isPiPActive, subtitle = _a.subtitle, handleSkipBackward = _a.handleSkipBackward, handleSkipForward = _a.handleSkipForward, isNextVideo = _a.isNextVideo, isPreviousVideo = _a.isPreviousVideo, showFavorite = _a.showFavorite, showDownload = _a.showDownload, downloadUrl = _a.downloadUrl, downloadFileName = _a.downloadFileName, onDownload = _a.onDownload, _b = _a.showPictureInPicture, showPictureInPicture = _b === void 0 ? true : _b;
     var handleDownloadClick = function () { return __awaiter(void 0, void 0, void 0, function () {
         var response, blob, blobUrl, link, error_1, link;
         return __generator(this, function (_a) {
@@ -99,22 +99,22 @@ var Controls = function (_a) {
             }
         });
     }); };
-    return (_jsxs(StyledControls, { children: [_jsx(StyledSlider, { type: 'range', min: 0, max: 100, value: played * 100, onMouseDown: onSeekMouseDownHandler, onChange: seekHandler, onMouseUp: seekMouseUpHandler }), _jsxs(StyledControllerLeft, { children: [_jsx(CustomTooltip, { title: playing ? 'Pause' : 'Play', children: _jsx(StyledPlayPauseIconContainer, { onClick: playPauseHandler, children: playing ? _jsx(PauseIcon, {}) : _jsx(PlayIcon, {}) }) }), _jsx(CustomTooltip, { title: "Rewind 10 seconds", children: _jsx(StyledRewindIconContainer, { children: _jsx(RewindIcon, { onClick: rewindHandler }) }) }), _jsx(CustomTooltip, { title: "Forward 10 seconds", children: _jsx(StyledRewindIconContainer, { children: _jsx(RewindIcon, { forward: true, onClick: handleFastForward }) }) }), _jsxs(StyledVolumeWrapper, { children: [_jsx(CustomTooltip, { title: muted ? 'Unmute' : 'Mute', children: _jsx(StyledVolumeIconContainer, { onClick: muteHandler, children: muted ? _jsx(VolumeMuteIcon, {}) : _jsx(VolumeUpIcon, {}) }) }), _jsx(StyledVolumeSlider, { type: 'range', value: volume * 100, onChange: volumeChangeHandler })] }), _jsxs(StyledTimeTrack, { children: [formatCurrentTime, " /", formatDuration] })] }), _jsxs(StyledControllerRight, { children: [handleSkipBackward && (_jsx(CustomTooltip, { title: "Previous video", children: _jsx(StyledRewindIconContainer, { children: _jsx(SkipIcon, { onClick: function () {
+    return (_jsxs(StyledControls, { children: [_jsx(StyledSlider, { type: 'range', min: 0, max: 100, value: played * 100, onMouseDown: onSeekMouseDownHandler, onChange: seekHandler, onMouseUp: seekMouseUpHandler }), _jsxs(StyledControllerLeft, { children: [_jsx(CustomTooltip, { title: playing ? 'Pause' : 'Play', children: _jsx(StyledPlayPauseIconContainer, { onClick: playPauseHandler, children: playing ? _jsx(PauseIcon, {}) : _jsx(PlayIcon, {}) }) }), _jsx(CustomTooltip, { title: "Rewind 5 seconds", children: _jsx(StyledRewindIconContainer, { className: "rewind-control", children: _jsx(RewindIcon, { onClick: rewindHandler }) }) }), _jsx(CustomTooltip, { title: "Forward 10 seconds", children: _jsx(StyledRewindIconContainer, { className: "forward-control", children: _jsx(RewindIcon, { forward: true, onClick: handleFastForward }) }) }), _jsxs(StyledVolumeWrapper, { children: [_jsx(CustomTooltip, { title: muted ? 'Unmute' : 'Mute', children: _jsx(StyledVolumeIconContainer, { onClick: muteHandler, children: muted ? _jsx(VolumeMuteIcon, {}) : _jsx(VolumeUpIcon, {}) }) }), _jsx(StyledVolumeSlider, { type: 'range', value: volume * 100, onChange: volumeChangeHandler })] }), _jsxs(StyledTimeTrack, { children: [formatCurrentTime, " /", formatDuration] })] }), _jsxs(StyledControllerRight, { children: [handleSkipBackward && (_jsx(CustomTooltip, { title: "Previous video", children: _jsx(StyledRewindIconContainer, { className: "skip-control", children: _jsx(SkipIcon, { onClick: function () {
                                     if (!isPreviousVideo)
                                         return;
                                     handleSkipBackward();
-                                }, className: isPreviousVideo ? '' : 'skip-icon-disabled' }) }) })), handleSkipForward && (_jsx(CustomTooltip, { title: "Next video", children: _jsx(StyledRewindIconContainer, { children: _jsx(SkipIcon, { forward: true, onClick: function () {
+                                }, className: isPreviousVideo ? '' : 'skip-icon-disabled' }) }) })), handleSkipForward && (_jsx(CustomTooltip, { title: "Next video", children: _jsx(StyledRewindIconContainer, { className: "skip-control", children: _jsx(SkipIcon, { forward: true, onClick: function () {
                                     if (!isNextVideo)
                                         return;
                                     handleSkipForward();
-                                }, className: isNextVideo ? '' : 'skip-icon-disabled' }) }) })), showFavorite && (_jsx(CustomTooltip, { title: isFavorite ? 'Remove from favorites' : 'Add to favorites', children: _jsx(StyledHeartIconContainer, { children: _jsx(HeartIcon, { active: isFavorite, onClick: toggleIsFavorite }) }) })), showDownload && downloadUrl && (_jsx(CustomTooltip, { title: "Download video", children: _jsx(StyledDownloadIconContainer, { children: _jsx(DownloadIcon, { onClick: handleDownloadClick }) }) })), _jsx(PlaybackSpeedMenu, { playbackSpeed: playbackRate, onPlaybackSpeedChange: function (speed) {
+                                }, className: isNextVideo ? '' : 'skip-icon-disabled' }) }) })), showFavorite && (_jsx(CustomTooltip, { title: isFavorite ? 'Remove from favorites' : 'Add to favorites', children: _jsx(StyledHeartIconContainer, { className: "favorite-control", children: _jsx(HeartIcon, { active: isFavorite, onClick: toggleIsFavorite }) }) })), showDownload && downloadUrl && (_jsx(CustomTooltip, { title: "Download video", children: _jsx(StyledDownloadIconContainer, { className: "download-control", children: _jsx(DownloadIcon, { onClick: handleDownloadClick }) }) })), _jsx(PlaybackSpeedMenu, { playbackSpeed: playbackRate, onPlaybackSpeedChange: function (speed) {
                             return setVideoState(function (prev) { return (__assign(__assign({}, prev), { playbackRate: speed })); });
                         }, customMenuWrapperStyles: {
                             position: 'unset',
                         }, customMenuStyles: {
                             right: '8px',
                             left: 'auto',
-                        } }), subtitle && (_jsx(CustomTooltip, { title: isSubtitlesChecked ? 'Hide subtitles' : 'Show subtitles', children: _jsx(StyledSubtitlesIconContainer, { children: _jsx(SubtitlesIcon, { active: isSubtitlesChecked, onClick: toggleSubtitlesCheck }) }) })), _jsx(CustomTooltip, { title: isFullscreen ? 'Exit fullscreen' : 'Enter fullscreen', children: _jsx(StyledFullscreenIconContainer, { onClick: handleFullScreen, children: isFullscreen ? _jsx(MinimizeIcon, {}) : _jsx(MaximizeIcon, {}) }) })] })] }));
+                        } }), subtitle && (_jsx(CustomTooltip, { title: isSubtitlesChecked ? 'Hide subtitles' : 'Show subtitles', children: _jsx(StyledSubtitlesIconContainer, { children: _jsx(SubtitlesIcon, { active: isSubtitlesChecked, onClick: toggleSubtitlesCheck }) }) })), showPictureInPicture && (_jsx(CustomTooltip, { title: isPiPActive ? 'Exit picture-in-picture' : 'Enter picture-in-picture', children: _jsx(StyledPictureInPictureIconContainer, { className: isPiPActive ? 'pip-active' : '', onClick: handlePictureInPicture, children: _jsx(PictureInPictureIcon, {}) }) })), _jsx(CustomTooltip, { title: isFullscreen ? 'Exit fullscreen' : 'Enter fullscreen', children: _jsx(StyledFullscreenIconContainer, { onClick: handleFullScreen, children: isFullscreen ? _jsx(MinimizeIcon, {}) : _jsx(MaximizeIcon, {}) }) })] })] }));
 };
 export default Controls;
 //# sourceMappingURL=Controls.js.map

package/dist/components/VideoPlayer/Controls/Controls.js.map

@@ -1 +1 @@
-{"version":3,"file":"Controls.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/Controls/Controls.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Controls.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/Controls/Controls.tsx"],"names":[],"mappings":"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"}

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

@@ -8,11 +8,28 @@ export declare const StyledVolumeSlider: import("styled-components/dist/types").
 export declare const StyledControllerLeft: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledControllerRight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledTimeTrack: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledHeartIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledDownloadIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledSubtitlesIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledFullscreenIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledVolumeIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledPlayPauseIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledRewindIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledHeartIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledDownloadIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledSubtitlesIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledFullscreenIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledPictureInPictureIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledVolumeIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledPlayPauseIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export declare const StyledRewindIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
 export {};

package/dist/components/VideoPlayer/Controls/Controls.styles.js

@@ -3,25 +3,30 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     return cooked;
 };
 import styled from 'styled-components';
-export var StyledControls = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  width: 100%;\n  border-radius: 0px 0px 8px 8px;\n  background: rgba(86, 90, 98, 0.6);\n  backdrop-filter: blur(4px);\n  padding: 12px 16px;\n  position: relative;\n  opacity: 0.8;\n\n\n  svg {\n    cursor: pointer;\n\n    @media screen and (max-width: 1500px) {\n      width: 20px;\n      height: 20px;\n    }\n\n    @media screen and (max-width: 1000px) {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n  & > p {\n    color: var(--neutral-colors-light);\n    font-family: 'Poppins', sans-serif;\n    ", "\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  width: 100%;\n  border-radius: 0px 0px 8px 8px;\n  background: rgba(86, 90, 98, 0.6);\n  backdrop-filter: blur(4px);\n  padding: 12px 16px;\n  position: relative;\n  opacity: 0.8;\n\n\n  svg {\n    cursor: pointer;\n\n    @media screen and (max-width: 1500px) {\n      width: 20px;\n      height: 20px;\n    }\n\n    @media screen and (max-width: 1000px) {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n  & > p {\n    color: var(--neutral-colors-light);\n    font-family: 'Poppins', sans-serif;\n    ", "\n  }\n"])), { fontStyle: 'descriptor' });
-export var StyledSlider = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  height: 2px;\n  border-radius: 5px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n  }\n"], ["\n  width: 100%;\n  height: 2px;\n  border-radius: 5px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n  }\n"])), function (_a) {
+export var StyledControls = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  width: 100%;\n  border-radius: 0px 0px 8px 8px;\n  background: rgba(86, 90, 98, 0.6);\n  backdrop-filter: blur(4px);\n  padding: 12px 16px;\n  position: relative;\n  opacity: 0.8;\n\n  /* Responsive padding adjustments */\n  @media screen and (max-width: 768px) {\n    padding: 8px 12px;\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    padding: 6px 8px;\n    gap: 8px;\n  }\n\n  svg {\n    cursor: pointer;\n    transition: transform 0.2s ease;\n\n    /* Desktop and large screens */\n    @media screen and (min-width: 1501px) {\n      width: 24px;\n      height: 24px;\n    }\n\n    /* Medium to large screens */\n    @media screen and (max-width: 1500px) {\n      width: 20px;\n      height: 20px;\n    }\n\n    /* Small to medium screens */\n    @media screen and (max-width: 1000px) {\n      width: 18px;\n      height: 18px;\n    }\n\n    /* Tablet screens */\n    @media screen and (max-width: 768px) {\n      width: 20px;\n      height: 20px;\n    }\n\n    /* Mobile screens */\n    @media screen and (max-width: 480px) {\n      width: 18px;\n      height: 18px;\n    }\n\n    /* Very small mobile screens */\n    @media screen and (max-width: 320px) {\n      width: 16px;\n      height: 16px;\n    }\n\n    &:hover {\n      transform: scale(1.1);\n    }\n\n    &:active {\n      transform: scale(0.95);\n    }\n  }\n\n  & > p {\n    color: var(--neutral-colors-light);\n    font-family: 'Poppins', sans-serif;\n    ", "\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  width: 100%;\n  border-radius: 0px 0px 8px 8px;\n  background: rgba(86, 90, 98, 0.6);\n  backdrop-filter: blur(4px);\n  padding: 12px 16px;\n  position: relative;\n  opacity: 0.8;\n\n  /* Responsive padding adjustments */\n  @media screen and (max-width: 768px) {\n    padding: 8px 12px;\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    padding: 6px 8px;\n    gap: 8px;\n  }\n\n  svg {\n    cursor: pointer;\n    transition: transform 0.2s ease;\n\n    /* Desktop and large screens */\n    @media screen and (min-width: 1501px) {\n      width: 24px;\n      height: 24px;\n    }\n\n    /* Medium to large screens */\n    @media screen and (max-width: 1500px) {\n      width: 20px;\n      height: 20px;\n    }\n\n    /* Small to medium screens */\n    @media screen and (max-width: 1000px) {\n      width: 18px;\n      height: 18px;\n    }\n\n    /* Tablet screens */\n    @media screen and (max-width: 768px) {\n      width: 20px;\n      height: 20px;\n    }\n\n    /* Mobile screens */\n    @media screen and (max-width: 480px) {\n      width: 18px;\n      height: 18px;\n    }\n\n    /* Very small mobile screens */\n    @media screen and (max-width: 320px) {\n      width: 16px;\n      height: 16px;\n    }\n\n    &:hover {\n      transform: scale(1.1);\n    }\n\n    &:active {\n      transform: scale(0.95);\n    }\n  }\n\n  & > p {\n    color: var(--neutral-colors-light);\n    font-family: 'Poppins', sans-serif;\n    ", "\n  }\n"])), { fontStyle: 'descriptor' });
+export var StyledSlider = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  height: 2px;\n  border-radius: 5px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n\n  /* Enhanced mobile touch target */\n  @media (hover: none) and (pointer: coarse) {\n    height: 4px;\n  }\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n\n    /* Larger touch target for mobile */\n    @media (hover: none) and (pointer: coarse) {\n      width: 16px;\n      height: 16px;\n    }\n\n    /* Responsive adjustments */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n    border: none;\n\n    /* Larger touch target for mobile */\n    @media (hover: none) and (pointer: coarse) {\n      width: 16px;\n      height: 16px;\n    }\n\n    /* Responsive adjustments */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  /* Enhance visibility on focus for accessibility */\n  &:focus {\n    outline: 2px solid var(--brand-colors-accent);\n    outline-offset: 2px;\n  }\n"], ["\n  width: 100%;\n  height: 2px;\n  border-radius: 5px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n\n  /* Enhanced mobile touch target */\n  @media (hover: none) and (pointer: coarse) {\n    height: 4px;\n  }\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n\n    /* Larger touch target for mobile */\n    @media (hover: none) and (pointer: coarse) {\n      width: 16px;\n      height: 16px;\n    }\n\n    /* Responsive adjustments */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--brand-colors-accent);\n    cursor: pointer;\n    border: none;\n\n    /* Larger touch target for mobile */\n    @media (hover: none) and (pointer: coarse) {\n      width: 16px;\n      height: 16px;\n    }\n\n    /* Responsive adjustments */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  /* Enhance visibility on focus for accessibility */\n  &:focus {\n    outline: 2px solid var(--brand-colors-accent);\n    outline-offset: 2px;\n  }\n"])), function (_a) {
     var value = _a.value;
     return "linear-gradient(\n    to right,\n    var(--brand-colors-accent) 0%,\n    var(--brand-colors-accent) ".concat(value, "%,\n    var(--level-dark-200) ").concat(value, "%,\n    var(--level-dark-200) 100%\n  )");
 });
-export var StyledVolumeWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: relative;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n\n  & > svg {\n    cursor: pointer;\n  }\n\n  & > input {\n    display: none;\n  }\n\n  &:hover > input {\n    display: block;\n  }\n"], ["\n  position: relative;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n\n  & > svg {\n    cursor: pointer;\n  }\n\n  & > input {\n    display: none;\n  }\n\n  &:hover > input {\n    display: block;\n  }\n"])));
-export var StyledVolumeSlider = styled.input(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  width: 100px;\n  height: 4px;\n  border-radius: 5px;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n  justify-content: center;\n  align-items: center;\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n  }\n"], ["\n  width: 100px;\n  height: 4px;\n  border-radius: 5px;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n  justify-content: center;\n  align-items: center;\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n  }\n"])), function (_a) {
+export var StyledVolumeWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: relative;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n\n  /* Responsive gap adjustments */\n  @media screen and (max-width: 768px) {\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    gap: 8px;\n  }\n\n  & > svg {\n    cursor: pointer;\n  }\n\n  & > input {\n    display: none;\n  }\n\n  &:hover > input {\n    display: block;\n  }\n\n  /* Always show volume slider on touch devices */\n  @media (hover: none) and (pointer: coarse) {\n    & > input {\n      display: block;\n    }\n  }\n\n  /* Hide volume slider on very small screens */\n  @media screen and (max-width: 320px) {\n    & > input {\n      display: none !important;\n    }\n  }\n"], ["\n  position: relative;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n\n  /* Responsive gap adjustments */\n  @media screen and (max-width: 768px) {\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    gap: 8px;\n  }\n\n  & > svg {\n    cursor: pointer;\n  }\n\n  & > input {\n    display: none;\n  }\n\n  &:hover > input {\n    display: block;\n  }\n\n  /* Always show volume slider on touch devices */\n  @media (hover: none) and (pointer: coarse) {\n    & > input {\n      display: block;\n    }\n  }\n\n  /* Hide volume slider on very small screens */\n  @media screen and (max-width: 320px) {\n    & > input {\n      display: none !important;\n    }\n  }\n"])));
+export var StyledVolumeSlider = styled.input(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  width: 100px;\n  height: 4px;\n  border-radius: 5px;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n  justify-content: center;\n  align-items: center;\n\n  /* Responsive width adjustments */\n  @media screen and (max-width: 768px) {\n    width: 80px;\n  }\n\n  @media screen and (max-width: 480px) {\n    width: 60px;\n  }\n\n  @media screen and (max-width: 320px) {\n    width: 50px;\n  }\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n\n    /* Responsive thumb size */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n    border: none;\n\n    /* Responsive thumb size */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n"], ["\n  width: 100px;\n  height: 4px;\n  border-radius: 5px;\n  background: ", ";\n  outline: none;\n  -webkit-transition: 0.2s;\n  transition: opacity 0.2s;\n  cursor: pointer;\n  justify-content: center;\n  align-items: center;\n\n  /* Responsive width adjustments */\n  @media screen and (max-width: 768px) {\n    width: 80px;\n  }\n\n  @media screen and (max-width: 480px) {\n    width: 60px;\n  }\n\n  @media screen and (max-width: 320px) {\n    width: 50px;\n  }\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n\n    /* Responsive thumb size */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  &::-moz-range-thumb {\n    appearance: none;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background: var(--neutral-colors-light);\n    cursor: pointer;\n    border: none;\n\n    /* Responsive thumb size */\n    @media screen and (max-width: 480px) {\n      width: 14px;\n      height: 14px;\n    }\n  }\n"])), function (_a) {
     var value = _a.value;
     return "linear-gradient(\n    to right,\n    var(--neutral-colors-light) 0%,\n    var(--neutral-colors-light) ".concat(value, "%,\n    var(--level-grey-500) ").concat(value, "%,\n    var(--level-grey-500) 100%\n  )");
 });
-export var StyledControllerLeft = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex: 1;\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex: 1;\n"])));
-export var StyledControllerRight = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n\n  .skip-icon-disabled {\n    cursor: default;\n\n    & > path {\n      fill: var(--level-dark-300);\n    }\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n\n  .skip-icon-disabled {\n    cursor: default;\n\n    & > path {\n      fill: var(--level-dark-300);\n    }\n  }\n"])));
-export var StyledTimeTrack = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  color: #FFFFFF;\n  ", "\n  text-align: right;\n  white-space: nowrap;\n"], ["\n  color: #FFFFFF;\n  ", "\n  text-align: right;\n  white-space: nowrap;\n"])), { fontStyle: 'descriptor' });
-export var StyledHeartIconContainer = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-export var StyledDownloadIconContainer = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg {\n    width: 24px !important;\n    height: 24px !important;\n    \n    @media screen and (max-width: 1500px) {\n      width: 20px !important;\n      height: 20px !important;\n    }\n\n    @media screen and (max-width: 1000px) {\n      width: 16px !important;\n      height: 16px !important;\n    }\n  }\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg {\n    width: 24px !important;\n    height: 24px !important;\n    \n    @media screen and (max-width: 1500px) {\n      width: 20px !important;\n      height: 20px !important;\n    }\n\n    @media screen and (max-width: 1000px) {\n      width: 16px !important;\n      height: 16px !important;\n    }\n  }\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-export var StyledSubtitlesIconContainer = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-export var StyledFullscreenIconContainer = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-export var StyledVolumeIconContainer = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-export var StyledPlayPauseIconContainer = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-export var StyledRewindIconContainer = styled.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  \n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  \n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover > svg > path {\n    fill: #08C694 !important;\n  }\n"])));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14;
+export var StyledControllerLeft = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex: 1;\n  \n  /* Responsive gap adjustments */\n  @media screen and (max-width: 768px) {\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    gap: 8px;\n  }\n\n  @media screen and (max-width: 320px) {\n    gap: 6px;\n  }\n\n  /* Hide rewind/forward controls on very small screens */\n  @media screen and (max-width: 480px) {\n    .rewind-control,\n    .forward-control {\n      display: none;\n    }\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex: 1;\n  \n  /* Responsive gap adjustments */\n  @media screen and (max-width: 768px) {\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    gap: 8px;\n  }\n\n  @media screen and (max-width: 320px) {\n    gap: 6px;\n  }\n\n  /* Hide rewind/forward controls on very small screens */\n  @media screen and (max-width: 480px) {\n    .rewind-control,\n    .forward-control {\n      display: none;\n    }\n  }\n"])));
+export var StyledControllerRight = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n\n  /* Responsive gap adjustments */\n  @media screen and (max-width: 768px) {\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    gap: 8px;\n    \n    /* Hide less essential controls on mobile */\n    .skip-control,\n    .favorite-control,\n    .download-control {\n      display: none;\n    }\n  }\n\n  @media screen and (max-width: 320px) {\n    gap: 6px;\n  }\n\n  .skip-icon-disabled {\n    cursor: default;\n\n    & > path {\n      fill: var(--level-dark-300);\n    }\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n\n  /* Responsive gap adjustments */\n  @media screen and (max-width: 768px) {\n    gap: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    gap: 8px;\n    \n    /* Hide less essential controls on mobile */\n    .skip-control,\n    .favorite-control,\n    .download-control {\n      display: none;\n    }\n  }\n\n  @media screen and (max-width: 320px) {\n    gap: 6px;\n  }\n\n  .skip-icon-disabled {\n    cursor: default;\n\n    & > path {\n      fill: var(--level-dark-300);\n    }\n  }\n"])));
+export var StyledTimeTrack = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  color: #FFFFFF;\n  ", "\n  text-align: right;\n  white-space: nowrap;\n  font-size: 14px;\n  \n  /* Responsive font size adjustments */\n  @media screen and (max-width: 768px) {\n    font-size: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    font-size: 11px;\n  }\n\n  @media screen and (max-width: 320px) {\n    font-size: 10px;\n  }\n"], ["\n  color: #FFFFFF;\n  ", "\n  text-align: right;\n  white-space: nowrap;\n  font-size: 14px;\n  \n  /* Responsive font size adjustments */\n  @media screen and (max-width: 768px) {\n    font-size: 12px;\n  }\n\n  @media screen and (max-width: 480px) {\n    font-size: 11px;\n  }\n\n  @media screen and (max-width: 320px) {\n    font-size: 10px;\n  }\n"
+    // Base styles for icon containers
+])), { fontStyle: 'descriptor' });
+// Base styles for icon containers
+var BaseIconContainer = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  min-width: 24px;\n  min-height: 24px;\n  border-radius: 4px;\n  transition: background-color 0.2s ease, transform 0.1s ease;\n\n  /* Enhanced touch targets for mobile */\n  @media (hover: none) and (pointer: coarse) {\n    min-width: 32px;\n    min-height: 32px;\n  }\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover {\n    background-color: rgba(255, 255, 255, 0.1);\n    \n    & > svg > path {\n      fill: #08C694 !important;\n    }\n  }\n\n  &:active {\n    transform: scale(0.95);\n  }\n\n  /* Focus styles for accessibility */\n  &:focus-visible {\n    outline: 2px solid var(--brand-colors-accent);\n    outline-offset: 2px;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  min-width: 24px;\n  min-height: 24px;\n  border-radius: 4px;\n  transition: background-color 0.2s ease, transform 0.1s ease;\n\n  /* Enhanced touch targets for mobile */\n  @media (hover: none) and (pointer: coarse) {\n    min-width: 32px;\n    min-height: 32px;\n  }\n\n  & > svg > path {\n    fill: #FFFFFF !important;\n    transition: fill 0.2s ease;\n  }\n\n  &:hover {\n    background-color: rgba(255, 255, 255, 0.1);\n    \n    & > svg > path {\n      fill: #08C694 !important;\n    }\n  }\n\n  &:active {\n    transform: scale(0.95);\n  }\n\n  /* Focus styles for accessibility */\n  &:focus-visible {\n    outline: 2px solid var(--brand-colors-accent);\n    outline-offset: 2px;\n  }\n"])));
+export var StyledHeartIconContainer = styled(BaseIconContainer)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  /* Additional specific styles if needed */\n"], ["\n  /* Additional specific styles if needed */\n"])));
+export var StyledDownloadIconContainer = styled(BaseIconContainer)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  & > svg {\n    width: 24px !important;\n    height: 24px !important;\n    \n    @media screen and (max-width: 1500px) {\n      width: 20px !important;\n      height: 20px !important;\n    }\n\n    @media screen and (max-width: 1000px) {\n      width: 16px !important;\n      height: 16px !important;\n    }\n\n    @media screen and (max-width: 768px) {\n      width: 20px !important;\n      height: 20px !important;\n    }\n\n    @media screen and (max-width: 480px) {\n      width: 18px !important;\n      height: 18px !important;\n    }\n  }\n"], ["\n  & > svg {\n    width: 24px !important;\n    height: 24px !important;\n    \n    @media screen and (max-width: 1500px) {\n      width: 20px !important;\n      height: 20px !important;\n    }\n\n    @media screen and (max-width: 1000px) {\n      width: 16px !important;\n      height: 16px !important;\n    }\n\n    @media screen and (max-width: 768px) {\n      width: 20px !important;\n      height: 20px !important;\n    }\n\n    @media screen and (max-width: 480px) {\n      width: 18px !important;\n      height: 18px !important;\n    }\n  }\n"])));
+export var StyledSubtitlesIconContainer = styled(BaseIconContainer)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  /* Additional specific styles if needed */\n"], ["\n  /* Additional specific styles if needed */\n"])));
+export var StyledFullscreenIconContainer = styled(BaseIconContainer)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  /* Additional specific styles if needed */\n"], ["\n  /* Additional specific styles if needed */\n"])));
+export var StyledPictureInPictureIconContainer = styled(BaseIconContainer)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  &.pip-active {\n    background-color: rgba(8, 198, 148, 0.2);\n    \n    & > svg > path {\n      fill: #08C694 !important;\n    }\n  }\n"], ["\n  &.pip-active {\n    background-color: rgba(8, 198, 148, 0.2);\n    \n    & > svg > path {\n      fill: #08C694 !important;\n    }\n  }\n"])));
+export var StyledVolumeIconContainer = styled(BaseIconContainer)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  /* Additional specific styles if needed */\n"], ["\n  /* Additional specific styles if needed */\n"])));
+export var StyledPlayPauseIconContainer = styled(BaseIconContainer)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  /* Additional specific styles if needed */\n"], ["\n  /* Additional specific styles if needed */\n"])));
+export var StyledRewindIconContainer = styled(BaseIconContainer)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  /* Additional specific styles if needed */\n"], ["\n  /* Additional specific styles if needed */\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16;
 //# sourceMappingURL=Controls.styles.js.map

package/dist/components/VideoPlayer/Controls/Controls.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Controls.styles.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/Controls/Controls.styles.tsx"],"names":[],"mappings":";;;;AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,MAAM,CAAC,IAAM,cAAc,GAAG,MAAM,CAAC,GAAG,6qBAAA,+lBA+BlC,EAA2B,SAEhC,KAFK,EAAE,SAAS,EAAE,YAAY,EAAE,CAEhC,CAAA;AAMD,MAAM,CAAC,IAAM,YAAY,GAAG,MAAM,CAAC,KAAK,orBAAa,uHAOrC,EAOZ,wfAwBH,KA/Be,UAAC,EAAS;QAAP,KAAK,WAAA;IACpB,OAAA,8GAG6B,KAAK,2CACV,KAAK,4CAE7B;AANA,CAMA,CAwBH,CAAA;AAED,MAAM,CAAC,IAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,wUAAA,qQAmB5C,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG,MAAM,CAAC,KAAK,6rBAAa,0EAI3C,EAOZ,8iBA0BH,KAjCe,UAAC,EAAS;QAAP,KAAK,WAAA;IACpB,OAAA,gHAG8B,KAAK,2CACX,KAAK,4CAE7B;AANA,CAMA,CA0BH,CAAA;AAED,MAAM,CAAC,IAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,2IAAA,wEAK7C,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,qQAAA,kMAa9C,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,eAAe,GAAG,MAAM,CAAC,GAAG,gJAAA,yBAErC,EAA2B,kDAG9B,KAHG,EAAE,SAAS,EAAE,YAAY,EAAE,CAG9B,CAAA;AAED,MAAM,CAAC,IAAM,wBAAwB,GAAG,MAAM,CAAC,GAAG,4TAAA,yPAcjD,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,2BAA2B,GAAG,MAAM,CAAC,GAAG,ynBAAA,sjBA6BpD,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,4BAA4B,GAAG,MAAM,CAAC,GAAG,8TAAA,yPAcrD,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,6BAA6B,GAAG,MAAM,CAAC,GAAG,8TAAA,yPActD,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,8TAAA,yPAclD,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,4BAA4B,GAAG,MAAM,CAAC,GAAG,8TAAA,yPAcrD,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,kUAAA,6PAelD,IAAA,CAAA"}
+{"version":3,"file":"Controls.styles.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/Controls/Controls.styles.tsx"],"names":[],"mappings":";;;;AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,MAAM,CAAC,IAAM,cAAc,GAAG,MAAM,CAAC,GAAG,olDAAA,sgDA4ElC,EAA2B,SAEhC,KAFK,EAAE,SAAS,EAAE,YAAY,EAAE,CAEhC,CAAA;AAMD,MAAM,CAAC,IAAM,YAAY,GAAG,MAAM,CAAC,KAAK,2+CAAa,uHAOrC,EAOZ,+yCA4DH,KAnEe,UAAC,EAAS;QAAP,KAAK,WAAA;IACpB,OAAA,8GAG6B,KAAK,2CACV,KAAK,4CAE7B;AANA,CAMA,CA4DH,CAAA;AAED,MAAM,CAAC,IAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,myBAAA,guBA0C5C,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG,MAAM,CAAC,KAAK,6rCAAa,0EAI3C,EAOZ,8iCAoDH,KA3De,UAAC,EAAS;QAAP,KAAK,WAAA;IACpB,OAAA,gHAG8B,KAAK,2CACX,KAAK,4CAE7B;AANA,CAMA,CAoDH,CAAA;AAED,MAAM,CAAC,IAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,0iBAAA,ueA0B7C,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,ooBAAA,ikBAiC9C,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,eAAe,GAAG,MAAM,CAAC,GAAG,qaAAA,yBAErC,EAA2B,uUAiB9B;IAED,kCAAkC;KAnB9B,EAAE,SAAS,EAAE,YAAY,EAAE,CAiB9B,CAAA;AAED,kCAAkC;AAClC,IAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,w1BAAA,qxBAsCnC,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,wBAAwB,GAAG,MAAM,CAAC,iBAAiB,CAAC,qHAAA,kDAEhE,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,2BAA2B,GAAG,MAAM,CAAC,iBAAiB,CAAC,4mBAAA,uiBAyBnE,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,4BAA4B,GAAG,MAAM,CAAC,iBAAiB,CAAC,uHAAA,kDAEpE,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,6BAA6B,GAAG,MAAM,CAAC,iBAAiB,CAAC,uHAAA,kDAErE,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,mCAAmC,GAAG,MAAM,CAAC,iBAAiB,CAAC,mNAAA,8IAQ3E,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,yBAAyB,GAAG,MAAM,CAAC,iBAAiB,CAAC,uHAAA,kDAEjE,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,4BAA4B,GAAG,MAAM,CAAC,iBAAiB,CAAC,uHAAA,kDAEpE,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,yBAAyB,GAAG,MAAM,CAAC,iBAAiB,CAAC,uHAAA,kDAEjE,IAAA,CAAA"}

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

@@ -1,4 +1,4 @@
 import { ReactElement } from 'react';
 import { PlayerProps } from './Player.interface';
-export declare const VideoPlayer: ({ customStyles, startTime, loading, setLoading, handleTrackProgress, url, subtitle: subtitleUrl, handleNextVideo, handlePreviousVideo, isNextVideo, isPreviousVideo, isPlaying, setIsPlaying, shouldPlayerBeFocusedOnSpaceClick, showFavorite, isFavorite, toggleFavorite, showDownload, downloadUrl, downloadFileName, onDownload, }: PlayerProps) => ReactElement;
+export declare const VideoPlayer: ({ customStyles, startTime, loading, setLoading, handleTrackProgress, url, subtitle: subtitleUrl, handleNextVideo, handlePreviousVideo, isNextVideo, isPreviousVideo, isPlaying, setIsPlaying, shouldPlayerBeFocusedOnSpaceClick, showFavorite, isFavorite, toggleFavorite, showDownload, downloadUrl, downloadFileName, onDownload, showPictureInPicture, }: PlayerProps) => ReactElement;
 export default VideoPlayer;

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

@@ -34,6 +34,7 @@ export interface PlayerProps {
     downloadUrl?: string;
     downloadFileName?: string;
     onDownload?: () => void;
+    showPictureInPicture?: boolean;
 }
 export interface UsePlayerControlsProps {
     startTime?: number;
@@ -61,6 +62,8 @@ export interface UsePlayerControlsState extends Omit<ControlsProps, 'isFavorite'
     onPlayerStart: () => void;
     controlRef: RefObject<HTMLDivElement>;
     isFullscreen: boolean;
+    isPiPActive: boolean;
+    handlePictureInPicture: () => void;
     isControlsActive: boolean;
     currentSubtitle: string;
     setCurrentSubtitle: Dispatch<SetStateAction<string>>;

package/dist/components/VideoPlayer/Player.js

@@ -56,9 +56,9 @@ export var VideoPlayer = function (_a) {
     var _b, _c, _d;
     var customStyles = _a.customStyles, _e = _a.startTime, startTime = _e === void 0 ? 0 : _e, loading = _a.loading, setLoading = _a.setLoading, handleTrackProgress = _a.handleTrackProgress, url = _a.url, subtitleUrl = _a.subtitle, handleNextVideo = _a.handleNextVideo, handlePreviousVideo = _a.handlePreviousVideo, isNextVideo = _a.isNextVideo, isPreviousVideo = _a.isPreviousVideo, isPlaying = _a.isPlaying, setIsPlaying = _a.setIsPlaying, _f = _a.shouldPlayerBeFocusedOnSpaceClick, shouldPlayerBeFocusedOnSpaceClick = _f === void 0 ? false : _f, showFavorite = _a.showFavorite, _g = _a.isFavorite, isFavorite = _g === void 0 ? false : _g, _h = _a.toggleFavorite, toggleFavorite = _h === void 0 ? function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
         return [2 /*return*/];
-    }); }); } : _h, showDownload = _a.showDownload, downloadUrl = _a.downloadUrl, downloadFileName = _a.downloadFileName, onDownload = _a.onDownload;
+    }); }); } : _h, showDownload = _a.showDownload, downloadUrl = _a.downloadUrl, downloadFileName = _a.downloadFileName, onDownload = _a.onDownload, _j = _a.showPictureInPicture, showPictureInPicture = _j === void 0 ? true : _j;
     var videoRef = useRef(null);
-    var _j = usePlayerControls({
+    var _k = usePlayerControls({
         startTime: startTime,
         setLoading: setLoading,
         handleTrackProgress: handleTrackProgress,
@@ -67,7 +67,7 @@ export var VideoPlayer = function (_a) {
         isPlaying: isPlaying,
         setIsPlaying: setIsPlaying,
         shouldPlayerBeFocusedOnSpaceClick: shouldPlayerBeFocusedOnSpaceClick,
-    }), mouseMoveHandler = _j.mouseMoveHandler, playerContainerRef = _j.playerContainerRef, playPauseHandler = _j.playPauseHandler, handleFullScreen = _j.handleFullScreen, videoPlayerRef = _j.videoPlayerRef, playing = _j.playing, volume = _j.volume, muted = _j.muted, progressHandler = _j.progressHandler, bufferStartHandler = _j.bufferStartHandler, bufferEndHandler = _j.bufferEndHandler, onPlayerStart = _j.onPlayerStart, setVideoState = _j.setVideoState, playbackRate = _j.playbackRate, controlRef = _j.controlRef, rewindHandler = _j.rewindHandler, handleFastForward = _j.handleFastForward, formatCurrentTime = _j.formatCurrentTime, played = _j.played, onSeekMouseDownHandler = _j.onSeekMouseDownHandler, seekHandler = _j.seekHandler, seekMouseUpHandler = _j.seekMouseUpHandler, muteHandler = _j.muteHandler, volumeChangeHandler = _j.volumeChangeHandler, formatDuration = _j.formatDuration, isSubtitlesChecked = _j.isSubtitlesChecked, toggleSubtitlesCheck = _j.toggleSubtitlesCheck, isFullscreen = _j.isFullscreen, isControlsActive = _j.isControlsActive, currentSubtitle = _j.currentSubtitle, setCurrentSubtitle = _j.setCurrentSubtitle;
+    }), mouseMoveHandler = _k.mouseMoveHandler, playerContainerRef = _k.playerContainerRef, playPauseHandler = _k.playPauseHandler, handleFullScreen = _k.handleFullScreen, handlePictureInPicture = _k.handlePictureInPicture, videoPlayerRef = _k.videoPlayerRef, playing = _k.playing, volume = _k.volume, muted = _k.muted, progressHandler = _k.progressHandler, bufferStartHandler = _k.bufferStartHandler, bufferEndHandler = _k.bufferEndHandler, onPlayerStart = _k.onPlayerStart, setVideoState = _k.setVideoState, playbackRate = _k.playbackRate, controlRef = _k.controlRef, rewindHandler = _k.rewindHandler, handleFastForward = _k.handleFastForward, formatCurrentTime = _k.formatCurrentTime, played = _k.played, onSeekMouseDownHandler = _k.onSeekMouseDownHandler, seekHandler = _k.seekHandler, seekMouseUpHandler = _k.seekMouseUpHandler, muteHandler = _k.muteHandler, volumeChangeHandler = _k.volumeChangeHandler, formatDuration = _k.formatDuration, isSubtitlesChecked = _k.isSubtitlesChecked, toggleSubtitlesCheck = _k.toggleSubtitlesCheck, isFullscreen = _k.isFullscreen, isPiPActive = _k.isPiPActive, isControlsActive = _k.isControlsActive, currentSubtitle = _k.currentSubtitle, setCurrentSubtitle = _k.setCurrentSubtitle;
     var setupHLSSubtitleTracking = useHLSSubtitles({
         videoPlayerRef: videoPlayerRef,
         isSubtitlesChecked: isSubtitlesChecked,
@@ -102,7 +102,7 @@ export var VideoPlayer = function (_a) {
                                     renderTextTracksNatively: true,
                                 },
                             },
-                        } }, url), loading && (_jsx(StyledPlayerLoader, { children: _jsx(StyledLoader, {}) })), isSubtitlesChecked && currentSubtitle && (_jsx(StyledSubtitles, { "$controls": isControlsActive, children: currentSubtitle }))] }), _jsx(StyledControlsContainer, { ref: controlRef, children: _jsx(Controls, { setVideoState: setVideoState, playbackRate: playbackRate, rewindHandler: rewindHandler, playPauseHandler: playPauseHandler, handleFastForward: handleFastForward, formatCurrentTime: formatCurrentTime, played: played, onSeekMouseDownHandler: onSeekMouseDownHandler, seekHandler: seekHandler, seekMouseUpHandler: seekMouseUpHandler, volume: volume, muted: muted, muteHandler: muteHandler, volumeChangeHandler: volumeChangeHandler, formatDuration: formatDuration, handleFullScreen: handleFullScreen, playing: playing, isSubtitlesChecked: isSubtitlesChecked, toggleSubtitlesCheck: toggleSubtitlesCheck, isFavorite: isFavorite, toggleIsFavorite: toggleFavorite, isFullscreen: isFullscreen, subtitle: !!subtitleUrl || ((_d = (_c = (_b = videoPlayerRef.current) === null || _b === void 0 ? void 0 : _b.getInternalPlayer()) === null || _c === void 0 ? void 0 : _c.textTracks) === null || _d === void 0 ? void 0 : _d.length) > 0, handleSkipBackward: handlePreviousVideo, handleSkipForward: handleNextVideo, isNextVideo: isNextVideo, isPreviousVideo: isPreviousVideo, showFavorite: showFavorite, showDownload: showDownload, downloadUrl: downloadUrl, downloadFileName: downloadFileName, onDownload: onDownload }) })] }));
+                        } }, url), loading && (_jsx(StyledPlayerLoader, { children: _jsx(StyledLoader, {}) })), isSubtitlesChecked && currentSubtitle && (_jsx(StyledSubtitles, { "$controls": isControlsActive, children: currentSubtitle }))] }), _jsx(StyledControlsContainer, { ref: controlRef, children: _jsx(Controls, { setVideoState: setVideoState, playbackRate: playbackRate, rewindHandler: rewindHandler, playPauseHandler: playPauseHandler, handleFastForward: handleFastForward, formatCurrentTime: formatCurrentTime, played: played, onSeekMouseDownHandler: onSeekMouseDownHandler, seekHandler: seekHandler, seekMouseUpHandler: seekMouseUpHandler, volume: volume, muted: muted, muteHandler: muteHandler, volumeChangeHandler: volumeChangeHandler, formatDuration: formatDuration, handleFullScreen: handleFullScreen, handlePictureInPicture: handlePictureInPicture, playing: playing, isSubtitlesChecked: isSubtitlesChecked, toggleSubtitlesCheck: toggleSubtitlesCheck, isFavorite: isFavorite, toggleIsFavorite: toggleFavorite, isFullscreen: isFullscreen, isPiPActive: isPiPActive, subtitle: !!subtitleUrl || ((_d = (_c = (_b = videoPlayerRef.current) === null || _b === void 0 ? void 0 : _b.getInternalPlayer()) === null || _c === void 0 ? void 0 : _c.textTracks) === null || _d === void 0 ? void 0 : _d.length) > 0, handleSkipBackward: handlePreviousVideo, handleSkipForward: handleNextVideo, isNextVideo: isNextVideo, isPreviousVideo: isPreviousVideo, showFavorite: showFavorite, showDownload: showDownload, downloadUrl: downloadUrl, downloadFileName: downloadFileName, onDownload: onDownload, showPictureInPicture: showPictureInPicture }) })] }));
 };
 export default VideoPlayer;
 //# sourceMappingURL=Player.js.map

package/dist/components/VideoPlayer/Player.js.map

@@ -1 +1 @@
-{"version":3,"file":"Player.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/Player.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Player.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/Player.tsx"],"names":[],"mappings":"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"}

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

@@ -11,3 +11,4 @@ export declare const NoControls: Story;
 export declare const WithDownload: Story;
 export declare const DownloadOnly: Story;
 export declare const AllFeatures: Story;
+export declare const WithoutPictureInPicture: Story;

package/dist/components/VideoPlayer/VideoPlayer.stories.js

@@ -125,6 +125,11 @@ var meta = {
             control: 'text',
             description: 'Filename for the downloaded video',
         },
+        showPictureInPicture: {
+            control: 'boolean',
+            description: 'Show picture-in-picture button',
+            defaultValue: true,
+        },
     },
 };
 export default meta;
@@ -176,6 +181,7 @@ var PlayerWrapper = function (args) {
         downloadUrl: args.downloadUrl,
         downloadFileName: args.downloadFileName,
         onDownload: args.showDownload ? handleDownload : undefined,
+        showPictureInPicture: args.showPictureInPicture !== false,
     };
     return _jsx(VideoPlayer, __assign({}, allProps));
 };
@@ -227,4 +233,9 @@ export var AllFeatures = {
     render: function (args) { return _jsx(PlayerWrapper, __assign({}, args)); },
     args: __assign(__assign({}, Default.args), { showDownload: true, downloadUrl: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8', downloadFileName: 'complete-lesson.mp4', subtitle: 'https://example.com/subtitles.vtt', isFavorite: true }),
 };
+// Without Picture-in-Picture
+export var WithoutPictureInPicture = {
+    render: function (args) { return _jsx(PlayerWrapper, __assign({}, args)); },
+    args: __assign(__assign({}, Default.args), { showPictureInPicture: false }),
+};
 //# sourceMappingURL=VideoPlayer.stories.js.map