@edu-tosel/design 1.0.137 → 1.0.138

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

@@ -1,3 +1,4 @@
+import { OnClick } from "../../../interface";
 interface PromotionOptions {
     className: string;
 }
@@ -6,6 +7,7 @@ export default function Promotion({ banners, option, }: {
     option?: Partial<PromotionOptions>;
 }): import("react/jsx-runtime").JSX.Element;
 interface BannerProps {
+    onClick?: OnClick;
     image: {
         src: string;
         location?: string;

package/layout/template/home/Promotion.js

@@ -14,7 +14,7 @@ export default function Promotion({ banners, option, }) {
                 : currentScrollLeft + scrollAmount;
             scrollContainerRef.current.scrollTo({
                 left: newScrollLeft,
-                behavior: "smooth"
+                behavior: "smooth",
             });
         }
     };
@@ -58,11 +58,11 @@ export default function Promotion({ banners, option, }) {
     const hoverButton = {
         sizes: "rounded-full w-12 h-12 scale-50 group-hover:scale-100",
         animation: "duration-300 ",
-        test: "bg-gray-medium/20 hover:bg-gray-medium/50 pointer-events-auto backdrop-blur-sm fill-red-500"
+        test: "bg-gray-medium/20 hover:bg-gray-medium/50 pointer-events-auto backdrop-blur-sm fill-red-500",
     };
     return (_jsxs("div", { className: cn(container), children: [_jsx("div", { className: cn(deckTitlePositioning), children: _jsx("div", { className: cn(deckTitle), children: "\uC0C8\uB85C\uC6B4 \uC18C\uC2DD" }) }), _jsx("div", { className: cn(cardPositioning), children: _jsx("div", { className: cn(cardWrapper), ref: scrollContainerRef, children: _jsx("div", { className: cn(cardDeck), children: banners.map((banner) => (_jsx(Banner, { ...banner }, banner.image.src))) }) }) }), _jsxs("div", { className: cn(buttonPositioning), children: [_jsx("div", { className: cn(hoverButton), onClick: () => handleScroll("left"), children: _jsx("img", { src: "images/home/handle-left.svg", alt: "" }) }), _jsx("div", { className: cn(hoverButton), onClick: () => handleScroll("right"), children: _jsx("img", { src: "images/home/handle-right.svg", alt: "" }) })] })] }));
 }
-function Banner({ image, option }) {
+function Banner({ onClick, image, option }) {
     const { background } = option ?? {};
     //ghost card snaps to the end of the viewport
     const ghostCard = {
@@ -80,13 +80,13 @@ function Banner({ image, option }) {
         position: "ml:translate-x-[calc(50vw-600px)]",
         transition: "duration-300",
         displays: "relative display-block overflow-hidden",
-        fonts: "font-pretendard-var"
+        fonts: "font-pretendard-var",
     };
     const imageWrapper = {
         sizes: "w-full h-full",
         displays: "absolute",
         positions: "bottom-0 left-0",
-        background: `bg-cover bg-center`
+        background: `bg-cover bg-center`,
     };
-    return (_jsx("div", { className: cn(ghostCard), children: _jsx("div", { className: cn(card), children: _jsx("div", { className: cn(imageWrapper), style: { backgroundImage: `url(${image?.src})` } }) }) }));
+    return (_jsx("div", { className: cn(ghostCard), children: _jsx("div", { className: cn(card), onClick: onClick, children: _jsx("div", { className: cn(imageWrapper), style: { backgroundImage: `url(${image?.src})` } }) }) }));
 }

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

@@ -1,9 +1,10 @@
-import { Titles } from "../../../interface";
+import { OnClick, Titles } from "../../../interface";
 export default function Service({ banners }: {
     banners: BannerProps[];
 }): import("react/jsx-runtime").JSX.Element;
 interface BannerProps {
     titles: Titles;
+    onClick?: OnClick;
     image?: {
         src: string;
         isBlur?: boolean;

package/layout/template/home/Service.js

@@ -61,7 +61,7 @@ export default function Service({ banners }) {
     };
     return (_jsxs("div", { className: cn(container), children: [_jsx("div", { className: cn(deckTitlePositioning), children: _jsx("div", { className: cn(deckTitle), children: "\uD1A0\uC140\uC758 \uCC28\uBCC4\uD654\uB41C \uC11C\uBE44\uC2A4" }) }), _jsx("div", { className: cn(cardPositioning), children: _jsx("div", { className: cn(cardWrapper), ref: scrollContainerRef, children: _jsx("div", { className: cn(cardDeck), children: banners.map((banner) => (_jsx(Banner, { ...banner }, banner.titles.title))) }) }) }), _jsxs("div", { className: cn(buttonPositioning), children: [_jsx("div", { className: cn(hoverButton), onClick: () => handleScroll("left"), children: _jsx("img", { src: "images/home/handle-left.svg", alt: "" }) }), _jsx("div", { className: cn(hoverButton), onClick: () => handleScroll("right"), children: _jsx("img", { src: "images/home/handle-right.svg", alt: "" }) })] })] }));
 }
-function Banner({ titles, image, option }) {
+function Banner({ titles, onClick, image, option }) {
     const { background } = option ?? {};
     //ghost card snaps to the end of the viewport
     const ghostCard = {
@@ -102,5 +102,5 @@ function Banner({ titles, image, option }) {
         positions: "bottom-0 left-0",
         background: `bg-cover bg-center`,
     };
-    return (_jsx("div", { className: cn(ghostCard), children: _jsxs("div", { className: cn(card), children: [_jsx("div", { className: cn(imageWrapper), style: { backgroundImage: `url(${image?.src})` } }), _jsxs("div", { className: cn(titleBox.container), children: [_jsx("div", { className: cn(titleBox.subtitle), children: titles.subtitle }), _jsx("div", { className: cn(titleBox.title), children: titles.title })] })] }) }));
+    return (_jsx("div", { className: cn(ghostCard), children: _jsxs("div", { className: cn(card), onClick: onClick, children: [_jsx("div", { className: cn(imageWrapper), style: { backgroundImage: `url(${image?.src})` } }), _jsxs("div", { className: cn(titleBox.container), children: [_jsx("div", { className: cn(titleBox.subtitle), children: titles.subtitle }), _jsx("div", { className: cn(titleBox.title), children: titles.title })] })] }) }));
 }

package/package.json

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

package/version.txt

@@ -1 +1 @@
-1.0.137
+1.0.138