@q2devel/q2-storybook 1.0.157 → 1.0.158

package/dist/components/MIKS/movie-detail/MovieDetail.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from "react";
 import { Button } from "@q2devel/q2-storybook";
+import parse from "html-react-parser";
 /**
  * MovieDetail Component
  *
@@ -34,5 +35,5 @@ export default function MovieDetail({ title, originalTitle, year, duration, lang
             window.open(imdbUrl, "_blank", "noopener,noreferrer");
         }
     };
-    return (_jsxs("div", { className: `${className}`, children: [_jsxs("div", { className: "hidden lg:flex lg:gap-12.5 lg:justify-between", children: [_jsxs("div", { className: "flex flex-col gap-[41px] w-[614px] shrink-0", children: [_jsxs("div", { className: "relative h-[371px] w-full", children: [_jsx("div", { className: "relative h-full w-full overflow-hidden", children: _jsx("img", { src: posterUrl, alt: title, className: "w-full h-full object-cover" }) }), trailerUrl && (_jsx(Button, { onClick: handleTrailer, rounded: "none", className: "absolute left-[32px] bottom-[20px] bg-primary-cyan text-white px-6.5 py-1.25 uppercase text-[13px] cursor-pointer border-primary-cyan border-1 hover:bg-white hover:text-primary-cyan", children: "UK\u00C1ZKA" }))] }), _jsx("div", { className: "flex flex-col gap-[27px]", children: showtimes.map((showtime, index) => (_jsxs("div", { className: "bg-white border-b border-[#cbdce0] flex items-start justify-between py-[10px]", children: [_jsxs("div", { className: "flex gap-[22px] items-start", children: [_jsx("div", { className: "flex items-center p-[10px] w-[100px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black flex-1", children: showtime.date }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black whitespace-nowrap", children: showtime.time }) }), _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.hall }) }), showtime.subtitles && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.subtitles }) })), showtime.format && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.format }) }))] })] }), _jsx("div", { className: "flex items-center", children: _jsx(Button, { onClick: () => handleTicket(showtime), rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink", children: "VSTUPENKY" }) })] }, index))) })] }), _jsxs("div", { className: "flex flex-col gap-[10px] w-[778px]", children: [_jsxs("h1", { className: "font-bold text-[36px] leading-[54px] text-primary-pink", children: [title, " (", year, ")"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [originalTitle, " (", year, ")"] }), specialTag && (_jsx("div", { className: "border border-primary-grey inline-flex items-center justify-center p-[10px] self-start", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: specialTag }) })), _jsxs("div", { className: "flex gap-[10px] items-start", children: [_jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "D\u00E9lka: " }), duration, " minut"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "Zn\u011Bn\u00ED: " }), language] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "P\u0159\u00EDstupnost: " }), ageRating] })] }), _jsx("div", { className: "text-[16px] leading-[28px] text-primary-black whitespace-pre-line", children: description }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "Re\u017Eie: " }), director] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "\u00DA\u010Dinkuj\u00EDc\u00ED: " }), castString] }), csfdRating && (_jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "\u010CSFD: " }), csfdRating] })), _jsxs("div", { className: "flex gap-[10px] items-start mt-2", children: [csfdUrl && (_jsx(Button, { onClick: handleCSFD, rounded: "none", className: "bg-primary-grey text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey", children: "\u010CSFD" })), imdbUrl && (_jsx(Button, { onClick: handleIMDB, rounded: "none", className: "bg-primary-grey text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey", children: "IMDB" }))] })] })] }), _jsxs("div", { className: "lg:hidden flex flex-col gap-[10px] w-full", children: [_jsxs("h1", { className: "font-bold text-[26px] leading-[40px] text-primary-pink", children: [title, " (", year, ")"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [originalTitle, " (", year, ")"] }), specialTag && (_jsx("div", { className: "border border-primary-grey inline-flex items-center justify-center px-[10px] py-[5px] self-start", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: specialTag }) })), _jsxs("div", { className: "flex flex-wrap gap-[10px] items-start w-full", children: [_jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "D\u00E9lka: " }), duration, " minut"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "Zn\u011Bn\u00ED: " }), language] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "P\u0159\u00EDstupnost: " }), ageRating] })] }), _jsxs("div", { className: "relative h-[187px] w-full", children: [_jsx("div", { className: "relative h-full w-full overflow-hidden", children: _jsx("img", { src: posterUrl, alt: title, className: "w-full h-full object-cover" }) }), trailerUrl && (_jsx(Button, { onClick: handleTrailer, rounded: "none", className: "absolute left-[10px] bottom-[15px] bg-primary-cyan text-white px-6.5 py-1.25 uppercase text-[13px] cursor-pointer border-primary-cyan border-1 hover:bg-white hover:text-primary-cyan", children: "UK\u00C1ZKA" }))] }), showtimes.length > 0 && (_jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [_jsxs("div", { className: "flex items-start justify-between w-full", children: [_jsx("div", { className: "flex items-center pl-0 pr-[10px] py-[5px] w-[100px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black flex-1", children: showtimes[0].date }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black whitespace-nowrap", children: showtimes[0].time }) }), _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex items-center justify-center pl-[10px] pr-0 py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtimes[0].hall }) }), showtimes[0].subtitles && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtimes[0].subtitles }) })), showtimes[0].format && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtimes[0].format }) }))] })] }), _jsx(Button, { onClick: () => handleTicket(showtimes[0]), rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink w-full", children: "VSTUPENKY" })] })), _jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [_jsxs("div", { className: `relative ${!isExpanded ? "h-71 overflow-hidden" : ""}`, children: [!isExpanded && (_jsx("div", { className: "absolute bottom-0 left-0 right-0 h-[84px] bg-gradient-to-b from-transparent to-white pointer-events-none blur-[2px]" })), _jsxs("div", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("p", { className: "mb-4", children: description }), _jsxs("p", { className: "mb-2", children: [_jsx("span", { className: "font-bold", children: "Re\u017Eie: " }), director] }), _jsxs("p", { className: "mb-2", children: [_jsx("span", { className: "font-bold", children: "\u00DA\u010Dinkuj\u00EDc\u00ED: " }), castString] }), csfdRating && (_jsxs("p", { className: "mb-2", children: [_jsx("span", { className: "font-bold", children: "\u010CSFD: " }), csfdRating] }))] })] }), !isExpanded ? (_jsxs("button", { onClick: () => setIsExpanded(true), className: "flex items-center gap-[12px] font-semibold text-[16px] leading-[28px] text-primary-pink", children: [_jsx("span", { children: "+" }), _jsx("span", { children: "Zobrazit v\u00EDc" })] })) : (_jsx(_Fragment, { children: _jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [csfdUrl && (_jsx(Button, { onClick: handleCSFD, rounded: "none", className: "bg-primary-grey text-white px-[26px] py-[5px] uppercase text-[13px] cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey w-full", children: "\u010CSFD" })), imdbUrl && (_jsx(Button, { onClick: handleIMDB, rounded: "none", className: "bg-primary-grey text-white px-[26px] py-[5px] uppercase text-[13px] cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey w-full", children: "IMDB" }))] }) }))] }), showtimes.slice(1).map((showtime, index) => (_jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [_jsxs("div", { className: "flex items-start justify-between w-full", children: [_jsx("div", { className: "flex items-center pl-0 pr-[10px] py-[5px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black whitespace-nowrap", children: showtime.date }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black whitespace-nowrap", children: showtime.time }) }), _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex items-center justify-center pl-[10px] pr-0 py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.hall }) }), showtime.subtitles && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.subtitles }) })), showtime.format && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.format }) }))] })] }), _jsx(Button, { onClick: () => handleTicket(showtime), rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink w-full", children: "VSTUPENKY" })] }, index + 1)))] })] }));
+    return (_jsxs("div", { className: `${className}`, children: [_jsxs("div", { className: "hidden lg:flex lg:gap-12.5 lg:justify-between", children: [_jsxs("div", { className: "flex flex-col gap-[41px] w-[614px] shrink-0", children: [_jsxs("div", { className: "relative h-[371px] w-full", children: [_jsx("div", { className: "relative h-full w-full overflow-hidden", children: _jsx("img", { src: posterUrl, alt: title, className: "w-full h-full object-cover" }) }), trailerUrl && (_jsx(Button, { onClick: handleTrailer, rounded: "none", className: "absolute left-[32px] bottom-[20px] bg-primary-cyan text-white px-6.5 py-1.25 uppercase text-[13px] cursor-pointer border-primary-cyan border-1 hover:bg-white hover:text-primary-cyan", children: "UK\u00C1ZKA" }))] }), _jsx("div", { className: "flex flex-col gap-[27px]", children: showtimes.map((showtime, index) => (_jsxs("div", { className: "bg-white border-b border-[#cbdce0] flex items-start justify-between py-[10px]", children: [_jsxs("div", { className: "flex gap-[22px] items-start", children: [_jsx("div", { className: "flex items-center p-[10px] w-[100px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black flex-1", children: showtime.date }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black whitespace-nowrap", children: showtime.time }) }), _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.hall }) }), showtime.subtitles && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.subtitles }) })), showtime.format && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.format }) }))] })] }), _jsx("div", { className: "flex items-center", children: _jsx(Button, { onClick: () => handleTicket(showtime), rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink", children: "VSTUPENKY" }) })] }, index))) })] }), _jsxs("div", { className: "flex flex-col gap-[10px] w-[778px]", children: [_jsxs("h1", { className: "font-bold text-[36px] leading-[54px] text-primary-pink", children: [title, " (", year, ")"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [originalTitle, " (", year, ")"] }), specialTag && (_jsx("div", { className: "border border-primary-grey inline-flex items-center justify-center p-[10px] self-start", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: specialTag }) })), _jsxs("div", { className: "flex gap-[10px] items-start", children: [_jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "D\u00E9lka: " }), duration, " minut"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "Zn\u011Bn\u00ED: " }), language] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "P\u0159\u00EDstupnost: " }), ageRating] })] }), _jsx("div", { className: "text-[16px] leading-[28px] text-primary-black whitespace-pre-line event-content", children: parse(description) }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "Re\u017Eie: " }), parse(director)] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "\u00DA\u010Dinkuj\u00EDc\u00ED: " }), parse(castString)] }), csfdRating && (_jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [_jsx("span", { className: "font-bold", children: "\u010CSFD: " }), parse(csfdRating)] })), _jsxs("div", { className: "flex gap-[10px] items-start mt-2", children: [csfdUrl && (_jsx(Button, { onClick: handleCSFD, rounded: "none", className: "bg-primary-grey text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey", children: "\u010CSFD" })), imdbUrl && (_jsx(Button, { onClick: handleIMDB, rounded: "none", className: "bg-primary-grey text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey", children: "IMDB" }))] })] })] }), _jsxs("div", { className: "lg:hidden flex flex-col gap-[10px] w-full", children: [_jsxs("h1", { className: "font-bold text-[26px] leading-[40px] text-primary-pink", children: [parse(title), " (", year, ")"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black", children: [parse(originalTitle), " (", year, ")"] }), specialTag && (_jsx("div", { className: "border border-primary-grey inline-flex items-center justify-center px-[10px] py-[5px] self-start", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: parse(specialTag) }) })), _jsxs("div", { className: "flex flex-wrap gap-[10px] items-start w-full", children: [_jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "D\u00E9lka: " }), duration, " minut"] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "Zn\u011Bn\u00ED: " }), language] }), _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: [_jsx("span", { className: "font-bold", children: "P\u0159\u00EDstupnost: " }), ageRating] })] }), _jsxs("div", { className: "relative h-[187px] w-full", children: [_jsx("div", { className: "relative h-full w-full overflow-hidden", children: _jsx("img", { src: posterUrl, alt: title, className: "w-full h-full object-cover" }) }), trailerUrl && (_jsx(Button, { onClick: handleTrailer, rounded: "none", className: "absolute left-[10px] bottom-[15px] bg-primary-cyan text-white px-6.5 py-1.25 uppercase text-[13px] cursor-pointer border-primary-cyan border-1 hover:bg-white hover:text-primary-cyan", children: "UK\u00C1ZKA" }))] }), showtimes.length > 0 && (_jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [_jsxs("div", { className: "flex items-start justify-between w-full", children: [_jsx("div", { className: "flex items-center pl-0 pr-[10px] py-[5px] w-[100px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black flex-1", children: showtimes[0].date }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black whitespace-nowrap", children: showtimes[0].time }) }), _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex items-center justify-center pl-[10px] pr-0 py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtimes[0].hall }) }), showtimes[0].subtitles && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtimes[0].subtitles }) })), showtimes[0].format && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtimes[0].format }) }))] })] }), _jsx(Button, { onClick: () => handleTicket(showtimes[0]), rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink w-full", children: "VSTUPENKY" })] })), _jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [_jsxs("div", { className: `relative ${!isExpanded ? "h-71 overflow-hidden" : ""}`, children: [!isExpanded && (_jsx("div", { className: "absolute bottom-0 left-0 right-0 h-[84px] bg-gradient-to-b from-transparent to-white pointer-events-none blur-[2px]" })), _jsx("div", { className: "text-[16px] leading-[28px] text-primary-blac k mb-4", children: parse(description) }), _jsxs("div", { className: "text-[16px] leading-[28px] text-primary-black mb-2", children: [_jsx("span", { className: "font-bold", children: "Re\u017Eie: " }), parse(director)] }), _jsxs("div", { className: "text-[16px] leading-[28px] text-primary-black mb-2", children: [_jsx("span", { className: "font-bold", children: "\u00DA\u010Dinkuj\u00EDc\u00ED: " }), parse(castString)] }), csfdRating && (_jsxs("div", { className: "text-[16px] leading-[28px] text-primary-black mb-2", children: [_jsx("span", { className: "font-bold", children: "\u010CSFD: " }), parse(csfdRating)] }))] }), !isExpanded ? (_jsxs("button", { onClick: () => setIsExpanded(true), className: "flex items-center gap-[12px] font-semibold text-[16px] leading-[28px] text-primary-pink", children: [_jsx("span", { children: "+" }), _jsx("span", { children: "Zobrazit v\u00EDc" })] })) : (_jsx(_Fragment, { children: _jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [csfdUrl && (_jsx(Button, { onClick: handleCSFD, rounded: "none", className: "bg-primary-grey text-white px-[26px] py-[5px] uppercase text-[13px] cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey w-full", children: "\u010CSFD" })), imdbUrl && (_jsx(Button, { onClick: handleIMDB, rounded: "none", className: "bg-primary-grey text-white px-[26px] py-[5px] uppercase text-[13px] cursor-pointer border-primary-grey border-1 hover:bg-white hover:text-primary-grey w-full", children: "IMDB" }))] }) }))] }), showtimes.slice(1).map((showtime, index) => (_jsxs("div", { className: "flex flex-col gap-[10px] w-full", children: [_jsxs("div", { className: "flex items-start justify-between w-full", children: [_jsx("div", { className: "flex items-center pl-0 pr-[10px] py-[5px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black whitespace-nowrap", children: showtime.date }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "font-bold text-[20px] leading-[30px] text-primary-black whitespace-nowrap", children: showtime.time }) }), _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex items-center justify-center pl-[10px] pr-0 py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.hall }) }), showtime.subtitles && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.subtitles }) })), showtime.format && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[5px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: showtime.format }) }))] })] }), _jsx(Button, { onClick: () => handleTicket(showtime), rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink w-full", children: "VSTUPENKY" })] }, index + 1)))] })] }));
 }

package/dist/components/MIKS/theatre-event/TheatreEvent.d.ts

@@ -21,6 +21,8 @@ export interface TheatreEventProps {
     ticketUrl?: string;
     /** Custom className for additional styling */
     className?: string;
+    /** Click handler for the event */
+    onClick?: () => void;
     /** Click handler for the ticket button */
     onTicketClick?: () => void;
 }
@@ -30,4 +32,4 @@ export interface TheatreEventProps {
  * Displays a theatre/cinema event with details and a ticket purchase button.
  * Responsive design: displays in row layout on desktop and stacked layout on mobile.
  */
-export default function TheatreEvent({ time, hall, title, year, duration, ageRating, subtitles, format, specialTag, ticketUrl, className, onTicketClick, }: TheatreEventProps): import("react/jsx-runtime").JSX.Element;
+export default function TheatreEvent({ time, hall, title, year, duration, ageRating, subtitles, format, specialTag, ticketUrl, className, onClick, onTicketClick, }: TheatreEventProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/MIKS/theatre-event/TheatreEvent.js

@@ -8,7 +8,7 @@ import parse from "html-react-parser";
  * Displays a theatre/cinema event with details and a ticket purchase button.
  * Responsive design: displays in row layout on desktop and stacked layout on mobile.
  */
-export default function TheatreEvent({ time, hall, title, year, duration, ageRating, subtitles, format, specialTag, ticketUrl, className = "", onTicketClick, }) {
+export default function TheatreEvent({ time, hall, title, year, duration, ageRating, subtitles, format, specialTag, ticketUrl, className = "", onClick, onTicketClick, }) {
     const handleTicketClick = () => {
         if (onTicketClick) {
             onTicketClick();
@@ -17,5 +17,5 @@ export default function TheatreEvent({ time, hall, title, year, duration, ageRat
             window.open(ticketUrl, "_blank", "noopener,noreferrer");
         }
     };
-    return (_jsxs("div", { className: `${className}`, children: [_jsxs("div", { className: "hidden md:flex md:flex-wrap md:items-start md:justify-between md:py-2.5", children: [_jsxs("div", { className: "flex gap-[22px] items-start shrink-0 w-full xl:w-auto max-w-full md:justify-between", children: [_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black whitespace-nowrap", children: time }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: hall }) }), _jsx("div", { className: "flex items-center p-[10px] w-[207px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black flex-1", children: parse(title) }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black text-center w-[33px]", children: year }) })] }), _jsxs("div", { className: "flex gap-[22px] items-center shrink-0 justify-between w-full xl:w-auto max-w-full", children: [_jsxs("div", { className: "flex flex-wrap gap-[22px] items-center shrink-0", children: [_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: [duration, " min"] }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: ageRating }) }), subtitles && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: subtitles }) })), format && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: format }) })), specialTag && (_jsx("div", { className: "flex items-center justify-center p-[10px] border border-primary-grey", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: specialTag }) }))] }), _jsx(Button, { onClick: handleTicketClick, rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink", children: "VSTUPENKY" })] })] }), _jsxs("div", { className: "md:hidden flex flex-col w-full", children: [_jsxs("div", { className: "flex items-start", children: [_jsx("div", { className: "flex items-center justify-center py-[2px]", children: _jsx("p", { className: "font-semibold text-[18px] leading-[27px] text-primary-black whitespace-nowrap", children: time }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: hall }) })] }), _jsxs("div", { className: "flex items-end justify-between w-full", children: [_jsx("div", { className: "flex items-center py-[2px] w-[207px]", children: _jsx("p", { className: "font-semibold text-[18px] leading-[27px] text-primary-black flex-1", children: parse(title) }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black text-center w-[33px]", children: year }) })] }), _jsxs("div", { className: "flex flex-wrap min-h-[32px] mb-2.5 items-center justify-between w-full", children: [_jsx("div", { className: "flex items-center justify-center pr-[10px] py-[2px]", children: _jsxs("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: [duration, " min"] }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: ageRating }) }), subtitles && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: subtitles }) })), specialTag && (_jsx("div", { className: "flex items-center justify-center px-[5px] py-[2px] border border-primary-grey", children: _jsx("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: specialTag }) }))] }), _jsx(Button, { onClick: handleTicketClick, rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink", children: "VSTUPENKY" })] })] }));
+    return (_jsxs("div", { className: `${className}`, children: [_jsxs("div", { className: "hidden md:flex md:flex-wrap md:items-start md:justify-between md:py-2.5", children: [_jsxs("div", { className: "flex gap-[22px] items-start shrink-0 w-full xl:w-auto max-w-full md:justify-between cursor-pointer group", onClick: onClick, children: [_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black whitespace-nowrap group-hover:text-primary-pink transition-colors duration-300", children: time }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap group-hover:text-primary-pink transition-colors duration-300", children: hall }) }), _jsx("div", { className: "flex items-center p-[10px] w-[207px]", children: _jsx("p", { className: "font-semibold text-[24px] leading-[30px] text-primary-black flex-1 group-hover:text-primary-pink transition-colors duration-300", children: parse(title) }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black text-center w-[33px] group-hover:text-primary-pink transition-colors duration-300", children: year }) })] }), _jsxs("div", { className: "flex gap-[22px] items-center shrink-0 justify-between w-full xl:w-auto max-w-full", children: [_jsxs("div", { className: "flex flex-wrap gap-[22px] items-center shrink-0", children: [_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsxs("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: [duration, " min"] }) }), _jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: ageRating }) }), subtitles && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: subtitles }) })), format && (_jsx("div", { className: "flex items-center justify-center p-[10px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: format }) })), specialTag && (_jsx("div", { className: "flex items-center justify-center p-[10px] border border-primary-grey", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-grey whitespace-nowrap", children: specialTag }) }))] }), _jsx(Button, { onClick: handleTicketClick, rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink", children: "VSTUPENKY" })] })] }), _jsxs("div", { className: "md:hidden flex flex-col w-full", children: [_jsxs("div", { className: "flex-col w-full", children: [_jsxs("div", { className: "flex items-start", children: [_jsx("div", { className: "flex items-center justify-center py-[2px]", children: _jsx("p", { className: "font-semibold text-[18px] leading-[27px] text-primary-black whitespace-nowrap", children: time }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black whitespace-nowrap", children: hall }) })] }), _jsxs("div", { className: "flex items-end justify-between w-full", children: [_jsx("div", { className: "flex items-center py-[2px] w-[207px]", children: _jsx("p", { className: "font-semibold text-[18px] leading-[27px] text-primary-black flex-1", children: parse(title) }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[16px] leading-[28px] text-primary-black text-center w-[33px]", children: year }) })] })] }), _jsxs("div", { className: "flex flex-wrap min-h-[32px] mb-2.5 items-center justify-between w-full", children: [_jsx("div", { className: "flex items-center justify-center pr-[10px] py-[2px]", children: _jsxs("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: [duration, " min"] }) }), _jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: ageRating }) }), subtitles && (_jsx("div", { className: "flex items-center justify-center px-[10px] py-[2px]", children: _jsx("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: subtitles }) })), specialTag && (_jsx("div", { className: "flex items-center justify-center px-[5px] py-[2px] border border-primary-grey", children: _jsx("p", { className: "text-[13px] leading-[24px] text-primary-grey whitespace-nowrap", children: specialTag }) }))] }), _jsx(Button, { onClick: handleTicketClick, rounded: "none", className: "bg-primary-pink text-white px-11 py-2.5 uppercase text-lg cursor-pointer border-primary-pink border-1 hover:bg-white hover:text-primary-pink", children: "VSTUPENKY" })] })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@q2devel/q2-storybook",
-    "version": "1.0.157",
+    "version": "1.0.158",
     "main": "dist/index.js",
     "module": "dist/index.js",
     "types": "dist/index.d.ts",