funuicss 2.5.8 → 2.5.9

package/dist/ui/video/FunPlayer.js

@@ -0,0 +1,203 @@
+"use strict";
+// import React, { useState, useRef, useEffect } from 'react';
+// import { PiCornersOut, PiDownload, PiFastForward, PiFileAudio, PiPause, PiPlay, PiRewind, PiSpeakerHifi, PiSpeakerLow } from 'react-icons/pi';
+// import ToolTip from "../tooltip/ToolTip"
+// import RowFlex from '../specials/RowFlex';
+// import Button from '../button/Button'
+// import Text from '../text/Text'
+// import Tip from '../tooltip/Tip'
+// interface VideoProps {
+//   src: string;
+//   autoPlay: boolean;
+//   onDuration?: (duration: number) => void;
+// }
+// export default function Video({ src, autoPlay, onDuration }: VideoProps) {
+//   const videoRef = useRef<HTMLVideoElement>(null);
+//   const [isPlaying, setIsPlaying] = useState<boolean>(autoPlay);
+//   const [currentTime, setCurrentTime] = useState<number>(0);
+//   const [duration, setDuration] = useState<number>(0);
+//   const [volume, setVolume] = useState<number>(1);
+//   const [isFullScreen, setIsFullScreen] = useState<boolean>(false);
+//   const [showVolume, setShowVolume] = useState<boolean>(false);
+//   useEffect(() => {
+//     if (!videoRef.current) return;
+//     const handleTimeUpdate = () => {
+//       setCurrentTime(videoRef.current.currentTime);
+//     };
+//     const handleDurationChange = () => {
+//       const newDuration = videoRef.current.duration;
+//       setDuration(newDuration);
+//       onDuration && onDuration(newDuration);
+//     };
+//     videoRef.current.addEventListener('timeupdate', handleTimeUpdate);
+//     videoRef.current.addEventListener('durationchange', handleDurationChange);
+//     return () => {
+//       videoRef.current?.removeEventListener('timeupdate', handleTimeUpdate);
+//       videoRef.current?.removeEventListener('durationchange', handleDurationChange);
+//     };
+//   }, [onDuration]);
+//   const formatTime = (time: number) => {
+//     const minutes = Math.floor(time / 60);
+//     const seconds = Math.floor(time % 60);
+//     return `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
+//   };
+//   const handlePlay = () => {
+//     videoRef.current?.play();
+//     setIsPlaying(true);
+//   };
+//   const handlePause = () => {
+//     videoRef.current?.pause();
+//     setIsPlaying(false);
+//   };
+//   const handleStop = () => {
+//     videoRef.current?.pause();
+//     videoRef.current.currentTime = 0;
+//     setIsPlaying(false);
+//   };
+//   const handleRewind = () => {
+//     if (videoRef.current) videoRef.current.currentTime -= 10; // Rewind 10 seconds
+//   };
+//   const handleForward = () => {
+//     if (videoRef.current) videoRef.current.currentTime += 10; // Forward 10 seconds
+//   };
+//   const handleToggleFullScreen = () => {
+//     if (videoRef.current) {
+//       if (videoRef.current.requestFullscreen) {
+//         videoRef.current.requestFullscreen();
+//       } else if (videoRef.current.mozRequestFullScreen) {
+//         videoRef.current.mozRequestFullScreen();
+//       } else if (videoRef.current.webkitRequestFullscreen) {
+//         videoRef.current.webkitRequestFullscreen();
+//       } else if (videoRef.current.msRequestFullscreen) {
+//         videoRef.current.msRequestFullscreen();
+//       }
+//       setIsFullScreen(true);
+//     }
+//   };
+// //   const handleExitFullScreen = () => {
+// //     if (document.exitFullscreen) {
+// //       document.exitFullscreen();
+// //     } else if (document.mozCancelFullScreen) {
+// //       document.mozCancelFullScreen();
+// //     } else if (document.webkitExitFullscreen) {
+// //       document.webkitExitFullscreen();
+// //     } else if (document.msExitFullscreen) {
+// //       document.msExitFullscreen();
+// //     }
+// //     setIsFullScreen(false);
+// //   };
+//   const handleProgressBarChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+//     const newTime = parseFloat(e.target.value);
+//     setCurrentTime(newTime);
+//     if (videoRef.current) videoRef.current.currentTime = newTime;
+//   };
+//   const handleVolumeChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+//     const newVolume = parseFloat(e.target.value);
+//     setVolume(newVolume);
+//     if (videoRef.current) videoRef.current.volume = newVolume;
+//   };
+//   const timePlayed = formatTime(currentTime);
+//   const timeLeft = formatTime(duration - currentTime);
+//   return (
+//     <div className="vide_container">
+//       <video
+//         ref={videoRef}
+//         autoPlay={autoPlay}
+//         src={src}
+//         className="fit"
+//       ></video>
+//       <div className="video_controls" onDoubleClick={isPlaying ? handlePause : handlePlay}>
+//         <RowFlex gap={0.3} funcss="padding-5">
+//           <div>
+//             <Text
+//               text={timePlayed}
+//               size="small"
+//               bold
+//             />
+//           </div>
+//           <div className="col width-100-p">
+//             <input
+//               type="range"
+//               min={0}
+//               max={duration}
+//               value={currentTime}
+//               className="width-100-p"
+//               style={{ height: "3px" }}
+//               onChange={handleProgressBarChange}
+//             />
+//           </div>
+//           <div>
+//             <Text
+//               text={timeLeft}
+//               size="small"
+//               bold
+//             />
+//           </div>
+//         </RowFlex>
+//         <div className="margin-top-5"></div>
+//         <RowFlex gap={1} justify="space-between">
+//           <div>
+//             <RowFlex gap={0.5}>
+//               <ToolTip>
+//                 <div className="width-30 height-30 pointer padding-5" onClick={isPlaying ? handlePause : handlePlay}>
+//                   {isPlaying ? <PiPause /> : <PiPlay />}
+//                 </div>
+//                 <Tip tip="top" animation="ScaleUp" duration={0.5} content={isPlaying ? "Pause" : "Play"} />
+//               </ToolTip>
+//               <ToolTip>
+//                 <div className="width-30 height-30 pointer padding-5" onClick={handleRewind}>
+//                   <PiRewind />
+//                 </div>
+//                 <Tip tip="top" animation="ScaleUp" duration={0.5} content={"10 sec Back"} />
+//               </ToolTip>
+//               <ToolTip>
+//                 <div className="width-30 height-30 pointer padding-5" onClick={handleForward}>
+//                   <PiFastForward />
+//                 </div>
+//                 <Tip tip="top" animation="ScaleUp" duration={0.5} content={"10 sec Forward"} />
+//               </ToolTip>
+//               <div onMouseEnter={() => setShowVolume(true)} onMouseLeave={() => setShowVolume(false)}>
+//                 <RowFlex >
+//                   <ToolTip>
+//                     <div className="width-30 height-30 pointer padding-5">
+//                       <PiSpeakerLow />
+//                     </div>
+//                     <Tip tip="top" animation="ScaleUp" duration={0.5} content={"Volume"} />
+//                   </ToolTip>
+//                   {showVolume &&
+//                     <input
+//                       type="range"
+//                       min={0}
+//                       max={1}
+//                       step={0.01}
+//                       value={volume}
+//                       className="width-100"
+//                       style={{ height: "3px" }}
+//                       onChange={handleVolumeChange}
+//                     />
+//                   }
+//                 </RowFlex>
+//               </div>
+//             </RowFlex>
+//           </div>
+//           <div>
+//             <RowFlex gap={0.3}>
+//               <ToolTip>
+//                 <div className="width-30 height-30 pointer padding-5" onClick={handleToggleFullScreen}>
+//                   <PiCornersOut />
+//                 </div>
+//                 <Tip tip="top" animation="ScaleUp" duration={0.5} content={"Expand"} />
+//               </ToolTip>
+//               <ToolTip>
+//                 <div className="width-30 height-30 pointer padding-5" onClick={() => { window.open(src || "", '_blank'); }}>
+//                   <PiDownload />
+//                 </div>
+//                 <Tip tip="top" animation="ScaleUp" duration={0.5} content={"Download"} />
+//               </ToolTip>
+//             </RowFlex>
+//           </div>
+//         </RowFlex>
+//       </div>
+//     </div>
+//   );
+// }

package/dist/webpack.config.d.ts

@@ -0,0 +1,23 @@
+import TerserPlugin = require("terser-webpack-plugin");
+export let mode: string;
+export let devtool: string;
+export let entry: string;
+export namespace output {
+    let path: string;
+    let filename: string;
+}
+export namespace resolve {
+    let extensions: string[];
+}
+export namespace module {
+    let rules: {
+        test: RegExp;
+        use: string;
+        exclude: RegExp;
+    }[];
+}
+export namespace optimization {
+    let minimize: boolean;
+    let minimizer: TerserPlugin<import("terser").MinifyOptions>[];
+}
+export let plugins: any[];

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.5.8",
+  "version": "2.5.9",
   "name": "funuicss",
   "description": "React and Next.js component UI Library for creating Easy and good looking websites with fewer lines of code. Elevate your web development experience with our cutting-edge React/Next.js component UI Library. Craft stunning websites effortlessly, boasting both seamless functionality and aesthetic appeal—all achieved with minimal lines of code. Unleash the power of simplicity and style in your projects!",
   "main": "index.js",
@@ -42,27 +42,28 @@
   },
   "author": "FunInc",
   "license": "MIT",
+  "dependencies": {
+    "aos": "^2.3.4",
+    "next": "^13.4.4",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-easy-export": "^1.0.1",
+    "react-icons": "^5.0.1"
+  },
   "devDependencies": {
     "@babel/core": "^7.22.11",
     "@babel/preset-env": "^7.22.10",
     "@babel/preset-react": "^7.22.5",
     "@babel/preset-typescript": "^7.22.11",
-    "@types/react": "^19.1.6",
-    "@types/react-dom": "^19.1.6",
+    "@types/react": "^18.0.38",
+    "@types/react-dom": "^18.0.11",
     "babel-loader": "^9.1.3",
+    "babel-preset-next": "^1.4.0",
     "css-loader": "^6.8.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
     "style-loader": "^3.3.3",
     "ts-loader": "^9.4.4",
+    "typescript": "^5.3.3",
     "webpack": "^5.88.2",
     "webpack-cli": "^5.1.4"
-  },
-  "dependencies": {
-    "aos": "^2.3.4",
-    "next": "^13.3.1",
-    "react-easy-export": "^1.0.1",
-    "react-icons": "^5.0.1",
-    "typescript": "^5.3.3"
   }
 }

package/tsconfig.json

@@ -1,19 +1,21 @@
 {
   "compilerOptions": {
-    "target": "ES6",
+    "target": "es5",
     "lib": ["dom", "dom.iterable", "esnext"],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": false,
-    "forceConsistentCasingInFileNames": true,
-    "noEmit": true,
+    "module": "commonjs",
+    "jsx": "react-jsx",
+    "declaration": true,
+    "outDir": "dist",
     "esModuleInterop": true,
-    "module": "esnext",
     "moduleResolution": "node",
     "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve"
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "incremental": true,
+    "composite": true
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "include": ["ui/**/*", "types/**/*", "next-env.d.ts"],
   "exclude": ["node_modules"]
 }