@ludo.ninja/components 2.3.4 → 2.3.6

package/build/components/Page500/index.js

@@ -1,87 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const mainLayout_1 = __importDefault(require("../../layouts/custom/mainLayout"));
-const env_1 = require("../../store/env");
-const ScreenWidth_1 = require("../../styles/ScreenWidth");
-const MainButton_1 = __importDefault(require("../../system/Buttons/MainButton"));
-const index_1 = require("../../system/index");
-const constants_1 = require("@ludo.ninja/core/build/constants");
-const ludoDomains_1 = require("@ludo.ninja/core/build/ludoDomains");
-const colors_1 = require("@ludo.ninja/ui/build/styles/colors");
-const router_1 = require("next/router");
-const styled_components_1 = __importDefault(require("styled-components"));
-// Styles
-const StyledInternalErrorPage = styled_components_1.default.div `
-  .internalErrorContent {
-    .internalErrorButton {
-      max-width: 230px;
-    }
-
-    .internalErrorCaption {
-      font-weight: 700;
-      font-size: 3.8em;
-      line-height: 1.37em;
-      color: ${colors_1.TextGrayColor};
-      margin-bottom: 0;
-    }
-
-    .internalErrorIcon {
-      width: 337px;
-      height: 329px;
-      img {
-        width: inherit;
-        height: inherit;
-      }
-    }
-
-    ${ScreenWidth_1.mediaQuery.tablet} {
-      flex-direction: column-reverse;
-
-      .internalErrorText {
-        margin: 40px 0 0 0;
-        text-align: center;
-      }
-
-      .internalErrorIcon {
-        width: 286px;
-        height: 280px;
-      }
-
-      .internalErrorCaption {
-        font-size: 3em;
-        line-height: 1.6em;
-      }
-
-      .internalErrorButton {
-        margin: 30px auto 0 auto;
-      }
-    }
-
-    ${ScreenWidth_1.mediaQuery.phone} {
-      .internalErrorIcon {
-        width: 218px;
-        height: 212px;
-      }
-    }
-  }
-`;
-// Component
-const InternalErrorPage = () => {
-    const router = (0, router_1.useRouter)();
-    const NEXT_PUBLIC_ENV_VALUE = (0, env_1.useEnvStore)((state) => state.NEXT_PUBLIC_ENV_VALUE);
-    const redirectToHomePage = () => {
-        const appDomain = ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"];
-        if (window.origin === appDomain) {
-            router.push("/");
-        }
-        else {
-            window.open(appDomain, "_self");
-        }
-    };
-    return ((0, jsx_runtime_1.jsx)(mainLayout_1.default, { children: (0, jsx_runtime_1.jsx)(StyledInternalErrorPage, { children: (0, jsx_runtime_1.jsxs)(index_1.Flex, { className: "internalErrorContent", justifyContent: "center", alignItems: "center", children: [(0, jsx_runtime_1.jsxs)(index_1.Box, { mr: [97], className: "internalErrorText", children: [(0, jsx_runtime_1.jsx)("h1", { className: "internalErrorCaption", children: "Sorry, unexpected error." }), (0, jsx_runtime_1.jsxs)(index_1.H1, { color: colors_1.TextGrayColor, mt: [14], children: ["We are working on fixing the problem.", (0, jsx_runtime_1.jsx)("br", {}), " Please try again later"] }), (0, jsx_runtime_1.jsx)(index_1.Box, { className: "internalErrorButton", mt: [36], children: (0, jsx_runtime_1.jsx)(MainButton_1.default, { onClick: redirectToHomePage, variant: "primaryL", text: "Go to Main page" }) })] }), (0, jsx_runtime_1.jsx)(index_1.Box, { children: (0, jsx_runtime_1.jsx)("div", { className: "internalErrorIcon", children: (0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/500/500.svg`, alt: "500" }) }) })] }) }) }));
-};
-exports.default = InternalErrorPage;

package/build/components/assetPage/assetLikes/index.d.ts

@@ -1,6 +0,0 @@
-declare const AssetLikes: ({ assetId, likesByUser, isLikedByUser, }: {
-    assetId: string;
-    likesByUser: number;
-    isLikedByUser: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
-export default AssetLikes;

package/build/components/assetPage/assetLikes/index.js

@@ -1,58 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const types_1 = require("../../../entities/labelCreationType/types");
-const likes_1 = __importDefault(require("../../../hooks/likes"));
-const store_1 = require("../../../modules/user/store");
-const heart_svg_1 = __importDefault(require("../../../public/showCaseIcons/heart"));
-const IconWithButton_1 = __importDefault(require("../../../system/Buttons/IconWithButton"));
-const check4k_1 = require("../../../utils/adaptive/check4k");
-const scale_1 = require("../../../utils/adaptive/scale");
-const auth_1 = require("../../../utils/auth");
-const screen_1 = require("../../../utils/screen");
-const react_loading_skeleton_1 = __importDefault(require("react-loading-skeleton"));
-const AssetLikes = ({ assetId, likesByUser, isLikedByUser, }) => {
-    const redirectToLoginWindow = (0, auth_1.useRedirectToLoginWindow)();
-    const isSignedIn = (0, store_1.useUserStore)((state) => state.isSignedIn);
-    const { likes, addLike, deleteLike, isLoading } = (0, likes_1.default)({
-        defaultLikesCount: likesByUser,
-        defaultIsLiked: isLikedByUser,
-        itemType: types_1.LabelKeys.asset,
-    });
-    const handleLikes = (isLiked) => {
-        if (!isSignedIn) {
-            redirectToLoginWindow();
-        }
-        else {
-            !isLiked ? addLike(assetId) : deleteLike(assetId);
-        }
-    };
-    const onLikeBtnClick = () => handleLikes(likes.isLiked);
-    const { windowDimensions } = (0, screen_1.useWindowDimensionsWithServerInitial)();
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isLoading ? ((0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { style: {
-                borderRadius: `${(0, check4k_1.getAdaptiveValueWithCheck4k)({
-                    windowDimensions,
-                    currentSize: 3,
-                })}px`,
-                marginRight: `${(0, check4k_1.getAdaptiveValueWithCheck4k)({
-                    windowDimensions,
-                    currentSize: 16.8,
-                })}px`,
-            }, height: "100%", width: `${(0, check4k_1.getAdaptiveValueWithCheck4k)({
-                windowDimensions,
-                currentSize: 30,
-            })}px` })) : ((0, jsx_runtime_1.jsx)(IconWithButton_1.default, { variant: "figcaption", text: likes.likesCount, onClick: onLikeBtnClick, children: (0, jsx_runtime_1.jsx)("div", { style: {
-                    width: `${(0, check4k_1.getAdaptiveValueWithCheck4k)({
-                        windowDimensions,
-                        currentSize: 18,
-                    })}px`,
-                    height: `${(0, check4k_1.getAdaptiveValueWithCheck4k)({
-                        windowDimensions,
-                        currentSize: 18,
-                    })}px`,
-                }, children: (0, jsx_runtime_1.jsx)(heart_svg_1.default, { className: `icon ${likes.isLiked ? "liked" : ""}`, style: (0, scale_1.getAdaptiveScale)({ windowDimensions, currentSize: 1 }) }) }) })) }));
-};
-exports.default = AssetLikes;

package/build/components/assetPage/assetNft/index.d.ts

@@ -1,4 +0,0 @@
-import { assetSchema as schema } from "@ludo.ninja/api";
-type AssetMediaProps = Pick<schema.IAsset, "medias">;
-export declare const AssetMedia: ({ medias }: AssetMediaProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/build/components/assetPage/assetNft/index.js

@@ -1,37 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AssetMedia = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = __importDefault(require("styled-components"));
-const core_1 = require("@ludo.ninja/core");
-const ScreenWidth_1 = require("../../../styles/ScreenWidth");
-const index_1 = require("../../../system/index");
-const ResponsiveImage = (0, styled_components_1.default)(index_1.ExternalImage) `
-  max-width: 320px;
-  max-height: 320px;
-
-  ${ScreenWidth_1.mediaQuery.tablet} {
-    max-width: 336px;
-    max-height: 336px;
-  }
-
-  ${ScreenWidth_1.mediaQuery.desktop} {
-    max-width: 508px;
-    max-height: 508px;
-  }
-`;
-const EmptyState = () => ((0, jsx_runtime_1.jsx)(index_1.Flex, { justifyContent: "center", children: (0, jsx_runtime_1.jsx)(index_1.Box, { borderRadius: 16, overflow: "hidden" }) }));
-const AssetMedia = ({ medias }) => {
-    if (!medias?.length || medias.length > 1 || !medias[0])
-        return (0, jsx_runtime_1.jsx)(EmptyState, {});
-    const [media] = medias;
-    const { url, mimeType } = media;
-    if (url && (0, core_1.isImage)({ media: url, mimeType, originalMimeType: null })) {
-        return ((0, jsx_runtime_1.jsx)(index_1.Flex, { justifyContent: "center", children: (0, jsx_runtime_1.jsx)(index_1.Box, { borderRadius: 16, overflow: "hidden", children: (0, jsx_runtime_1.jsx)(ResponsiveImage, { src: url }) }) }));
-    }
-    return (0, jsx_runtime_1.jsx)(EmptyState, {});
-};
-exports.AssetMedia = AssetMedia;

package/build/components/assetPage/audioVideoPlayer/Duration.d.ts

@@ -1,5 +0,0 @@
-type DurationProps = {
-    seconds: number;
-};
-export default function Duration({ seconds }: DurationProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/build/components/assetPage/audioVideoPlayer/Duration.js

@@ -1,22 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = Duration;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const colors_1 = require("../../../styles/colors");
-const index_1 = require("../../../system/index");
-function Duration({ seconds }) {
-    return ((0, jsx_runtime_1.jsx)("time", { dateTime: `P${Math.round(seconds)}S`, children: (0, jsx_runtime_1.jsx)(index_1.H5, { color: colors_1.InactiveButtonColor, children: format(seconds) }) }));
-}
-function format(seconds) {
-    const date = new Date(seconds * 1000);
-    const hh = date.getUTCHours();
-    const mm = date.getUTCMinutes();
-    const ss = pad(date.getUTCSeconds());
-    if (hh) {
-        return `${hh}:${pad(mm)}:${ss}`;
-    }
-    return `${mm}:${ss}`;
-}
-function pad(string) {
-    return ('0' + string).slice(-2);
-}

package/build/components/assetPage/audioVideoPlayer/index.d.ts

@@ -1,96 +0,0 @@
-import React, { Component } from 'react';
-import ReactPlayer from 'react-player';
-export interface ReactPlayerProps {
-    playerType: string;
-    isLoading?: boolean;
-    poster?: string | undefined | null;
-    src?: string | null;
-    playing?: boolean;
-    loop?: boolean;
-    controls?: boolean;
-    volume?: number;
-    playbackRate?: number;
-    width?: string | number;
-    height?: string | number;
-    hidden?: boolean;
-    className?: string;
-    style?: object;
-    progressFrequency?: number;
-    soundcloudConfig?: {
-        clientId: string;
-        showArtwork: boolean;
-    };
-    youtubeConfig?: {
-        playerVars: object;
-        preload: boolean;
-    };
-    vimeoConfig?: {
-        iframeParams: object;
-        preload: boolean;
-    };
-    fileConfig?: {
-        attributes: object;
-    };
-    onReady?(): void;
-    onStart?(): void;
-    onPlay?(): void;
-    onPause?(): void;
-    onBuffer?(): void;
-    onEnded?(): void;
-    onError?(error: unknown): void;
-    onDuration?(duration: number): void;
-    onProgress?(state: {
-        played: number;
-        loaded: number;
-    }): void;
-}
-export interface OnProgressProps {
-    played: number;
-    playedSeconds: number;
-    loaded: number;
-    loadedSeconds: number;
-}
-export interface PlayerStateTypes {
-    url: string | null | undefined;
-    playing: boolean;
-    controls: boolean;
-    light: boolean;
-    volume: number;
-    muted: boolean;
-    played: number;
-    duration: number;
-    playedSeconds: number;
-    seeking: boolean;
-    loaded: number;
-    loadedSeconds: number;
-    error: boolean;
-    isFullscreenMode: boolean;
-}
-export declare const ReactPlayerWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    poster: string | null | undefined;
-    playerType: string;
-    isFullscreenMode: boolean;
-}, never>;
-export declare class AudioVideoPlayer extends Component<ReactPlayerProps, PlayerStateTypes> {
-    private player;
-    constructor(props: ReactPlayerProps);
-    load: (url: string) => void;
-    handlePlayPause: () => void;
-    handleVolumeChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    handleToggleMuted: () => void;
-    handlePlay: () => void;
-    handlePause: () => void;
-    handleSeekMouseDown: () => void;
-    handleSeekChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    handleSeekMouseUp: (e: React.MouseEvent<HTMLInputElement>) => void;
-    handleProgress: (state: OnProgressProps) => void;
-    handleDuration: (duration: number) => void;
-    handleClickFullscreen: () => void;
-    handleErrors: () => void;
-    renderLoadButton: (url: string, label: string) => import("react/jsx-runtime").JSX.Element;
-    ref: (player: ReactPlayer) => void;
-    updateIsFullscreenMode: () => void;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): import("react/jsx-runtime").JSX.Element | null;
-}

package/build/components/assetPage/audioVideoPlayer/index.js

@@ -1,308 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AudioVideoPlayer = exports.ReactPlayerWrapper = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const image_1 = __importDefault(require("next/image"));
-const react_loading_skeleton_1 = __importDefault(require("react-loading-skeleton"));
-const react_player_1 = __importDefault(require("react-player"));
-const screenfull_1 = __importDefault(require("screenfull"));
-const styled_components_1 = __importStar(require("styled-components"));
-const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
-const ScreenWidth_1 = require("../../../styles/ScreenWidth");
-const colors_1 = require("../../../styles/colors");
-const index_1 = require("../../../system/index");
-const Duration_1 = __importDefault(require("./Duration"));
-exports.ReactPlayerWrapper = styled_components_1.default.div `
-  position: relative;
-  width: 510px;
-  height: ${(props) => (props.playerType === 'audio' ? '280px' : 'auto')};
-  display: flex;
-  margin-right: 60px;
-  background-image: url('${(props) => props.playerType === 'audio'
-    ? props.poster || '/assetPage/audioPlaceholder.svg'
-    : null}');
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: cover;
-  border-radius: 16px;
-  overflow: hidden;
-
-  ${ScreenWidth_1.mediaQuery.desktop} {
-    height: ${(props) => (props.playerType === 'audio' ? '180px' : 'auto')};
-    align-items: flex-start;
-    width: 335px;
-    margin-right: 30px;
-  }
-
-  ${ScreenWidth_1.mediaQuery.tablet} {
-    margin-right: 0;
-  }
-
-  .player {
-    display: flex;
-    height: auto !important;
-    border-radius: 16px;
-    overflow: hidden;
-    ${(props) => props.isFullscreenMode
-    ? (0, styled_components_1.css) `
-            width: 100% !important;
-          `
-    : ''}
-  }
-
-  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-    width: ${(0, _4k_1.adaptiveValueCalc)(510)};
-    height: ${(props) => props.playerType === 'audio' ? (0, _4k_1.adaptiveValueCalc)(280) : 'auto'};
-    margin-right: ${(0, _4k_1.adaptiveValueCalc)(60)};
-    border-radius: ${(0, _4k_1.adaptiveValueCalc)(16)};
-
-    .player {
-      border-radius: ${(0, _4k_1.adaptiveValueCalc)(16)};
-    }
-  }
-`;
-const InputRangeVolume = styled_components_1.default.div `
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: column;
-  position: relative;
-
-  &:before {
-    content: '';
-    display: flex;
-    position: absolute;
-    transition: 0.5s color ease;
-    left: 0;
-    width: ${(props) => props.value * 100}%;
-    height: 5px;
-    background: #ebf0fc;
-
-    ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-      height: ${(0, _4k_1.adaptiveValueCalc)(5)};
-    }
-  }
-`;
-const InputRangeSound = (0, styled_components_1.default)(InputRangeVolume) `
-  width: 70px;
-
-  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-    width: ${(0, _4k_1.adaptiveValueCalc)(70)};
-  }
-
-  &:before {
-    background: #b0b2c0;
-  }
-`;
-const FlexHelper = (0, styled_components_1.default)(index_1.Flex) `
-  justify-content: space-between;
-  padding: 25px;
-
-  ${ScreenWidth_1.mediaQuery.desktop} {
-    padding: 20px;
-  }
-
-  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-    padding: ${(0, _4k_1.adaptiveValueCalc)(25)};
-  }
-`;
-const InputRange = styled_components_1.default.input `
-  width: 100%;
-  -webkit-appearance: none;
-  position: relative;
-  opacity: 0.5;
-  -moz-appearance: none;
-  cursor: pointer;
-
-  &::-webkit-slider-thumb {
-    opacity: 0;
-  }
-
-  &:focus {
-    outline: none;
-  }
-
-  &::-webkit-slider-runnable-track {
-    background: #909999;
-    height: 5px;
-    ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-      height: ${(0, _4k_1.adaptiveValueCalc)(5)};
-    }
-  }
-`;
-const Controls = styled_components_1.default.div `
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  position: absolute;
-  bottom: 0;
-`;
-const ControlButton = styled_components_1.default.button `
-  padding: 0;
-  background: transparent;
-  position: relative;
-  border: none;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1;
-  user-select: none;
-  outline: none;
-
-  * {
-    user-select: none;
-  }
-
-  &:before {
-    position: absolute;
-    content: '';
-    width: 36px;
-    height: 36px;
-    border-radius: 50%;
-    background: ${colors_1.BlackColor};
-    opacity: 0.5;
-    z-index: -1;
-    ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-      height: ${(0, _4k_1.adaptiveValueCalc)(36)};
-      width: ${(0, _4k_1.adaptiveValueCalc)(36)};
-    }
-  }
-
-  &:hover {
-    &:before {
-      opacity: 0.6;
-    }
-  }
-  img {
-    width: 15px;
-    height: 15px;
-    ${ScreenWidth_1.mediaQuery.minWidthFourK} {
-      height: ${(0, _4k_1.adaptiveValueCalc)(15)};
-      width: ${(0, _4k_1.adaptiveValueCalc)(15)};
-    }
-  }
-`;
-class AudioVideoPlayer extends react_1.Component {
-    player;
-    constructor(props) {
-        super(props);
-        this.state = {
-            url: this.props.src,
-            playing: false,
-            controls: false,
-            light: false,
-            volume: 0.8,
-            muted: false,
-            played: 0,
-            duration: 0,
-            playedSeconds: 0,
-            seeking: false,
-            loaded: 0,
-            loadedSeconds: 0,
-            error: false,
-            isFullscreenMode: false,
-        };
-    }
-    load = (url) => {
-        this.setState({
-            url,
-            played: 0,
-        });
-    };
-    handlePlayPause = () => {
-        this.setState({ playing: !this.state.playing });
-    };
-    handleVolumeChange = (e) => {
-        this.setState({ volume: parseFloat(e.target.value) });
-    };
-    handleToggleMuted = () => {
-        this.setState({
-            muted: !this.state.muted,
-            volume: 0,
-        });
-    };
-    handlePlay = () => {
-        this.setState({ playing: true });
-    };
-    handlePause = () => {
-        this.setState({ playing: false });
-    };
-    handleSeekMouseDown = () => {
-        this.setState({ seeking: true });
-    };
-    handleSeekChange = (e) => {
-        this.setState({ played: parseFloat(e.target.value) });
-    };
-    handleSeekMouseUp = (e) => {
-        this.setState({ seeking: false });
-        const event = e.target.value;
-        this.player?.seekTo(parseFloat(event));
-    };
-    handleProgress = (state) => {
-        if (!this.state.seeking) {
-            this.setState(state);
-        }
-    };
-    handleDuration = (duration) => {
-        this.setState({ duration });
-    };
-    handleClickFullscreen = () => {
-        const elem = document.getElementById('video-player');
-        screenfull_1.default.toggle(elem);
-    };
-    handleErrors = () => {
-        this.setState({ error: true });
-    };
-    renderLoadButton = (url, label) => {
-        return (0, jsx_runtime_1.jsx)("button", { onClick: () => this.load(url), children: label });
-    };
-    ref = (player) => {
-        this.player = player;
-    };
-    updateIsFullscreenMode = () => {
-        this.setState({
-            isFullscreenMode: screenfull_1.default.isFullscreen,
-        });
-    };
-    componentDidMount() {
-        screenfull_1.default.on('change', this.updateIsFullscreenMode);
-    }
-    componentWillUnmount() {
-        screenfull_1.default.off('change', this.updateIsFullscreenMode);
-    }
-    render() {
-        const { url, playing, light, volume, muted, played, duration, playedSeconds, error, isFullscreenMode, } = this.state;
-        if (!url)
-            return null;
-        return ((0, jsx_runtime_1.jsx)(exports.ReactPlayerWrapper, { id: 'video-player', playerType: this.props.playerType, poster: this.props.poster, isFullscreenMode: isFullscreenMode, children: this.props.isLoading ? ((0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { style: { position: 'absolute', left: 0, top: 0 }, height: "100%", width: "100%" })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: error && this.props.playerType !== 'audio' ? ((0, jsx_runtime_1.jsx)(image_1.default, { width: 508, height: 216, alt: 'audioPlaceholder', src: `/assetPage/audioPlaceholder.svg` })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !error && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_player_1.default, { className: "player", id: this.props.playerType, url: url, playing: playing, light: light, volume: volume, playsinline: true, muted: muted, ref: this.ref, controls: false, onPlay: this.handlePlay, onPause: this.handlePause, onError: this.handleErrors, onProgress: this.handleProgress, onDuration: this.handleDuration }), (0, jsx_runtime_1.jsxs)(Controls, { children: [(0, jsx_runtime_1.jsxs)(index_1.Flex, { p: "0 15px 5px", justifyContent: "space-between", children: [(0, jsx_runtime_1.jsx)(Duration_1.default, { seconds: playedSeconds }), (0, jsx_runtime_1.jsx)(Duration_1.default, { seconds: duration })] }), (0, jsx_runtime_1.jsx)(InputRangeVolume, { value: played, children: (0, jsx_runtime_1.jsx)(InputRange, { type: "range", min: 0, max: 0.99, step: "any", value: played, onMouseDown: this.handleSeekMouseDown, onChange: this.handleSeekChange, onMouseUp: this.handleSeekMouseUp }) }), (0, jsx_runtime_1.jsxs)(FlexHelper, { children: [(0, jsx_runtime_1.jsxs)(index_1.Flex, { children: [(0, jsx_runtime_1.jsx)(ControlButton, { style: { marginRight: '45px' }, onClick: this.handlePlayPause, children: (0, jsx_runtime_1.jsx)(image_1.default, { width: 15, height: 15, alt: playing ? 'Play' : 'pause', src: `/assetPage/${playing ? 'pause' : 'play'}.svg` }) }), (0, jsx_runtime_1.jsx)(ControlButton, { style: { marginRight: '20px' }, onClick: this.handleToggleMuted, children: (0, jsx_runtime_1.jsx)(image_1.default, { width: 15, height: 15, alt: 'sound-volume', src: `/assetPage/${volume ? 'soundOn' : 'soundOf'}.svg` }) }), (0, jsx_runtime_1.jsx)(InputRangeSound, { value: volume, children: (0, jsx_runtime_1.jsx)(InputRange, { type: "range", min: 0, max: 1, step: "any", value: volume, onChange: this.handleVolumeChange }) })] }), Boolean(this.props.playerType === 'audio') || ((0, jsx_runtime_1.jsx)(ControlButton, { onClick: this.handleClickFullscreen, children: (0, jsx_runtime_1.jsx)(image_1.default, { width: 15, height: 15, alt: 'fullScreen', src: `/assetPage/fullScreen.svg` }) }))] })] })] })) })) })) }));
-    }
-}
-exports.AudioVideoPlayer = AudioVideoPlayer;

package/build/components/assetPage/category/index.d.ts

@@ -1,4 +0,0 @@
-import { TAsset } from '../../../entities/asset/types';
-export declare const Category: ({ asset }: {
-    asset: TAsset;
-}) => import("react/jsx-runtime").JSX.Element;