@edu-tosel/design 1.0.288 → 1.0.290

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

@@ -1,4 +1,9 @@
 import { CarouselContent } from "../../../../interface";
-export default function Carousel({ contents, }: {
+interface CarouselOption {
+    isStatic?: boolean;
+}
+export default function Carousel({ contents, option, }: {
     contents: CarouselContent[];
+    option?: CarouselOption;
 }): import("react/jsx-runtime").JSX.Element;
+export {};

package/layout/template/home/layout/Carousel.js

@@ -7,15 +7,14 @@ import { LineBreaks } from "../../../../text";
 import SVG from "../../../../asset/SVG";
 import { tagString } from "../../../../interface/domain";
 import useResponsive from "../../../../hook/useResponsive";
-export default function Carousel({ contents, }) {
+export default function Carousel({ contents, option, }) {
     const [index, setIndex] = useState(0);
     const [flag, inTime] = useEase(10000, 1000);
     const [loaded, setLoaded] = useState(false);
     const isMD = useResponsive("md");
     const isXL = useResponsive("xl");
     const intervalRef = useRef(null);
-    const { tag, titles, image, option } = contents[index];
-    const { text, background } = option ?? {};
+    const { tag, titles, image } = contents[index];
     // Transition animation using react-spring
     const transitionStyles = useSpring({
         opacity: loaded ? 1 : 0,
@@ -36,7 +35,9 @@ export default function Carousel({ contents, }) {
         }, 3000);
     }, [contents.length]);
     useEffect(() => {
-        resetTimer(); // timerstarts after mounting component
+        if (!option?.isStatic) {
+            resetTimer(); // timerstarts after mounting component
+        }
         return () => {
             // clear timer after unmounting component
             if (intervalRef.current) {
@@ -59,7 +60,7 @@ export default function Carousel({ contents, }) {
         displays: "relative flex justify-center items-center",
         sizes: "w-full h-fit md:h-80 ml:h-100",
         textstyle: "break-keep",
-        background,
+        background: contents[index].option?.background,
         animations: "duration-300",
     };
     const titleWrapper = {
@@ -81,7 +82,7 @@ export default function Carousel({ contents, }) {
     const body = {
         displays: "flex flex-none flex-col items-center justify-center md:flex-row",
         sizes: "w-full max-w-256 h-full",
-        text: text ?? "text-gray-dark",
+        text: contents[index].option?.text ?? "text-gray-dark",
         animations: "duration-500",
     };
     const tagBox = {

package/modalV2/template/index.js

@@ -39,13 +39,13 @@ function ModalV2({ titles, openState, contents, theme, btns, }) {
     const themeColors = {
         green: "green-dark",
         blue: "blue-navy",
-        red: "red-crimson",
+        red: "crimson-dark",
     };
     const buttonStyles = (btn) => btn.active
         ? cn("flex justify-center items-center w-full h-fit rounded-lg p-3", btn.type === "main"
             ? `bg-${themeColors[theme]} text-white`
             : `bg-${themeColors[theme]}/10 text-${themeColors[theme]}`)
         : "flex justify-center items-center w-full h-fit rounded-lg p-3 bg-gray-light text-gray-dark cursor-not-allowed";
-    return (_jsx("div", { className: cn(container), onClick: () => setIsOpen(false), children: _jsx("div", { className: cn(boxPositionWrapper), children: _jsxs("div", { className: cn(tagWrapper), onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "w-full flex justify-between items-start", children: [_jsxs("div", { className: cn(titleWrapper), children: [_jsx("div", { className: cn(titleText), children: titles.title }), _jsx("div", { className: cn(subtitleText), children: titles.subtitle })] }), _jsx("div", { className: "size-6 flex justify-center items-center cursor-pointer", onClick: () => setIsOpen(false), children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", className: "size-6", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18 18 6M6 6l12 12" }) }) })] }), _jsx("div", { className: "w-full flex flex-wrap", children: contents }), btns && (_jsx("div", { className: "w-full flex justify-center gap-2 flex-col sm:flex-row", children: btns.map((btn, index) => btn ? (_jsx("div", { className: cn(buttonStyles(btn), btns.length === 1 ? "w-full" : "w-1/2 sm:w-full"), onClick: btn.active ? btn.options?.onClick : undefined, children: btn.options?.title }, index)) : null) }))] }) }) }));
+    return (_jsx("div", { className: cn(container), onClick: () => setIsOpen(false), children: _jsx("div", { className: cn(boxPositionWrapper), children: _jsxs("div", { className: cn(tagWrapper), onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "w-full flex justify-between items-start", children: [_jsxs("div", { className: cn(titleWrapper), children: [_jsx("div", { className: cn(titleText), children: titles.title }), _jsx("div", { className: cn(subtitleText), children: titles.subtitle })] }), _jsx("div", { className: "size-6 flex justify-center items-center cursor-pointer", onClick: () => setIsOpen(false), children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", className: "size-6", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18 18 6M6 6l12 12" }) }) })] }), _jsx("div", { className: "w-full flex flex-wrap max-h-100 overflow-scroll", children: contents }), btns && (_jsx("div", { className: "w-full flex justify-center gap-2 cursor-pointer flex-col sm:flex-row", children: btns.map((btn, index) => btn ? (_jsx("div", { className: cn(buttonStyles(btn), btns.length === 1 ? "w-full" : "w-1/2 sm:w-full"), onClick: btn.active ? btn.options?.onClick : undefined, children: btn.options?.title }, index)) : null) }))] }) }) }));
 }
 export default ModalV2;

package/package.json

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

package/version.txt

@@ -1 +1 @@
-1.0.288
+1.0.290