@edu-tosel/design 1.0.368 → 1.0.370

package/layout/template/Action.js

@@ -3,7 +3,7 @@ import React, { Fragment } from "react";
 import { useActionStore } from "../../store";
 function Show({ actions, children }) {
     const { events } = useActionStore();
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "no-scrollbar", children: children }), actions?.map(([flag, Component], index) => {
+    return (_jsxs(_Fragment, { children: [children, actions?.map(([flag, Component], index) => {
                 const isVisible = typeof flag === "boolean"
                     ? flag
                     : events?.some(({ event }) => event === flag);

package/layout/template/home/Education.d.ts

@@ -1,4 +1,6 @@
 import { EducationalVideo } from "../../../interface/EducationalVideo";
 export default function Education({ educationalVideos }: {
-    educationalVideos: EducationalVideo[];
+    educationalVideos: (EducationalVideo & {
+        onClick?: () => void;
+    })[];
 }): import("react/jsx-runtime").JSX.Element;

package/layout/template/home/Education.js

@@ -89,9 +89,9 @@ export default function Education({ educationalVideos }) {
         animation: "duration-300",
         test: "bg-gray-medium/20 pointer-events-none backdrop-blur-sm opacity-30",
     };
-    return (_jsx("div", { className: cn(container), children: _jsx("div", { className: cn(cardPositioning), children: _jsx("div", { className: cn(cardWrapper, "comp-customer-videos__cards o-content-container u-hide-on-tablet u-hide-on-mobile"), ref: scrollContainerRef, children: _jsx("div", { className: cn(cardDeck), children: recentVideos.map((video, index) => (_jsx(VideoCard, { video: video, isActive: index === activeVideoIndex, onHover: () => setActiveVideoIndex(index) }, video.id))) }) }) }) }));
+    return (_jsx("div", { className: cn(container), children: _jsx("div", { className: cn(cardPositioning), children: _jsx("div", { className: cn(cardWrapper, "comp-customer-videos__cards o-content-container u-hide-on-tablet u-hide-on-mobile"), ref: scrollContainerRef, children: _jsx("div", { className: cn(cardDeck), children: recentVideos.map((video, index) => (_jsx(VideoCard, { video: video, isActive: index === activeVideoIndex, onHover: () => setActiveVideoIndex(index), onClick: video.onClick }, video.id))) }) }) }) }));
 }
-function VideoCard({ video, isActive, onHover }) {
+function VideoCard({ video, isActive, onHover, onClick }) {
     const ghostCard = {
         displays: "flex",
         spacings: "ms-0 ps-0",
@@ -134,7 +134,7 @@ function VideoCard({ video, isActive, onHover }) {
     };
     // 썸네일 URL: video.thumbnailUrl이 있으면 사용, 없으면 YouTube 썸네일 사용
     const thumbnailUrl = video.thumbnailUrl || `https://img.youtube.com/vi/${video.youtubeId}/maxresdefault.jpg`;
-    return (_jsx("div", { className: cn(ghostCard), children: _jsx("div", { className: cn(card), onMouseEnter: onHover, children: _jsxs("div", { className: cn(videoContainer), children: [_jsx("div", { className: cn("w-full h-full transition-transform duration-500 ease-in-out relative", isActive ? "scale-110" : "scale-100"), children: _jsx("img", { src: thumbnailUrl, alt: video.title, className: "w-full h-full object-cover", onError: (e) => {
+    return (_jsx("div", { className: cn(ghostCard), children: _jsx("div", { className: cn(card, onClick ? "cursor-pointer" : ""), onMouseEnter: onHover, onClick: onClick, children: _jsxs("div", { className: cn(videoContainer), children: [_jsx("div", { className: cn("w-full h-full transition-transform duration-500 ease-in-out relative", isActive ? "scale-110" : "scale-100"), children: _jsx("img", { src: thumbnailUrl, alt: video.title, className: "w-full h-full object-cover", onError: (e) => {
                                 // thumbnailUrl이 제공되지 않은 경우에만 YouTube 썸네일로 대체
                                 if (!video.thumbnailUrl) {
                                     e.currentTarget.src = `https://img.youtube.com/vi/${video.youtubeId}/hqdefault.jpg`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edu-tosel/design",
-  "version": "1.0.368",
+  "version": "1.0.370",
   "description": "UI components for International TOSEL Committee",
   "keywords": [
     "jsx",

package/version.txt

@@ -1 +1 @@
-1.0.368
+1.0.370