reviewhver 0.0.1

package/dist/components/Molecules/VideoView/VideoModal.js

@@ -0,0 +1,404 @@
+"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 });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const react_2 = require("@chakra-ui/react");
+const react_player_1 = __importDefault(require("react-player"));
+const formatTime = (seconds) => {
+    const h = Math.floor(seconds / 3600);
+    const m = Math.floor((seconds % 3600) / 60);
+    const s = Math.floor(seconds % 60);
+    if (h > 0)
+        return `${h}:${m.toString().padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
+    return `${m}:${s.toString().padStart(2, "0")}`;
+};
+// ─── SVG Icons ────────────────────────────────────────────────────────────────
+const IconPlay = () => ((0, jsx_runtime_1.jsx)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: (0, jsx_runtime_1.jsx)("polygon", { points: "4,2 14,9 4,16" }) }));
+const IconPause = () => ((0, jsx_runtime_1.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: [(0, jsx_runtime_1.jsx)("rect", { x: "3", y: "2", width: "4", height: "14", rx: "1" }), (0, jsx_runtime_1.jsx)("rect", { x: "11", y: "2", width: "4", height: "14", rx: "1" })] }));
+const IconSkipPrev = () => ((0, jsx_runtime_1.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: [(0, jsx_runtime_1.jsx)("rect", { x: "3", y: "3", width: "2.5", height: "12", rx: "1" }), (0, jsx_runtime_1.jsx)("polygon", { points: "14,3 6,9 14,15" })] }));
+const IconSkipNext = () => ((0, jsx_runtime_1.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: [(0, jsx_runtime_1.jsx)("polygon", { points: "4,3 12,9 4,15" }), (0, jsx_runtime_1.jsx)("rect", { x: "12.5", y: "3", width: "2.5", height: "12", rx: "1" })] }));
+const IconVolume = () => ((0, jsx_runtime_1.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: [(0, jsx_runtime_1.jsx)("polygon", { points: "2,6 2,12 6,12 10,16 10,2 6,6" }), (0, jsx_runtime_1.jsx)("path", { d: "M12.5 5.5 C14.5 7 14.5 11 12.5 12.5", stroke: "white", strokeWidth: "1.5", fill: "none", strokeLinecap: "round" }), (0, jsx_runtime_1.jsx)("path", { d: "M14.5 3.5 C17.5 6 17.5 12 14.5 14.5", stroke: "white", strokeWidth: "1.5", fill: "none", strokeLinecap: "round" })] }));
+const IconMuted = () => ((0, jsx_runtime_1.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: [(0, jsx_runtime_1.jsx)("polygon", { points: "2,6 2,12 6,12 10,16 10,2 6,6" }), (0, jsx_runtime_1.jsx)("line", { x1: "13", y1: "6", x2: "17", y2: "12", stroke: "white", strokeWidth: "1.8", strokeLinecap: "round" }), (0, jsx_runtime_1.jsx)("line", { x1: "17", y1: "6", x2: "13", y2: "12", stroke: "white", strokeWidth: "1.8", strokeLinecap: "round" })] }));
+const IconFullscreen = () => ((0, jsx_runtime_1.jsx)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: (0, jsx_runtime_1.jsx)("path", { d: "M2 6V2h4M12 2h4v4M16 12v4h-4M6 16H2v-4", stroke: "white", strokeWidth: "1.8", fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+const IconExitFullscreen = () => ((0, jsx_runtime_1.jsx)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "white", children: (0, jsx_runtime_1.jsx)("path", { d: "M6 2v4H2M16 6h-4V2M2 12h4v4M12 16v-4h4", stroke: "white", strokeWidth: "1.8", fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+// ─── Icon Button ──────────────────────────────────────────────────────────────
+const IconBtn = ({ onClick, label, children, disabled = false }) => ((0, jsx_runtime_1.jsx)(react_2.Box, { as: "button", sx: {
+        background: "none",
+        border: "1px solid rgba(255,255,255,0.18)",
+        cursor: disabled ? "default" : "pointer",
+        padding: "5px",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        borderRadius: "8px",
+        opacity: disabled ? 0.35 : 1,
+        flexShrink: 0,
+        transition: "border-color 0.15s ease, background-color 0.15s ease",
+        _hover: {
+            backgroundColor: disabled ? "transparent" : "rgba(255,255,255,0.1)",
+            borderColor: disabled ? "rgba(255,255,255,0.18)" : "rgba(255,255,255,0.4)",
+        },
+    }, onClick: disabled ? undefined : onClick, "aria-label": label, children: children }));
+// ─── Component ────────────────────────────────────────────────────────────────
+const VideoModal = (props) => {
+    const { isOpen, onClose, videoUrl, icons = {}, isTeacher = false, segments = [] } = props;
+    const playerRef = (0, react_1.useRef)(null);
+    const seekbarRef = (0, react_1.useRef)(null);
+    const containerRef = (0, react_1.useRef)(null);
+    const [playing, setPlaying] = (0, react_1.useState)(true);
+    const [played, setPlayed] = (0, react_1.useState)(0); // 0–1
+    const [duration, setDuration] = (0, react_1.useState)(0);
+    const [seeking, setSeeking] = (0, react_1.useState)(false);
+    const [muted, setMuted] = (0, react_1.useState)(false);
+    const [isFullscreen, setIsFullscreen] = (0, react_1.useState)(false);
+    const [hoveredSegmentId, setHoveredSegmentId] = (0, react_1.useState)(null);
+    const [playbackRate, setPlaybackRate] = (0, react_1.useState)(1);
+    const [showSpeedMenu, setShowSpeedMenu] = (0, react_1.useState)(false);
+    const speedMenuRef = (0, react_1.useRef)(null);
+    // Sync fullscreen state with browser
+    react_1.default.useEffect(() => {
+        const onChange = () => setIsFullscreen(!!document.fullscreenElement);
+        document.addEventListener("fullscreenchange", onChange);
+        return () => document.removeEventListener("fullscreenchange", onChange);
+    }, []);
+    const handleProgress = (0, react_1.useCallback)(({ played: p }) => { if (!seeking)
+        setPlayed(p); }, [seeking]);
+    // ── Seekbar ────────────────────────────────────────────────────────────────
+    const seekTo = (0, react_1.useCallback)((clientX) => {
+        const bar = seekbarRef.current;
+        if (!bar || !playerRef.current)
+            return;
+        const { left, width } = bar.getBoundingClientRect();
+        const fraction = Math.min(Math.max((clientX - left) / width, 0), 1);
+        setPlayed(fraction);
+        playerRef.current.seekTo(fraction, "fraction");
+    }, []);
+    const handleSeekMouseDown = (e) => {
+        setSeeking(true);
+        seekTo(e.clientX);
+    };
+    const handleSeekMouseMove = (0, react_1.useCallback)((e) => { if (seeking)
+        seekTo(e.clientX); }, [seeking, seekTo]);
+    const handleSeekMouseUp = (0, react_1.useCallback)((e) => { if (seeking) {
+        setSeeking(false);
+        seekTo(e.clientX);
+    } }, [seeking, seekTo]);
+    react_1.default.useEffect(() => {
+        if (seeking) {
+            window.addEventListener("mousemove", handleSeekMouseMove);
+            window.addEventListener("mouseup", handleSeekMouseUp);
+        }
+        return () => {
+            window.removeEventListener("mousemove", handleSeekMouseMove);
+            window.removeEventListener("mouseup", handleSeekMouseUp);
+        };
+    }, [seeking, handleSeekMouseMove, handleSeekMouseUp]);
+    // ── Segment helpers ────────────────────────────────────────────────────────
+    const segmentBands = segments.map((seg, i) => ({
+        ...seg,
+        end: seg.end ?? segments[i + 1]?.start ?? duration,
+    }));
+    const currentTime = played * duration;
+    const activeSegment = segmentBands.find((seg) => currentTime >= seg.start && currentTime < seg.end) ?? null;
+    const activeSegmentId = activeSegment?.id ?? null;
+    const activeIdx = segmentBands.findIndex((s) => s.id === activeSegmentId);
+    const nextSegment = activeIdx >= 0 ? segmentBands[activeIdx + 1] ?? null : null;
+    const prevSegment = activeIdx > 0 ? segmentBands[activeIdx - 1] : segmentBands[0] ?? null;
+    const handleSegmentMouseDown = (e, seg) => {
+        e.stopPropagation();
+        if (!playerRef.current)
+            return;
+        playerRef.current.seekTo(seg.start, "seconds");
+        setPlayed(duration > 0 ? seg.start / duration : 0);
+    };
+    const handleSkipPrev = () => {
+        if (!prevSegment || !playerRef.current)
+            return;
+        playerRef.current.seekTo(prevSegment.start, "seconds");
+        setPlayed(duration > 0 ? prevSegment.start / duration : 0);
+    };
+    const handleSkipNext = () => {
+        if (!nextSegment || !playerRef.current)
+            return;
+        playerRef.current.seekTo(nextSegment.start, "seconds");
+        setPlayed(duration > 0 ? nextSegment.start / duration : 0);
+    };
+    // ── Speed menu click-outside close ────────────────────────────────────────
+    react_1.default.useEffect(() => {
+        if (!showSpeedMenu)
+            return;
+        const handler = (e) => {
+            if (speedMenuRef.current && !speedMenuRef.current.contains(e.target)) {
+                setShowSpeedMenu(false);
+            }
+        };
+        document.addEventListener("mousedown", handler);
+        return () => document.removeEventListener("mousedown", handler);
+    }, [showSpeedMenu]);
+    // ── Fullscreen ─────────────────────────────────────────────────────────────
+    const handleFullscreen = () => {
+        if (!document.fullscreenElement) {
+            containerRef.current?.requestFullscreen();
+        }
+        else {
+            document.exitFullscreen();
+        }
+    };
+    // ── Render ─────────────────────────────────────────────────────────────────
+    return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: isOpen && ((0, jsx_runtime_1.jsxs)(react_2.Box, { sx: styles.overlay, onClick: isTeacher ? onClose : () => { }, "data-testid": "video-modal-overlay", children: [(0, jsx_runtime_1.jsx)(react_2.Box, { sx: { ...styles.closeButtonWrapper, top: isTeacher ? "80px" : "10px" }, children: (0, jsx_runtime_1.jsx)(react_2.Image, { src: icons.close, sx: styles.closeButton, onClick: onClose, alt: "Close", "data-testid": "video-close-button" }) }), (0, jsx_runtime_1.jsxs)(react_2.Box, { ref: containerRef, sx: styles.modal, onClick: (e) => e.stopPropagation(), "data-testid": "video-player", children: [(0, jsx_runtime_1.jsx)(react_2.Box, { sx: styles.playerWrapper, children: (0, jsx_runtime_1.jsx)(react_player_1.default, { ref: playerRef, url: videoUrl, playing: playing, muted: muted, width: "100%", height: "100%", style: styles.player, onProgress: handleProgress, onDuration: setDuration, onEnded: () => setPlaying(false), playbackRate: playbackRate }) }), (0, jsx_runtime_1.jsxs)(react_2.Box, { sx: styles.controlsContainer, children: [(0, jsx_runtime_1.jsx)(react_2.Box, { sx: styles.seekbarRow, children: (0, jsx_runtime_1.jsxs)(react_2.Box, { ref: seekbarRef, sx: styles.seekbarTrack, onMouseDown: handleSeekMouseDown, children: [duration > 0 && segmentBands.map((seg, i) => {
+                                                const isHovered = hoveredSegmentId === seg.id;
+                                                const isActive = activeSegmentId === seg.id;
+                                                const baseColor = seg.color ?? defaultSegmentColors[i % defaultSegmentColors.length];
+                                                return ((0, jsx_runtime_1.jsx)(react_2.Box, { "data-segment-id": seg.id, title: seg.label, sx: {
+                                                        ...styles.segmentBand,
+                                                        left: `${(seg.start / duration) * 100}%`,
+                                                        width: `${((seg.end - seg.start) / duration) * 100}%`,
+                                                        backgroundColor: baseColor,
+                                                        ...(isHovered && !isActive && { transform: "translateY(-4px)", zIndex: 2, boxShadow: `0 4px 8px rgba(0,0,0,0.5)` }),
+                                                        ...(isActive && !isHovered && { transform: "translateY(-6px)", zIndex: 3, boxShadow: `0 6px 12px rgba(0,0,0,0.6)` }),
+                                                        ...(isHovered && isActive && { transform: "translateY(-8px)", zIndex: 4, boxShadow: `0 8px 16px rgba(0,0,0,0.7)` }),
+                                                    }, onMouseEnter: () => setHoveredSegmentId(seg.id), onMouseLeave: () => setHoveredSegmentId(null), onMouseDown: (e) => handleSegmentMouseDown(e, seg) }, seg.id));
+                                            }), duration > 0 && segmentBands.slice(1).map((seg, i) => ((0, jsx_runtime_1.jsx)(react_2.Box, { sx: { ...styles.segmentMarker, left: `${(seg.start / duration) * 100}%` } }, `marker-${i}`))), (0, jsx_runtime_1.jsx)(react_2.Box, { sx: { ...styles.seekbarFill, width: `${played * 100}%` } }), (0, jsx_runtime_1.jsx)(react_2.Box, { sx: { ...styles.seekbarThumb, left: `${played * 100}%` } })] }) }), (0, jsx_runtime_1.jsxs)(react_2.Box, { sx: styles.controlsRow, children: [(0, jsx_runtime_1.jsxs)(react_2.Box, { sx: styles.controlsLeft, children: [(0, jsx_runtime_1.jsx)(IconBtn, { onClick: () => setPlaying((p) => !p), label: playing ? "Pause" : "Play", children: playing ? (0, jsx_runtime_1.jsx)(IconPause, {}) : (0, jsx_runtime_1.jsx)(IconPlay, {}) }), segments.length > 0 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(IconBtn, { onClick: handleSkipPrev, label: "Previous segment", disabled: activeIdx <= 0 && prevSegment?.id === segmentBands[0]?.id && activeSegmentId === segmentBands[0]?.id, children: (0, jsx_runtime_1.jsx)(IconSkipPrev, {}) }), (0, jsx_runtime_1.jsx)(IconBtn, { onClick: handleSkipNext, label: "Next segment", disabled: !nextSegment, children: (0, jsx_runtime_1.jsx)(IconSkipNext, {}) })] })), (0, jsx_runtime_1.jsx)(IconBtn, { onClick: () => setMuted((m) => !m), label: muted ? "Unmute" : "Mute", children: muted ? (0, jsx_runtime_1.jsx)(IconMuted, {}) : (0, jsx_runtime_1.jsx)(IconVolume, {}) }), (0, jsx_runtime_1.jsxs)(react_2.Box, { sx: styles.time, children: [formatTime(played * duration), " / ", formatTime(duration)] })] }), segments.length > 0 && activeSegment && ((0, jsx_runtime_1.jsx)(react_2.Box, { sx: styles.controlsCenter, children: (0, jsx_runtime_1.jsx)(react_2.Box, { sx: styles.segmentLabel, children: activeSegment.label }) })), (0, jsx_runtime_1.jsxs)(react_2.Box, { sx: styles.controlsRight, children: [(0, jsx_runtime_1.jsxs)(react_2.Box, { ref: speedMenuRef, sx: styles.speedWrapper, children: [(0, jsx_runtime_1.jsx)(react_2.Box, { as: "button", sx: styles.speedBtn, onClick: () => setShowSpeedMenu((v) => !v), "aria-label": "Playback speed", children: playbackRate === 1 ? "1x" : `${playbackRate}x` }), showSpeedMenu && ((0, jsx_runtime_1.jsx)(react_2.Box, { sx: styles.speedMenu, children: SPEED_OPTIONS.map((rate) => ((0, jsx_runtime_1.jsx)(react_2.Box, { as: "button", sx: {
+                                                                    ...styles.speedOption,
+                                                                    ...(playbackRate === rate && styles.speedOptionActive),
+                                                                }, onClick: () => { setPlaybackRate(rate); setShowSpeedMenu(false); }, children: rate === 1 ? "Normal" : `${rate}x` }, rate))) }))] }), (0, jsx_runtime_1.jsx)(IconBtn, { onClick: handleFullscreen, label: isFullscreen ? "Exit fullscreen" : "Fullscreen", children: isFullscreen ? (0, jsx_runtime_1.jsx)(IconExitFullscreen, {}) : (0, jsx_runtime_1.jsx)(IconFullscreen, {}) })] })] })] })] })] })) }));
+};
+// ─── Constants ────────────────────────────────────────────────────────────────
+const SPEED_OPTIONS = [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
+const defaultSegmentColors = [
+    "rgba(99, 179, 237, 0.45)",
+    "rgba(154, 230, 180, 0.45)",
+    "rgba(252, 211, 77, 0.45)",
+    "rgba(252, 129, 74, 0.45)",
+    "rgba(183, 148, 244, 0.45)",
+];
+// ─── Styles ───────────────────────────────────────────────────────────────────
+const styles = {
+    overlay: {
+        position: "fixed",
+        top: 0, left: 0, right: 0, bottom: 0,
+        backgroundColor: "rgba(0, 0, 0, 0.75)",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        zIndex: 1000,
+    },
+    closeButtonWrapper: {
+        position: "absolute",
+        top: "10px",
+        right: "10px",
+        zIndex: 1001,
+    },
+    closeButton: {
+        width: "24px",
+        height: "24px",
+        cursor: "pointer",
+    },
+    modal: {
+        position: "relative",
+        width: "80%",
+        maxWidth: "800px",
+        backgroundColor: "#000",
+        borderRadius: "8px",
+        boxShadow: "0 4px 24px rgba(0,0,0,0.5)",
+        overflow: "hidden",
+    },
+    playerWrapper: {
+        position: "relative",
+        paddingTop: "56.25%", // 16:9
+    },
+    player: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+    },
+    // ── Controls container (column) ──
+    controlsContainer: {
+        display: "flex",
+        flexDirection: "column",
+        backgroundColor: "#111",
+        paddingBottom: "4px",
+    },
+    // ── Seekbar row ──
+    seekbarRow: {
+        padding: "10px 12px 6px",
+    },
+    seekbarTrack: {
+        position: "relative",
+        height: "4px",
+        backgroundColor: "rgba(255,255,255,0.2)",
+        borderRadius: "2px",
+        cursor: "pointer",
+        overflow: "visible",
+    },
+    segmentBand: {
+        position: "absolute",
+        top: 0,
+        height: "100%",
+        cursor: "pointer",
+        borderRadius: "2px",
+        transition: "transform 0.15s ease, box-shadow 0.15s ease",
+        zIndex: 1,
+    },
+    segmentMarker: {
+        position: "absolute",
+        top: "-3px",
+        width: "2px",
+        height: "10px",
+        backgroundColor: "#fff",
+        transform: "translateX(-50%)",
+        pointerEvents: "none",
+        borderRadius: "1px",
+        zIndex: 5,
+    },
+    seekbarFill: {
+        position: "absolute",
+        top: 0, left: 0,
+        height: "100%",
+        backgroundColor: "rgba(255,255,255,0.85)",
+        borderRadius: "2px",
+        pointerEvents: "none",
+        zIndex: 6,
+    },
+    seekbarThumb: {
+        position: "absolute",
+        top: "50%",
+        width: "12px",
+        height: "12px",
+        backgroundColor: "#fff",
+        borderRadius: "50%",
+        transform: "translate(-50%, -50%)",
+        pointerEvents: "none",
+        boxShadow: "0 0 4px rgba(0,0,0,0.6)",
+        zIndex: 7,
+    },
+    // ── Controls row ──
+    controlsRow: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        padding: "2px 8px 4px",
+        gap: "8px",
+    },
+    controlsLeft: {
+        display: "flex",
+        alignItems: "center",
+        gap: "2px",
+        flexShrink: 0,
+    },
+    controlsCenter: {
+        display: "flex",
+        alignItems: "center",
+        gap: "4px",
+        overflow: "hidden",
+        flex: 1,
+        justifyContent: "flex-start",
+    },
+    segmentLabel: {
+        color: "#e0e0e0",
+        fontSize: "12px",
+        fontWeight: 500,
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        maxWidth: "220px",
+        padding: "5px 8px",
+        border: "1px solid rgba(255,255,255,0.18)",
+        borderRadius: "8px",
+    },
+    controlsRight: {
+        display: "flex",
+        alignItems: "center",
+        gap: "6px",
+        flexShrink: 0,
+    },
+    speedWrapper: {
+        position: "relative",
+        flexShrink: 0,
+    },
+    speedBtn: {
+        background: "none",
+        border: "1px solid rgba(255,255,255,0.18)",
+        borderRadius: "8px",
+        color: "#fff",
+        fontSize: "12px",
+        fontWeight: 600,
+        cursor: "pointer",
+        padding: "5px 8px",
+        minWidth: "38px",
+        textAlign: "center",
+        transition: "border-color 0.15s ease, background-color 0.15s ease",
+        _hover: {
+            backgroundColor: "rgba(255,255,255,0.1)",
+            borderColor: "rgba(255,255,255,0.4)",
+        },
+    },
+    speedMenu: {
+        position: "absolute",
+        bottom: "calc(100% + 6px)",
+        right: 0,
+        backgroundColor: "#1e1e1e",
+        border: "1px solid rgba(255,255,255,0.15)",
+        borderRadius: "8px",
+        overflow: "hidden",
+        zIndex: 20,
+        minWidth: "90px",
+        boxShadow: "0 4px 16px rgba(0,0,0,0.6)",
+    },
+    speedOption: {
+        display: "block",
+        width: "100%",
+        background: "none",
+        border: "none",
+        color: "#ccc",
+        fontSize: "13px",
+        padding: "7px 14px",
+        textAlign: "left",
+        cursor: "pointer",
+        whiteSpace: "nowrap",
+        _hover: { backgroundColor: "rgba(255,255,255,0.08)", color: "#fff" },
+    },
+    speedOptionActive: {
+        color: "#fff",
+        fontWeight: 600,
+        backgroundColor: "rgba(255,255,255,0.1)",
+    },
+    time: {
+        color: "#ccc",
+        fontSize: "12px",
+        fontVariantNumeric: "tabular-nums",
+        whiteSpace: "nowrap",
+        padding: "5px 8px",
+        border: "1px solid rgba(255,255,255,0.18)",
+        borderRadius: "8px",
+        flexShrink: 0,
+    },
+};
+exports.default = VideoModal;
+//# sourceMappingURL=VideoModal.js.map

package/dist/components/Molecules/VideoView/VideoModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VideoModal.js","sourceRoot":"","sources":["../../../../src/components/Molecules/VideoView/VideoModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6D;AAC7D,4CAA8C;AAC9C,gEAAuC;AAmBvC,MAAM,UAAU,GAAG,CAAC,OAAe,EAAU,EAAE;IAC7C,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;IACrC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;IAC5C,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;IACnC,IAAI,CAAC,GAAG,CAAC;QAAE,OAAO,GAAG,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC;IAC3F,OAAO,GAAG,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC;AACjD,CAAC,CAAC;AAEF,iFAAiF;AAEjF,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,CACrB,gCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,YAC1D,oCAAS,MAAM,EAAC,eAAe,GAAG,GAC9B,CACP,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,CACtB,iCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,aAC1D,iCAAM,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG,EACjD,iCAAM,CAAC,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG,IAC9C,CACP,CAAC;AAEF,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,CACzB,iCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,aAC1D,iCAAM,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG,EACnD,oCAAS,MAAM,EAAC,gBAAgB,GAAG,IAC/B,CACP,CAAC;AAEF,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,CACzB,iCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,aAC1D,oCAAS,MAAM,EAAC,eAAe,GAAG,EAClC,iCAAM,CAAC,EAAC,MAAM,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG,IAClD,CACP,CAAC;AAEF,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,CACvB,iCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,aAC1D,oCAAS,MAAM,EAAC,8BAA8B,GAAG,EACjD,iCAAM,CAAC,EAAC,qCAAqC,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,aAAa,EAAC,OAAO,GAAG,EACnH,iCAAM,CAAC,EAAC,qCAAqC,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,aAAa,EAAC,OAAO,GAAG,IAC/G,CACP,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,CACtB,iCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,aAC1D,oCAAS,MAAM,EAAC,8BAA8B,GAAG,EACjD,iCAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,GAAG,EAC9F,iCAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,GAAG,IAC1F,CACP,CAAC;AAEF,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,CAC3B,gCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,YAC1D,iCAAM,CAAC,EAAC,wCAAwC,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,GAAG,GACzI,CACP,CAAC;AAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE,CAAC,CAC/B,gCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,YAC1D,iCAAM,CAAC,EAAC,wCAAwC,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,GAAG,GACzI,CACP,CAAC;AAGF,iFAAiF;AAEjF,MAAM,OAAO,GAAG,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAG,KAAK,EAK5D,EAAE,EAAE,CAAC,CACJ,uBAAC,WAAG,IACF,EAAE,EAAC,QAAQ,EACX,EAAE,EAAE;QACF,UAAU,EAAE,MAAM;QAClB,MAAM,EAAE,kCAAkC;QAC1C,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;QACxC,OAAO,EAAE,KAAK;QACd,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,YAAY,EAAE,KAAK;QACnB,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC5B,UAAU,EAAE,CAAC;QACb,UAAU,EAAE,sDAAsD;QAClE,MAAM,EAAE;YACN,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,uBAAuB;YACnE,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,uBAAuB;SAC3E;KACF,EACD,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,gBAC3B,KAAK,YAEhB,QAAQ,GACL,CACP,CAAC;AAEF,iFAAiF;AAEjF,MAAM,UAAU,GAAG,CAAC,KAAsB,EAAE,EAAE;IAC5C,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,GAAG,EAAE,EAAE,SAAS,GAAG,KAAK,EAAE,QAAQ,GAAG,EAAE,EAAE,GAAG,KAAK,CAAC;IAE1F,MAAM,SAAS,GAAK,IAAA,cAAM,EAAc,IAAI,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAI,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAElD,MAAM,CAAC,OAAO,EAAW,UAAU,CAAC,GAAY,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAC/D,MAAM,CAAC,MAAM,EAAY,SAAS,CAAC,GAAa,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC,CAAO,MAAM;IACzE,MAAM,CAAC,QAAQ,EAAU,WAAW,CAAC,GAAW,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC;IAC5D,MAAM,CAAC,OAAO,EAAW,UAAU,CAAC,GAAY,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAChE,MAAM,CAAC,KAAK,EAAa,QAAQ,CAAC,GAAc,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAChE,MAAM,CAAC,YAAY,EAAM,eAAe,CAAC,GAAO,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAChE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,IAAA,gBAAQ,EAAgB,IAAI,CAAC,CAAC;IAC9E,MAAM,CAAC,YAAY,EAAM,eAAe,CAAC,GAAO,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC;IAC5D,MAAM,CAAC,aAAa,EAAK,gBAAgB,CAAC,GAAM,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAChE,MAAM,YAAY,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAElD,qCAAqC;IACrC,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC;QACrE,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC;QACxD,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC;IAC1E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,cAAc,GAAG,IAAA,mBAAW,EAChC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAsB,EAAE,EAAE,GAAG,IAAI,CAAC,OAAO;QAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACtE,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,8EAA8E;IAE9E,MAAM,MAAM,GAAG,IAAA,mBAAW,EAAC,CAAC,OAAe,EAAE,EAAE;QAC7C,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,CAAC;QAC/B,IAAI,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE,OAAO;QACvC,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,GAAG,CAAC,qBAAqB,EAAE,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACpE,SAAS,CAAC,QAAQ,CAAC,CAAC;QACpB,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;IACjD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,mBAAmB,GAAG,CAAC,CAAmB,EAAE,EAAE;QAClD,UAAU,CAAC,IAAI,CAAC,CAAC;QACjB,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,IAAA,mBAAW,EACrC,CAAC,CAAa,EAAE,EAAE,GAAG,IAAI,OAAO;QAAE,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EACtD,CAAC,OAAO,EAAE,MAAM,CAAC,CAClB,CAAC;IAEF,MAAM,iBAAiB,GAAG,IAAA,mBAAW,EACnC,CAAC,CAAa,EAAE,EAAE,GAAG,IAAI,OAAO,EAAE;QAAE,UAAU,CAAC,KAAK,CAAC,CAAC;QAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;KAAE,CAAC,CAAC,EAC7E,CAAC,OAAO,EAAE,MAAM,CAAC,CAClB,CAAC;IAEF,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,OAAO,EAAE;YACX,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,mBAAmB,CAAC,CAAC;YAC1D,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,iBAAiB,CAAC,CAAC;SACvD;QACD,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,mBAAmB,CAAC,CAAC;YAC7D,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,iBAAiB,CAAC,CAAC;QAC3D,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAEtD,8EAA8E;IAE9E,MAAM,YAAY,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;QAC7C,GAAG,GAAG;QACN,GAAG,EAAE,GAAG,CAAC,GAAG,IAAI,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,IAAI,QAAQ;KACnD,CAAC,CAAC,CAAC;IAEJ,MAAM,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;IACtC,MAAM,aAAa,GAAG,YAAY,CAAC,IAAI,CACrC,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,IAAI,GAAG,CAAC,KAAK,IAAI,WAAW,GAAG,GAAG,CAAC,GAAG,CAC3D,IAAI,IAAI,CAAC;IACV,MAAM,eAAe,GAAG,aAAa,EAAE,EAAE,IAAI,IAAI,CAAC;IAElD,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,eAAe,CAAC,CAAC;IAC1E,MAAM,WAAW,GAAG,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAChF,MAAM,WAAW,GAAG,SAAS,GAAG,CAAC,CAAE,CAAC,CAAC,YAAY,CAAC,SAAS,GAAG,CAAC,CAAC,CAAQ,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC;IAElG,MAAM,sBAAsB,GAAG,CAAC,CAAmB,EAAE,GAA2B,EAAE,EAAE;QAClF,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE,OAAO;QAC/B,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QAC/C,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACrD,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,IAAI,CAAC,WAAW,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE,OAAO;QAC/C,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QACvD,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,IAAI,CAAC,WAAW,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE,OAAO;QAC/C,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QACvD,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,6EAA6E;IAE7E,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,MAAM,OAAO,GAAG,CAAC,CAAa,EAAE,EAAE;YAChC,IAAI,YAAY,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAc,CAAC,EAAE;gBAC5E,gBAAgB,CAAC,KAAK,CAAC,CAAC;aACzB;QACH,CAAC,CAAC;QACF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;QAChD,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;IAClE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,8EAA8E;IAE9E,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,IAAI,CAAC,QAAQ,CAAC,iBAAiB,EAAE;YAC/B,YAAY,CAAC,OAAO,EAAE,iBAAiB,EAAE,CAAC;SAC3C;aAAM;YACL,QAAQ,CAAC,cAAc,EAAE,CAAC;SAC3B;IACH,CAAC,CAAC;IAEF,8EAA8E;IAE9E,OAAO,CACL,uBAAC,eAAK,CAAC,QAAQ,cACZ,MAAM,IAAI,CACT,wBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,GAAE,CAAC,iBAAc,qBAAqB,aACjG,uBAAC,WAAG,IAAC,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,kBAAkB,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAAE,YACzE,uBAAC,aAAK,IAAC,GAAG,EAAE,KAAK,CAAC,KAAK,EAAE,EAAE,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,EAAC,OAAO,iBAAa,oBAAoB,GAAG,GAC9G,EAEN,wBAAC,WAAG,IAAC,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,iBAAc,cAAc,aAGvG,uBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,aAAa,YAC3B,uBAAC,sBAAW,IACV,GAAG,EAAE,SAAS,EACd,GAAG,EAAE,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,KAAK,EAAE,MAAM,CAAC,MAAM,EACpB,UAAU,EAAE,cAAc,EAC1B,UAAU,EAAE,WAAW,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EAChC,YAAY,EAAE,YAAY,GAC1B,GACE,EAGN,wBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,iBAAiB,aAG/B,uBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,UAAU,YACxB,wBAAC,WAAG,IAAC,GAAG,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,CAAC,YAAY,EAAE,WAAW,EAAE,mBAAmB,aAG5E,QAAQ,GAAG,CAAC,IAAI,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE;gDAC3C,MAAM,SAAS,GAAG,gBAAgB,KAAK,GAAG,CAAC,EAAE,CAAC;gDAC9C,MAAM,QAAQ,GAAI,eAAe,KAAM,GAAG,CAAC,EAAE,CAAC;gDAC9C,MAAM,SAAS,GAAG,GAAG,CAAC,KAAK,IAAI,oBAAoB,CAAC,CAAC,GAAG,oBAAoB,CAAC,MAAM,CAAC,CAAC;gDACrF,OAAO,CACL,uBAAC,WAAG,uBAEe,GAAG,CAAC,EAAE,EACvB,KAAK,EAAE,GAAG,CAAC,KAAK,EAChB,EAAE,EAAE;wDACF,GAAG,MAAM,CAAC,WAAW;wDACrB,IAAI,EAAa,GAAG,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,GAAG,GAAG;wDACnD,KAAK,EAAY,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC,GAAG,GAAG,GAAG;wDAC/D,eAAe,EAAE,SAAS;wDAC1B,GAAG,CAAC,SAAS,IAAI,CAAC,QAAQ,IAAI,EAAE,SAAS,EAAE,kBAAkB,EAAE,MAAM,EAAE,CAAC,EAAE,SAAS,EAAE,2BAA2B,EAAE,CAAC;wDACnH,GAAG,CAAC,QAAQ,IAAK,CAAC,SAAS,IAAI,EAAE,SAAS,EAAE,kBAAkB,EAAE,MAAM,EAAE,CAAC,EAAE,SAAS,EAAE,4BAA4B,EAAE,CAAC;wDACrH,GAAG,CAAC,SAAS,IAAI,QAAQ,IAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,MAAM,EAAE,CAAC,EAAE,SAAS,EAAE,4BAA4B,EAAE,CAAC;qDACtH,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,GAAG,CAAC,EAAE,CAAC,EAC/C,YAAY,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAC7C,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,sBAAsB,CAAC,CAAC,EAAE,GAAG,CAAC,IAd7C,GAAG,CAAC,EAAE,CAeX,CACH,CAAC;4CACJ,CAAC,CAAC,EAGD,QAAQ,GAAG,CAAC,IAAI,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,CACrD,uBAAC,WAAG,IAAqB,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,aAAa,EAAE,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,GAAG,GAAG,EAAE,IAAxF,UAAU,CAAC,EAAE,CAA+E,CACvG,CAAC,EAGF,uBAAC,WAAG,IAAC,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,WAAW,EAAE,KAAK,EAAE,GAAG,MAAM,GAAG,GAAG,GAAG,EAAE,GAAI,EAGjE,uBAAC,WAAG,IAAC,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,YAAY,EAAE,IAAI,EAAE,GAAG,MAAM,GAAG,GAAG,GAAG,EAAE,GAAI,IAC7D,GACF,EAGN,wBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,WAAW,aAGzB,wBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,YAAY,aAC1B,uBAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,YAC7E,OAAO,CAAC,CAAC,CAAC,uBAAC,SAAS,KAAG,CAAC,CAAC,CAAC,uBAAC,QAAQ,KAAG,GAC/B,EAET,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,CACtB,6DACE,uBAAC,OAAO,IAAC,OAAO,EAAE,cAAc,EAAE,KAAK,EAAC,kBAAkB,EAAC,QAAQ,EAAE,SAAS,IAAI,CAAC,IAAI,WAAW,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,eAAe,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,YACvK,uBAAC,YAAY,KAAG,GACR,EACV,uBAAC,OAAO,IAAC,OAAO,EAAE,cAAc,EAAE,KAAK,EAAC,cAAc,EAAC,QAAQ,EAAE,CAAC,WAAW,YAC3E,uBAAC,YAAY,KAAG,GACR,IACT,CACJ,EAED,uBAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,YAC1E,KAAK,CAAC,CAAC,CAAC,uBAAC,SAAS,KAAG,CAAC,CAAC,CAAC,uBAAC,UAAU,KAAG,GAC/B,EAEV,wBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,IAAI,aACjB,UAAU,CAAC,MAAM,GAAG,QAAQ,CAAC,SAAK,UAAU,CAAC,QAAQ,CAAC,IACnD,IACF,EAGL,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,aAAa,IAAI,CACvC,uBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,cAAc,YAC5B,uBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,YAAY,YAAG,aAAa,CAAC,KAAK,GAAO,GACrD,CACP,EAGD,wBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,aAAa,aAG3B,wBAAC,WAAG,IAAC,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE,MAAM,CAAC,YAAY,aAC7C,uBAAC,WAAG,IACF,EAAE,EAAC,QAAQ,EACX,EAAE,EAAE,MAAM,CAAC,QAAQ,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,gBAC/B,gBAAgB,YAE1B,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,YAAY,GAAG,GAC3C,EACL,aAAa,IAAI,CAChB,uBAAC,WAAG,IAAC,EAAE,EAAE,MAAM,CAAC,SAAS,YACtB,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,uBAAC,WAAG,IAEF,EAAE,EAAC,QAAQ,EACX,EAAE,EAAE;oEACF,GAAG,MAAM,CAAC,WAAW;oEACrB,GAAG,CAAC,YAAY,KAAK,IAAI,IAAI,MAAM,CAAC,iBAAiB,CAAC;iEACvD,EACD,OAAO,EAAE,GAAG,EAAE,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,YAEjE,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,GAAG,IAR9B,IAAI,CASL,CACP,CAAC,GACE,CACP,IACG,EAEN,uBAAC,OAAO,IAAC,OAAO,EAAE,gBAAgB,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,YAAY,YACvF,YAAY,CAAC,CAAC,CAAC,uBAAC,kBAAkB,KAAG,CAAC,CAAC,CAAC,uBAAC,cAAc,KAAG,GACnD,IACN,IAEF,IACF,IACF,IACF,CACP,GACc,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,iFAAiF;AAEjF,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AAEzD,MAAM,oBAAoB,GAAG;IAC3B,0BAA0B;IAC1B,2BAA2B;IAC3B,0BAA0B;IAC1B,0BAA0B;IAC1B,2BAA2B;CAC5B,CAAC;AAEF,iFAAiF;AAEjF,MAAM,MAAM,GAAwB;IAClC,OAAO,EAAE;QACP,QAAQ,EAAE,OAAO;QACjB,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC;QACpC,eAAe,EAAE,qBAAqB;QACtC,OAAO,EAAE,MAAM;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;QACpB,MAAM,EAAE,IAAI;KACb;IACD,kBAAkB,EAAE;QAClB,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,MAAM;QACX,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,IAAI;KACb;IACD,WAAW,EAAE;QACX,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,MAAM,EAAE,SAAS;KAClB;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,OAAO;QACjB,eAAe,EAAE,MAAM;QACvB,YAAY,EAAE,KAAK;QACnB,SAAS,EAAE,4BAA4B;QACvC,QAAQ,EAAE,QAAQ;KACnB;IACD,aAAa,EAAE;QACb,QAAQ,EAAE,UAAU;QACpB,UAAU,EAAE,QAAQ,EAAE,OAAO;KAC9B;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;KACR;IAED,oCAAoC;IACpC,iBAAiB,EAAE;QACjB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,eAAe,EAAE,MAAM;QACvB,aAAa,EAAE,KAAK;KACrB;IAED,oBAAoB;IACpB,UAAU,EAAE;QACV,OAAO,EAAE,eAAe;KACzB;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,KAAK;QACb,eAAe,EAAE,uBAAuB;QACxC,YAAY,EAAE,KAAK;QACnB,MAAM,EAAE,SAAS;QACjB,QAAQ,EAAE,SAAS;KACpB;IACD,WAAW,EAAE;QACX,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,MAAM,EAAE,MAAM;QACd,MAAM,EAAE,SAAS;QACjB,YAAY,EAAE,KAAK;QACnB,UAAU,EAAE,6CAA6C;QACzD,MAAM,EAAE,CAAC;KACV;IACD,aAAa,EAAE;QACb,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,MAAM;QACX,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,MAAM;QACd,eAAe,EAAE,MAAM;QACvB,SAAS,EAAE,kBAAkB;QAC7B,aAAa,EAAE,MAAM;QACrB,YAAY,EAAE,KAAK;QACnB,MAAM,EAAE,CAAC;KACV;IACD,WAAW,EAAE;QACX,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC;QACf,MAAM,EAAE,MAAM;QACd,eAAe,EAAE,wBAAwB;QACzC,YAAY,EAAE,KAAK;QACnB,aAAa,EAAE,MAAM;QACrB,MAAM,EAAE,CAAC;KACV;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,KAAK;QACV,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,eAAe,EAAE,MAAM;QACvB,YAAY,EAAE,KAAK;QACnB,SAAS,EAAE,uBAAuB;QAClC,aAAa,EAAE,MAAM;QACrB,SAAS,EAAE,yBAAyB;QACpC,MAAM,EAAE,CAAC;KACV;IAED,qBAAqB;IACrB,WAAW,EAAE;QACX,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,eAAe;QAC/B,OAAO,EAAE,aAAa;QACtB,GAAG,EAAE,KAAK;KACX;IACD,YAAY,EAAE;QACZ,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,KAAK;QACV,UAAU,EAAE,CAAC;KACd;IACD,cAAc,EAAE;QACd,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,KAAK;QACV,QAAQ,EAAE,QAAQ;QAClB,IAAI,EAAE,CAAC;QACP,cAAc,EAAE,YAAY;KAC7B;IACD,YAAY,EAAE;QACZ,KAAK,EAAE,SAAS;QAChB,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,UAAU;QACxB,QAAQ,EAAE,OAAO;QACjB,OAAO,EAAE,SAAS;QAClB,MAAM,EAAE,kCAAkC;QAC1C,YAAY,EAAE,KAAK;KACpB;IACD,aAAa,EAAE;QACb,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,KAAK;QACV,UAAU,EAAE,CAAC;KACd;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,UAAU;QACpB,UAAU,EAAE,CAAC;KACd;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,MAAM;QAClB,MAAM,EAAE,kCAAkC;QAC1C,YAAY,EAAE,KAAK;QACnB,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,GAAG;QACf,MAAM,EAAE,SAAS;QACjB,OAAO,EAAE,SAAS;QAClB,QAAQ,EAAE,MAAM;QAChB,SAAS,EAAE,QAAQ;QACnB,UAAU,EAAE,sDAAsD;QAClE,MAAM,EAAE;YACN,eAAe,EAAE,uBAAuB;YACxC,WAAW,EAAE,uBAAuB;SACrC;KACF;IACD,SAAS,EAAE;QACT,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,kBAAkB;QAC1B,KAAK,EAAE,CAAC;QACR,eAAe,EAAE,SAAS;QAC1B,MAAM,EAAE,kCAAkC;QAC1C,YAAY,EAAE,KAAK;QACnB,QAAQ,EAAE,QAAQ;QAClB,MAAM,EAAE,EAAE;QACV,QAAQ,EAAE,MAAM;QAChB,SAAS,EAAE,4BAA4B;KACxC;IACD,WAAW,EAAE;QACX,OAAO,EAAE,OAAO;QAChB,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,MAAM;QAClB,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,MAAM;QAChB,OAAO,EAAE,UAAU;QACnB,SAAS,EAAE,MAAM;QACjB,MAAM,EAAE,SAAS;QACjB,UAAU,EAAE,QAAQ;QACpB,MAAM,EAAE,EAAE,eAAe,EAAE,wBAAwB,EAAE,KAAK,EAAE,MAAM,EAAE;KACrE;IACD,iBAAiB,EAAE;QACjB,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,GAAG;QACf,eAAe,EAAE,uBAAuB;KACzC;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,MAAM;QAChB,kBAAkB,EAAE,cAAc;QAClC,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,SAAS;QAClB,MAAM,EAAE,kCAAkC;QAC1C,YAAY,EAAE,KAAK;QACnB,UAAU,EAAE,CAAC;KACd;CACF,CAAC;AAEF,kBAAe,UAAU,CAAC"}

package/dist/components/Molecules/WallBanner/WallBanner.d.ts

@@ -0,0 +1,2 @@
+declare const WallBanner: (props: any) => import("react/jsx-runtime").JSX.Element;
+export default WallBanner;

package/dist/components/Molecules/WallBanner/WallBanner.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@chakra-ui/react");
+const customTheme_1 = require("../../../utils/customTheme");
+const wallBannerStyles_1 = require("./wallBannerStyles");
+const react_lazy_load_image_component_1 = require("react-lazy-load-image-component");
+// import "react-lazy-load-image-component/src/effects/blur.css";
+const Component = (props) => {
+    const { image, title, description, isTeacher = false, isDarkTheme } = props;
+    const { box, stack, text, vstack, image: imageStyles } = wallBannerStyles_1.wallBannerStyles;
+    return ((0, jsx_runtime_1.jsx)(react_1.Box, { ...box.container, style: isTeacher ? { padding: "0px" } : {}, "data-testid": "wall-banner-component", children: (0, jsx_runtime_1.jsxs)(react_1.Stack, { ...stack.container, children: [(0, jsx_runtime_1.jsxs)(react_1.VStack, { ...(isTeacher ? vstack.container : vstack.studentContainer), children: [(0, jsx_runtime_1.jsx)(react_1.Text, { ...(isTeacher ? text.title : text.studentTitle), color: isDarkTheme ? "white" : "", "data-testid": "wall-banner-title", children: title }), (0, jsx_runtime_1.jsx)(react_1.Text, { ...text.description, color: isDarkTheme ? "#DFE4E7" : "", "data-testid": "wall-banner-description", children: description })] }), isTeacher && ((0, jsx_runtime_1.jsx)(react_1.Box, { ...box.imageContainer, "data-testid": "wall-banner-image", children: image && ((0, jsx_runtime_1.jsx)(react_lazy_load_image_component_1.LazyLoadImage, { src: image, width: "100%", height: "265px", style: {
+                            borderRadius: "16px",
+                            objectFit: "cover",
+                        }, wrapperProps: {
+                            style: {
+                                transitionDelay: "1s",
+                            },
+                        }, effect: "blur", alt: "Wall Banner" })) }))] }) }));
+};
+const WallBanner = (props) => {
+    return ((0, jsx_runtime_1.jsx)(react_1.ChakraProvider, { theme: customTheme_1.customTheme, children: (0, jsx_runtime_1.jsx)(Component, { ...props }) }));
+};
+exports.default = WallBanner;
+//# sourceMappingURL=WallBanner.js.map

package/dist/components/Molecules/WallBanner/WallBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WallBanner.js","sourceRoot":"","sources":["../../../../src/components/Molecules/WallBanner/WallBanner.tsx"],"names":[],"mappings":";;;AAAA,4CAO0B;AAC1B,4DAAyD;AACzD,yDAAsD;AACtD,qFAAgE;AAChE,iEAAiE;AAEjE,MAAM,SAAS,GAAG,CAAC,KAAU,EAAE,EAAE;IAC/B,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,GAAG,KAAK,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAC5E,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,mCAAgB,CAAC;IAE1E,OAAO,CACL,uBAAC,WAAG,OACE,GAAG,CAAC,SAAS,EACjB,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,iBAE9B,uBAAuB,YAEnC,wBAAC,aAAK,OAAK,KAAK,CAAC,SAAS,aACxB,wBAAC,cAAM,OAAK,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,aAClE,uBAAC,YAAI,OACC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,EAChD,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,iBACrB,mBAAmB,YAE9B,KAAK,GACD,EACP,uBAAC,YAAI,OAAK,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,iBAAc,yBAAyB,YACnG,WAAW,GACP,IACA,EACR,SAAS,IAAI,CACZ,uBAAC,WAAG,OAAK,GAAG,CAAC,cAAc,iBAAc,mBAAmB,YACzD,KAAK,IAAI,CACR,uBAAC,+CAAa,IACZ,GAAG,EAAE,KAAK,EACV,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,OAAO,EACd,KAAK,EAAE;4BACL,YAAY,EAAE,MAAM;4BACpB,SAAS,EAAE,OAAO;yBACnB,EACD,YAAY,EAAE;4BACZ,KAAK,EAAE;gCACL,eAAe,EAAE,IAAI;6BACtB;yBACF,EACD,MAAM,EAAC,MAAM,EACb,GAAG,EAAC,aAAa,GACjB,CACH,GACG,CACP,IACK,GACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,KAAU,EAAE,EAAE;IAChC,OAAO,CACL,uBAAC,sBAAc,IAAC,KAAK,EAAE,yBAAW,YAChC,uBAAC,SAAS,OAAK,KAAK,GAAI,GACT,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,UAAU,CAAC"}

package/dist/components/Molecules/WallBanner/wallBannerStyles.d.ts

@@ -0,0 +1 @@
+export declare const wallBannerStyles: any;

package/dist/components/Molecules/WallBanner/wallBannerStyles.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wallBannerStyles = void 0;
+exports.wallBannerStyles = {
+    box: {
+        container: {
+            w: "100%",
+        },
+        imageContainer: {
+            w: ["100%", "100%", "30%"],
+            h: ["265px"],
+        },
+    },
+    stack: {
+        container: {
+            w: "100%",
+            h: "auto",
+            alignItems: "flex-start",
+            spacing: [2, 2, 16],
+            direction: ["column", "column", "row"],
+        },
+    },
+    text: {
+        title: {
+            color: "#263238",
+            margin: 0,
+            fontSize: ["24px", "32px", "48px"],
+            fontWeight: "600",
+            lineHeight: ["32px", "40px", "62px"],
+        },
+        studentTitle: {
+            color: "#263238",
+            margin: 0,
+            fontSize: "30px",
+            fontWeight: "600",
+            lineHeight: ["32px", "40px", "62px"],
+        },
+        description: {
+            color: "#666A6B",
+            margin: 0,
+            fontSize: ["16px", "20px", "20px"],
+            fontWeight: "400",
+            lineHeight: ["24px", "28px", "32px"],
+        },
+    },
+    vstack: {
+        container: {
+            width: ["100%", "100%", "70%"],
+            alignItems: "flex-start",
+            spacing: 4,
+        },
+        studentContainer: {
+            width: ["100%", "100%", "100%"],
+            alignItems: "flex-start",
+            // spacing: 4,
+        },
+    },
+    image: {
+        objectFit: "cover",
+        borderRadius: "16px",
+        h: "100%",
+        w: "100%", // Ensure the image takes the full width of the container
+    },
+};
+//# sourceMappingURL=wallBannerStyles.js.map

package/dist/components/Molecules/WallBanner/wallBannerStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wallBannerStyles.js","sourceRoot":"","sources":["../../../../src/components/Molecules/WallBanner/wallBannerStyles.ts"],"names":[],"mappings":";;;AAAa,QAAA,gBAAgB,GAAQ;IACnC,GAAG,EAAE;QACH,SAAS,EAAE;YACT,CAAC,EAAE,MAAM;SACV;QACD,cAAc,EAAE;YACd,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC;YAC1B,CAAC,EAAE,CAAC,OAAO,CAAC;SACb;KACF;IACD,KAAK,EAAE;QACL,SAAS,EAAE;YACT,CAAC,EAAE,MAAM;YACT,CAAC,EAAE,MAAM;YACT,UAAU,EAAE,YAAY;YACxB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACnB,SAAS,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC;SACvC;KACF;IACD,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,CAAC;YACT,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;YAClC,UAAU,EAAE,KAAK;YACjB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;SACrC;QACD,YAAY,EAAE;YACZ,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,CAAC;YACT,QAAQ,EAAE,MAAM;YAChB,UAAU,EAAE,KAAK;YACjB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;SACrC;QACD,WAAW,EAAE;YACX,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,CAAC;YACT,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;YAClC,UAAU,EAAE,KAAK;YACjB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;SACrC;KACF;IACD,MAAM,EAAE;QACN,SAAS,EAAE;YACT,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC;YAC9B,UAAU,EAAE,YAAY;YACxB,OAAO,EAAE,CAAC;SACX;QACD,gBAAgB,EAAE;YAChB,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;YAC/B,UAAU,EAAE,YAAY;YACxB,cAAc;SACf;KACF;IACD,KAAK,EAAE;QACL,SAAS,EAAE,OAAO;QAClB,YAAY,EAAE,MAAM;QACpB,CAAC,EAAE,MAAM;QACT,CAAC,EAAE,MAAM,EAAE,yDAAyD;KACrE;CACF,CAAC"}

package/dist/components/Molecules/WallCard/WallCard.d.ts

@@ -0,0 +1 @@
+export default function WallCard(props: any): import("react/jsx-runtime").JSX.Element;

package/dist/components/Molecules/WallCard/WallCard.js

@@ -0,0 +1,53 @@
+"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 react_1 = require("react");
+const react_2 = require("@chakra-ui/react");
+const customTheme_1 = require("../../../utils/customTheme");
+const html_react_parser_1 = __importDefault(require("html-react-parser"));
+const react_lazy_load_image_component_1 = require("react-lazy-load-image-component");
+// import "react-lazy-load-image-component/src/effects/blur.css";
+const WallCardComponent = (props) => {
+    const { color = "#FEE7E7", enableClaps = true, enableComments = true, isUserClapped, icons, } = props;
+    const textRef = (0, react_1.useRef)(null);
+    const [showReadMore, setShowReadMore] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        if (textRef.current?.scrollHeight && textRef.current.scrollHeight > 72) {
+            setShowReadMore(true);
+        }
+    }, [props]);
+    const getClapImg = () => {
+        let str;
+        if (props?.isChallenge) {
+            str = isUserClapped ? "activeVote" : "vote";
+        }
+        else {
+            str = isUserClapped ? "activeClap" : "clap";
+        }
+        return str;
+    };
+    return ((0, jsx_runtime_1.jsxs)(react_2.Box, { display: "block", maxW: "325px", minH: "100px", overflow: "hidden", borderRadius: "12px", boxSizing: "border-box", boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)", "data-testid": "wall-card-component", children: [(0, jsx_runtime_1.jsx)(react_lazy_load_image_component_1.LazyLoadImage, { width: "100%", height: "165px", style: {
+                    borderRadius: "12px 12px 0px 0px",
+                }, wrapperProps: {
+                    style: {
+                        transitionDelay: "1s",
+                    },
+                }, src: props.titleImg, effect: "blur", alt: "Activity Card", "data-testid": "wall-card-image" }), (0, jsx_runtime_1.jsxs)(react_2.VStack, { bg: color, alignItems: "flex-start", p: "16px", mt: "-6px", gap: "8px", boxSizing: "border-box", children: [(0, jsx_runtime_1.jsx)(Subject, { subject: props.subject, "data-testid": "wall-card-subject" }), (0, jsx_runtime_1.jsx)(Title, { title: props.title, "data-testid": "wall-card-title" }), (0, jsx_runtime_1.jsx)(Description, { description: props.description, textRef: textRef, showReadMore: showReadMore, "data-testid": "wall-card-description" })] })] }));
+};
+const Subject = ({ subject }) => ((0, jsx_runtime_1.jsx)(react_2.Text, { margin: 0, color: "#eb5757", fontSize: "md", fontWeight: "medium", lineHeight: "20px", "data-testid": "wall-card-subject-text", children: subject }));
+const Title = ({ title }) => ((0, jsx_runtime_1.jsx)(react_2.Text, { margin: 0, lineHeight: "28px", fontSize: "2xl", fontWeight: "semibold", "data-testid": "wall-card-title-text", children: (0, html_react_parser_1.default)("<p>" + title) }));
+const Description = ({ description, textRef, showReadMore }) => {
+    return ((0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsx)(react_2.Box, { ref: textRef, maxH: "72px", overflow: "hidden", children: (0, jsx_runtime_1.jsx)(react_2.Text, { margin: 0, color: "#666A6B", lineHeight: "24px", fontWeight: "medium", fontSize: "lg", w: "100%", wordBreak: "break-word", overflowWrap: "break-word", "data-testid": "wall-card-description-text", children: (0, html_react_parser_1.default)("<p>" + description) }) }), showReadMore && ((0, jsx_runtime_1.jsx)(react_2.HStack, { justifyContent: "flex-end", children: (0, jsx_runtime_1.jsx)(react_2.Text, { margin: 0, fontSize: "md", fontWeight: "medium", color: "#7464ce", lineHeight: "20px", "data-testid": "wall-card-read-more-text", children: "... read more" }) }))] }));
+};
+const Clap = ({ count, image }) => ((0, jsx_runtime_1.jsxs)(react_2.HStack, { spacing: "4px", children: [(0, jsx_runtime_1.jsx)(react_2.Image, { src: image, alt: "interaction", w: "24px", h: "24px" }), (0, jsx_runtime_1.jsx)(react_2.Text, { margin: 0, color: "#666A6B", fontSize: "sm", fontWeight: "medium", children: count })] }));
+const ChallengeIcon = ({ image }) => {
+    return ((0, jsx_runtime_1.jsxs)(react_2.HStack, { spacing: "16px", justifyContent: "center", alignItems: "center", bg: "#7464ce", h: "54px", w: "calc(100% + 32px)", ml: "-16px", mr: "-16px", children: [(0, jsx_runtime_1.jsx)(react_2.Image, { src: image, alt: "Challenge", w: "24px", h: "24px" }), (0, jsx_runtime_1.jsx)(react_2.Text, { margin: 0, color: "#F6F8F9", fontSize: "2xl", fontWeight: "bold", children: "Challenge" })] }));
+};
+function WallCard(props) {
+    return ((0, jsx_runtime_1.jsx)(react_2.ChakraProvider, { theme: customTheme_1.customTheme, children: (0, jsx_runtime_1.jsx)(WallCardComponent, { ...props }) }));
+}
+exports.default = WallCard;
+//# sourceMappingURL=WallCard.js.map

package/dist/components/Molecules/WallCard/WallCard.js.map

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