elseware-ui 2.3.0 → 2.3.1

package/build/components/data-display/video/youtube-video-player/YoutubeVideoPlayer.d.ts

@@ -1,9 +1,7 @@
-/// <reference types="@types/react" />
-import React from "react";
 interface YoutubeVideoPlayerProps {
     videoUrl: string;
     width?: number;
     height?: number;
 }
-declare const YoutubeVideoPlayer: React.FC<YoutubeVideoPlayerProps>;
+declare function YoutubeVideoPlayer({ videoUrl, width, height, }: YoutubeVideoPlayerProps): import("react/jsx-runtime").JSX.Element;
 export default YoutubeVideoPlayer;

package/build/index.es.js

@@ -33604,14 +33604,17 @@ var getYoutubeEmbedUrl = function (url) {
     var videoIdMatch = url.match(/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/);
     return videoIdMatch ? "https://www.youtube.com/embed/".concat(videoIdMatch[1]) : "";
 };
-var YoutubeVideoPlayer = function (_a) {
+function YoutubeVideoPlayer(_a) {
     var videoUrl = _a.videoUrl, _b = _a.width, width = _b === void 0 ? 750 : _b, _c = _a.height, height = _c === void 0 ? 422 : _c;
     var embedUrl = getYoutubeEmbedUrl(videoUrl);
     if (!embedUrl) {
         return jsxRuntime.jsx(FormResponse, { text: "Invalid YouTube URL", variant: "danger" });
     }
-    return (jsxRuntime.jsx("div", __assign$1({ className: "flex justify-center" }, { children: jsxRuntime.jsx("iframe", { width: width, height: height, src: embedUrl, title: "YouTube video player", frameBorder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, className: "rounded-lg shadow-lg" }) })));
-};
+    return (jsxRuntime.jsx("div", __assign$1({ className: "flex justify-center" }, { children: jsxRuntime.jsx("div", __assign$1({ className: "relative w-full", style: {
+                maxWidth: "".concat(width, "px"),
+                paddingTop: "".concat((height / width) * 100, "%"),
+            } }, { children: jsxRuntime.jsx("iframe", { src: embedUrl, title: "YouTube video player", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, className: "absolute top-0 left-0 w-full h-full rounded-lg shadow-lg" }) })) })));
+}
 
 function InputResponse(_a) {
     var _b;

package/build/index.js

@@ -33630,14 +33630,17 @@ var getYoutubeEmbedUrl = function (url) {
     var videoIdMatch = url.match(/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/);
     return videoIdMatch ? "https://www.youtube.com/embed/".concat(videoIdMatch[1]) : "";
 };
-var YoutubeVideoPlayer = function (_a) {
+function YoutubeVideoPlayer(_a) {
     var videoUrl = _a.videoUrl, _b = _a.width, width = _b === void 0 ? 750 : _b, _c = _a.height, height = _c === void 0 ? 422 : _c;
     var embedUrl = getYoutubeEmbedUrl(videoUrl);
     if (!embedUrl) {
         return jsxRuntime.jsx(FormResponse, { text: "Invalid YouTube URL", variant: "danger" });
     }
-    return (jsxRuntime.jsx("div", __assign$1({ className: "flex justify-center" }, { children: jsxRuntime.jsx("iframe", { width: width, height: height, src: embedUrl, title: "YouTube video player", frameBorder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, className: "rounded-lg shadow-lg" }) })));
-};
+    return (jsxRuntime.jsx("div", __assign$1({ className: "flex justify-center" }, { children: jsxRuntime.jsx("div", __assign$1({ className: "relative w-full", style: {
+                maxWidth: "".concat(width, "px"),
+                paddingTop: "".concat((height / width) * 100, "%"),
+            } }, { children: jsxRuntime.jsx("iframe", { src: embedUrl, title: "YouTube video player", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, className: "absolute top-0 left-0 w-full h-full rounded-lg shadow-lg" }) })) })));
+}
 
 function InputResponse(_a) {
     var _b;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "elseware-ui",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "private": false,
   "description": "A modern and customizable React UI component library by elseware Technology.",
   "types": "build/index.d.ts",