function MainComponent() { const [isLocked, setIsLocked] = React.useState(false); const handleVideoClick = (e)=>{ if (isLocked) { e.preventDefault(); } else { const video = e.target; if (video.paused) { video.play(); } else { video.pause(); } } }; const handleLockToggle = ()=>{ setIsLocked(!isLocked); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center bg-blue-100 p-4 min-h-screen", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-crimson-text text-3xl mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, "Kids Safe Video Player"), /*#__PURE__*/ React.createElement("button", { onClick: handleLockToggle, className: `px-4 py-2 mb-4 ${isLocked ? 'bg-red-500' : 'bg-green-500'} text-white font-bold rounded`, __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, isLocked ? "Unlock" : "Lock"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px]", __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative mb-4", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("video", { onClick: handleVideoClick, className: "w-full rounded-xl", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("source", { src: "video1.mp4", type: "video/mp4", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }), "Your browser does not support the video tag.")), /*#__PURE__*/ React.createElement("div", { className: "relative mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("video", { onClick: handleVideoClick, className: "w-full rounded-xl", __source: { fileName: "", lineNumber: 38, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("source", { src: "video2.mp4", type: "video/mp4", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }), "Your browser does not support the video tag.")), /*#__PURE__*/ React.createElement("div", { className: "relative mb-4", __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("video", { onClick: handleVideoClick, className: "w-full rounded-xl", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("source", { src: "video3.mp4", type: "video/mp4", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this }), "Your browser does not support the video tag.")))); }