@edu-tosel/design 1.0.195 → 1.0.197

package/layout/index.d.ts

@@ -22,5 +22,5 @@ export { default as RegexamLayout } from "./template/Regexam/Regexam.layout";
 export { default as BooksLayout } from "./template/Books/Books.layout";
 export { default as LegacyLayout } from "./template/Legacy/Legacy.layout";
 export { default as MonthlyProgressReport } from "./template/MonthlyProgressReport";
-export { default as Ticket } from "./template/Ticket";
 export { default as Transcript } from "./template/Transcript";
+export { default as Ticket } from "./template/Ticket";

package/layout/index.js

@@ -22,5 +22,5 @@ export { default as RegexamLayout } from "./template/Regexam/Regexam.layout";
 export { default as BooksLayout } from "./template/Books/Books.layout";
 export { default as LegacyLayout } from "./template/Legacy/Legacy.layout";
 export { default as MonthlyProgressReport } from "./template/MonthlyProgressReport";
-export { default as Ticket } from "./template/Ticket";
 export { default as Transcript } from "./template/Transcript";
+export { default as Ticket } from "./template/Ticket";

package/layout/template/Ticket/Extension.d.ts

@@ -0,0 +1,12 @@
+import { TicketProps } from "./Ticket";
+interface TicketLayoutProps {
+    props: TicketProps;
+    option?: {
+        omrUrl?: string;
+        locationUrl?: string;
+        ruleUrl?: string;
+        noPrint?: boolean;
+    };
+}
+export default function TicketExtension({ props, option }: TicketLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/layout/template/Ticket/Extension.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useReactToPrint } from "react-to-print";
+import { cn } from "../../../util";
+import { Label } from "../../../widget";
+import Ticket from "./Ticket.design";
+import { useRef } from "react";
+import OmrNotificationMolecule from "./molecule/OmrNotification.molecule";
+import HallNotificationMolecule from "./molecule/HallNotification.molecule";
+import RuleNotificationMolecule from "./molecule/RuleNotification.molecule";
+export default function TicketExtension({ props, option }) {
+    const { noPrint, omrUrl, locationUrl, ruleUrl } = option ?? {};
+    const body = {
+        positions: "relative justify-center items-center sm:items-start",
+        displays: "flex sm:flex-row flex-col",
+        sizes: "w-full h-fit",
+        spacings: "gap-x-10",
+    };
+    const ref = useRef(null);
+    const handlePrint = useReactToPrint({
+        content: () => ref.current,
+    });
+    return (_jsxs("div", { className: cn(body), children: [_jsx(Ticket, { ref: ref, props: props }), _jsxs("div", { className: "relative w-48 flex flex-row md:flex-col md:h-[700px] gap-4 h-full justify-start mt-5 items-center", children: [!noPrint && (_jsx("div", { className: "md:flex hidden", children: _jsx(Label.Button, { title: "\uC218\uD5D8\uD45C \uCD9C\uB825\uD558\uAE30", onClick: handlePrint, option: {
+                                width: "md",
+                                height: "sm",
+                                background: "bg-white shadow-main",
+                                text: "text-green-dark font-pretendard-var font-medium",
+                            } }) })), omrUrl && _jsx(OmrNotificationMolecule, { omrUrl: omrUrl }), locationUrl && (_jsx(HallNotificationMolecule, { examAddress: props.exam.address, locationUrl: locationUrl })), ruleUrl && _jsx(RuleNotificationMolecule, { ruleUrl: ruleUrl })] })] }));
+}

package/layout/template/Ticket/TableExtension.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from "react";
+import { OnClick } from "../../../interface";
+type ExamHallType = "hall" | "academy" | "home";
+interface TableExtensionProps {
+    children: ReactNode;
+    examName: string;
+    examHallType: ExamHallType;
+    printAll: OnClick;
+    printOne: OnClick;
+    downloadExcel: OnClick;
+}
+export default function TableExtension({ children, examName, examHallType, printAll, printOne, downloadExcel, }: TableExtensionProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/layout/template/Ticket/TableExtension.js

@@ -0,0 +1,21 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../../../util";
+import TableButtonsMolecule from "./molecule/TableButtons.molecule";
+const examHallTypeString = {
+    hall: "고사장",
+    academy: "학원",
+    home: "가정",
+};
+export default function TableExtension({ children, examName, examHallType, printAll, printOne, downloadExcel, }) {
+    const container = {
+        displays: "flex flex-col gap-y-3",
+    };
+    const header = {
+        displays: "flex justify-between items-center",
+        sizes: "w-[510px] h-15",
+        boundaries: "rounded-[15px] px-5",
+        backgrounds: "bg-green-dark",
+        texts: "text-white ",
+    };
+    return (_jsxs("div", { className: cn(container), children: [_jsxs("div", { className: cn(header), children: [_jsxs("div", { className: "font-bold", children: [examName, " \uC218\uD5D8\uD45C"] }), _jsxs("div", { children: [examHallTypeString[examHallType], " \uC751\uC2DC"] })] }), children, _jsx(TableButtonsMolecule, { printAll: printAll, printOne: printOne, downloadExcel: downloadExcel })] }));
+}

package/layout/template/Ticket/Ticket.d.ts

@@ -1,3 +1,4 @@
+import { OnClick } from "../../../interface";
 export interface TicketProps {
     exam: {
         title: string;
@@ -8,12 +9,8 @@ export interface TicketProps {
         startedAt: string;
     };
     name: string;
-    profileImageUrl?: string;
+    profile?: string | OnClick;
     birthday: string;
     level: string;
     code: string;
 }
-declare const _default: import("react").ForwardRefExoticComponent<{
-    props: TicketProps;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default _default;

package/layout/template/Ticket/Ticket.design.d.ts

@@ -0,0 +1,5 @@
+import { TicketProps } from "./Ticket";
+declare const _default: import("react").ForwardRefExoticComponent<{
+    props: TicketProps;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export default _default;

package/layout/template/Ticket/Ticket.design.js

@@ -0,0 +1,78 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useState } from "react";
+import { cn } from "../../../util";
+import moment from "moment-timezone";
+import { animated, useTransition } from "react-spring";
+import SVG from "../../../asset/SVG";
+function TicketDesign({ props }, ref) {
+    const [hover, setHover] = useState(false);
+    const hoverBox = {
+        positions: "absolute top-0 left-0",
+        displays: "flex flex-col gap-y-2.75 justify-center items-center",
+        sizes: "w-full h-full",
+        styles: "bg-black/50",
+    };
+    const transitions = useTransition(hover, {
+        from: { opacity: 0 },
+        enter: { opacity: 1 },
+        leave: { opacity: 0 },
+        config: { duration: 150 },
+    });
+    const { title, date, hall, room, startedAt } = props.exam;
+    //수험번호 섹션 디자인을 위한 배열
+    const numberArray = props.code.split("").map(Number);
+    numberArray.splice(3, 0, null);
+    numberArray.splice(7, 0, null);
+    const container = {
+        sizes: "w-full max-w-[340px] xs:w-[340px] h-[700px] flex flex-col justify-start",
+        spacings: "p-5 print:m-10",
+        boundaries: "border-1 border-gray-medium shadow-main",
+        backgrounds: "bg-white",
+    };
+    const logoWrapper = {
+        displays: "flex flex-row justify-between w-full mb-3",
+    };
+    const svgController = {
+        sizes: "h-8",
+    };
+    const titleDivider = {
+        sizes: "w-full h-0.5",
+        backgrounds: "bg-gradient-to-r from-crimson-burgundy to-green-dark",
+    };
+    const cellWrapper = {
+        displays: "flex flex-row",
+        sizes: "w-full",
+        boundaries: "border-1 border-gray-medium",
+    };
+    const cellTitleLarge = {
+        displays: "flex justify-center items-center shrink-0",
+        sizes: "w-21 h-6",
+        textstyles: "text-2xs font-medium",
+        backgrounds: "bg-gray-light",
+    };
+    const cellTitleSmall = {
+        displays: "flex justify-center items-center shrink-0",
+        sizes: "w-16 h-6",
+        textstyles: "text-2xs font-medium",
+        backgrounds: "bg-gray-light",
+    };
+    const cellText = {
+        sizes: "w-full",
+        displays: "flex justify-center items-center",
+        textstyles: "text-2xs font-medium text-black",
+    };
+    const formmatedStartedAt = moment(startedAt, "HH:mm:ss").format("HH:mm");
+    const formmatedEndedAt = (startTime, level) => {
+        const formattedStartTime = moment(startTime, "HH:mm:ss");
+        const endTime = level === "High Junior"
+            ? formattedStartTime.add(1, "hours").add(20, "minutes").format("HH:mm")
+            : formattedStartTime.add(1, "hours").add(10, "minutes").format("HH:mm");
+        return endTime;
+    };
+    return (_jsxs("div", { ref: ref, className: cn(container), children: [_jsxs("div", { className: cn(logoWrapper), children: [_jsx("img", { className: cn(svgController), src: "/images/logos/logo-itc-main.svg", alt: "" }), _jsx("img", { className: cn(svgController), src: "/images/logos/logo-tosel-main.svg", alt: "" })] }), _jsxs("div", { className: "flex flex-col w-full gap-2.5", children: [_jsx("div", { className: cn(titleDivider) }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-lg font-bold leading-none", children: "\uC218 \uD5D8 \uD45C" }), _jsx("div", { className: "text-sm font-medium leading-none", children: title })] }), _jsx("div", { className: cn(titleDivider) })] }), _jsxs("div", { className: "flex flex-col gap-5 mt-5", children: [_jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge), children: "\uC218\uD5D8\uBC88\uD638" }), _jsx("div", { className: "w-full flex flex-row divide-x-[1px] divide-dashed divide-gray-medium/50", children: numberArray.map((num, index) => (_jsx("div", { className: `flex justify-center items-center text-xs font-medium ${num === null
+                                                ? "w-2.5 shrink-0 bg-gray-light"
+                                                : "w-full bg-white"}`, children: num !== null ? num : "" }, index))) })] }), _jsxs("div", { className: "font-medium text-2xs", children: ["*OMR (1)\uBC88 \uD56D\uBAA9\uC5D0 \uD574\uB2F9\uBC88\uD638\uB97C \uB530\uB77C\uC11C \uC368\uC8FC\uC138\uC694.", " "] })] }), _jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge), children: "\uB808\uBCA8" }), _jsx("div", { className: cn(cellText), children: props.level })] }), _jsxs("div", { className: "flex flex-row gap-2", children: [_jsxs("div", { className: "flex flex-col gap-0 h-full w-21 border-1 border-gray-medium shrink-0", children: [typeof props.profile !== "function" ? (_jsx("div", { className: "h-full w-full bg-cover", style: {
+                                            backgroundImage: `url(${props.profile ?? ""})`,
+                                        } })) : (typeof props.profile === "function" && (_jsxs("button", { onMouseEnter: () => setHover(true), onMouseLeave: () => setHover(false), onClick: props.profile, className: "w-full h-full overflow-hidden relative bg-gray-light", children: [_jsx("img", { className: "bg-cover", src: "https://tosel.cdn.ntruss.com/images/picture.png" }), transitions((styles, item) => item && (_jsxs(animated.div, { style: styles, className: cn(hoverBox), children: [_jsx(SVG.Image, {}), _jsx("div", { className: "text-white text-xs leading-none", children: "\uC0AC\uC9C4 \uBC14\uAFB8\uAE30" })] })))] }))), _jsx("div", { className: cn(cellTitleLarge, "w-full"), children: "\uC0AC\uC9C4" })] }), _jsxs("div", { className: "flex flex-col gap-2 w-full", children: [_jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uC774\uB984" }), _jsx("div", { className: cn(cellText), children: props.name })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uC0DD\uB144\uC6D4\uC77C" }), _jsx("div", { className: cn(cellText), children: props.birthday })] })] }), _jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uACE0\uC0AC\uC7A5" }), _jsx("div", { className: cn(cellText), children: hall })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uACE0\uC0AC\uC2E4" }), _jsx("div", { className: cn(cellText), children: room })] })] })] })] }), _jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC2DC\uD5D8\uC77C\uC790" }), _jsx("div", { className: cn(cellText), children: props.exam.date })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC785\uC2E4 \uC644\uB8CC\uC2DC\uAC04" }), _jsx("div", { className: cn(cellText), children: formmatedStartedAt })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC885\uB8CC\uC2DC\uAC04" }), _jsx("div", { className: cn(cellText), children: formmatedEndedAt(startedAt, props.level) })] }), _jsxs("div", { className: "flex flex-col mt-1", children: [_jsx("div", { className: "font-medium text-2xs leading-tight", children: "*\uC785\uC2E4\uC2DC\uAC04 \uC774\uD6C4\uC5D0\uB294 \uC785\uC2E4\uC774 \uC81C\uD55C\uB429\uB2C8\uB2E4." }), _jsx("div", { className: "font-medium text-2xs leading-tight", children: "*\uACE0\uC0AC\uC7A5 \uC5EC\uAC74\uC5D0 \uB530\uB77C \uD1F4\uC2E4\uC2DC\uAC04\uC740 \uC870\uAE08\uC529 \uC0C1\uC774\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4." })] })] }), _jsx("div", { className: "w-full border-b-1 border-dashed border-gray-medium" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "font-bold text-sm leading-tight", children: "\uC751\uC2DC\uC790 \uC720\uC758\uC0AC\uD56D" }), _jsxs("ul", { className: "list-outside list-decimal ml-4 font-medium text-2xs", children: [_jsxs("li", { className: "mb-1", children: ["\uB2E4\uC74C\uC758 \uBB3C\uD488\uC744 \uAF2D \uC900\uBE44\uD574\uC8FC\uC138\uC694:", _jsx("br", {}), " \uCEF4\uD4E8\uD130\uC6A9 \uC0AC\uC778\uD39C / \uC218\uC815 \uD14C\uC774\uD504 / \uC218\uD5D8\uD45C / \uAC80\uC815 \uBCFC\uD39C"] }), _jsxs("li", { className: "mb-1", children: ["\uACE0\uC0AC\uC7A5 \uC704\uCE58\uB97C \uBBF8\uB9AC \uD655\uC778\uD574\uC8FC\uC138\uC694:", _jsx("br", {}), " \uC218\uD5D8\uD45C\uC5D0 \uAE30\uC7AC\uB41C \uACE0\uC0AC\uC7A5, \uACE0\uC0AC\uC2E4 \uC815\uBCF4\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694."] }), _jsxs("li", { children: ["\uD559\uBD80\uBAA8 \uCD9C\uC785 \uD1B5\uC81C:", _jsx("br", {}), "\uACE0\uC0AC\uC2E4 \uB0B4\uBD80\uC5D0\uB294 \uD559\uBD80\uBAA8\uC758 \uCD9C\uC785\uC774 \uC5C4\uACA9\uD788 \uD1B5\uC81C\uB429\uB2C8\uB2E4."] })] })] })] })] }));
+}
+export default forwardRef(TicketDesign);

package/layout/template/Ticket/Ticket.js

@@ -1,63 +1 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { cn } from "../../../util";
-import moment from "moment-timezone";
-function Ticket({ props }, ref) {
-    const { title, date, hall, room, startedAt } = props.exam;
-    //수험번호 섹션 디자인을 위한 배열
-    const numberArray = props.code.split("").map(Number);
-    numberArray.splice(3, 0, null);
-    numberArray.splice(7, 0, null);
-    const container = {
-        sizes: "w-full max-w-[340px] xs:w-[340px] h-[700px] flex flex-col justify-start",
-        spacings: "p-5 print:m-10",
-        boundaries: "border-1 border-gray-medium shadow-main",
-        backgrounds: "bg-white",
-    };
-    const logoWrapper = {
-        displays: "flex flex-row justify-between w-full mb-3",
-    };
-    const svgController = {
-        sizes: "h-8",
-    };
-    const titleDivider = {
-        sizes: "w-full h-0.5",
-        backgrounds: "bg-gradient-to-r from-crimson-burgundy to-green-dark",
-    };
-    const cellWrapper = {
-        displays: "flex flex-row",
-        sizes: "w-full",
-        boundaries: "border-1 border-gray-medium",
-    };
-    const cellTitleLarge = {
-        displays: "flex justify-center items-center shrink-0",
-        sizes: "w-21 h-6",
-        textstyles: "text-2xs font-medium",
-        backgrounds: "bg-gray-light",
-    };
-    const cellTitleSmall = {
-        displays: "flex justify-center items-center shrink-0",
-        sizes: "w-16 h-6",
-        textstyles: "text-2xs font-medium",
-        backgrounds: "bg-gray-light",
-    };
-    const cellText = {
-        sizes: "w-full",
-        displays: "flex justify-center items-center",
-        textstyles: "text-2xs font-medium text-black",
-    };
-    const formmatedStartedAt = moment(startedAt, "HH:mm:ss").format("HH:mm");
-    const formmatedEndedAt = (startTime, level) => {
-        const formattedStartTime = moment(startTime, "HH:mm:ss");
-        const endTime = level === "High Junior"
-            ? formattedStartTime.add(1, "hours").add(20, "minutes").format("HH:mm")
-            : formattedStartTime.add(1, "hours").add(10, "minutes").format("HH:mm");
-        return endTime;
-    };
-    return (_jsxs("div", { ref: ref, className: cn(container), children: [_jsxs("div", { className: cn(logoWrapper), children: [_jsx("img", { className: cn(svgController), src: "/images/logos/logo-itc-main.svg", alt: "" }), _jsx("img", { className: cn(svgController), src: "/images/logos/logo-tosel-main.svg", alt: "" })] }), _jsxs("div", { className: "flex flex-col w-full gap-2.5", children: [_jsx("div", { className: cn(titleDivider) }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-lg font-bold leading-none", children: "\uC218 \uD5D8 \uD45C" }), _jsx("div", { className: "text-sm font-medium leading-none", children: title })] }), _jsx("div", { className: cn(titleDivider) })] }), _jsxs("div", { className: "flex flex-col gap-5 mt-5", children: [_jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge), children: "\uC218\uD5D8\uBC88\uD638" }), _jsx("div", { className: "w-full flex flex-row divide-x-[1px] divide-dashed divide-gray-medium/50", children: numberArray.map((num, index) => (_jsx("div", { className: `flex justify-center items-center text-xs font-medium ${num === null
-                                                ? "w-2.5 shrink-0 bg-gray-light"
-                                                : "w-full bg-white"}`, children: num !== null ? num : "" }, index))) })] }), _jsxs("div", { className: "font-medium text-2xs", children: ["*OMR (1)\uBC88 \uD56D\uBAA9\uC5D0 \uD574\uB2F9\uBC88\uD638\uB97C \uB530\uB77C\uC11C \uC368\uC8FC\uC138\uC694.", " "] })] }), _jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge), children: "\uB808\uBCA8" }), _jsx("div", { className: cn(cellText), children: props.level })] }), _jsxs("div", { className: "flex flex-row gap-2", children: [_jsxs("div", { className: "flex flex-col gap-0 h-full w-21 border-1 border-gray-medium shrink-0", children: [_jsx("div", { className: "h-full w-full bg-cover", style: {
-                                            backgroundImage: `url(${props.profileImageUrl ?? ""})`,
-                                        } }), _jsx("div", { className: cn(cellTitleLarge, "w-full"), children: "\uC0AC\uC9C4" })] }), _jsxs("div", { className: "flex flex-col gap-2 w-full", children: [_jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uC774\uB984" }), _jsx("div", { className: cn(cellText), children: props.name })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uC0DD\uB144\uC6D4\uC77C" }), _jsx("div", { className: cn(cellText), children: props.birthday })] })] }), _jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uACE0\uC0AC\uC7A5" }), _jsx("div", { className: cn(cellText), children: hall })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uACE0\uC0AC\uC2E4" }), _jsx("div", { className: cn(cellText), children: room })] })] })] })] }), _jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC2DC\uD5D8\uC77C\uC790" }), _jsx("div", { className: cn(cellText), children: props.exam.date })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC785\uC2E4 \uC644\uB8CC\uC2DC\uAC04" }), _jsx("div", { className: cn(cellText), children: formmatedStartedAt })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC885\uB8CC\uC2DC\uAC04" }), _jsx("div", { className: cn(cellText), children: formmatedEndedAt(startedAt, props.level) })] }), _jsxs("div", { className: "flex flex-col mt-1", children: [_jsx("div", { className: "font-medium text-2xs leading-tight", children: "*\uC785\uC2E4\uC2DC\uAC04 \uC774\uD6C4\uC5D0\uB294 \uC785\uC2E4\uC774 \uC81C\uD55C\uB429\uB2C8\uB2E4." }), _jsx("div", { className: "font-medium text-2xs leading-tight", children: "*\uACE0\uC0AC\uC7A5 \uC5EC\uAC74\uC5D0 \uB530\uB77C \uD1F4\uC2E4\uC2DC\uAC04\uC740 \uC870\uAE08\uC529 \uC0C1\uC774\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4." })] })] }), _jsx("div", { className: "w-full border-b-1 border-dashed border-gray-medium" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "font-bold text-sm leading-tight", children: "\uC751\uC2DC\uC790 \uC720\uC758\uC0AC\uD56D" }), _jsxs("ul", { className: "list-outside list-decimal ml-4 font-medium text-2xs", children: [_jsxs("li", { className: "mb-1", children: ["\uB2E4\uC74C\uC758 \uBB3C\uD488\uC744 \uAF2D \uC900\uBE44\uD574\uC8FC\uC138\uC694:", _jsx("br", {}), " \uCEF4\uD4E8\uD130\uC6A9 \uC0AC\uC778\uD39C / \uC218\uC815 \uD14C\uC774\uD504 / \uC218\uD5D8\uD45C / \uAC80\uC815 \uBCFC\uD39C"] }), _jsxs("li", { className: "mb-1", children: ["\uACE0\uC0AC\uC7A5 \uC704\uCE58\uB97C \uBBF8\uB9AC \uD655\uC778\uD574\uC8FC\uC138\uC694:", _jsx("br", {}), " \uC218\uD5D8\uD45C\uC5D0 \uAE30\uC7AC\uB41C \uACE0\uC0AC\uC7A5, \uACE0\uC0AC\uC2E4 \uC815\uBCF4\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694."] }), _jsxs("li", { children: ["\uD559\uBD80\uBAA8 \uCD9C\uC785 \uD1B5\uC81C:", _jsx("br", {}), "\uACE0\uC0AC\uC2E4 \uB0B4\uBD80\uC5D0\uB294 \uD559\uBD80\uBAA8\uC758 \uCD9C\uC785\uC774 \uC5C4\uACA9\uD788 \uD1B5\uC81C\uB429\uB2C8\uB2E4."] })] })] })] })] }));
-}
-export default forwardRef(Ticket);
+export {};

package/layout/template/Ticket/index.d.ts

@@ -1,10 +1,10 @@
-import Layout from "./Layout";
-import Academy from "./academy/Academy";
-declare const Ticket: {
-    Academy: typeof Academy;
-    Paper: import("react").ForwardRefExoticComponent<{
-        props: import("./Ticket").TicketProps;
-    } & import("react").RefAttributes<HTMLDivElement>>;
-    Layout: typeof Layout;
-};
+import { TicketProps } from "./Ticket";
+import TicketExtension from "./Extension";
+declare function Ticket(props: {
+    props: TicketProps;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace Ticket {
+    var Extension: typeof TicketExtension;
+    var TableExtension: typeof import("./TableExtension").default;
+}
 export default Ticket;

package/layout/template/Ticket/index.js

@@ -1,9 +1,10 @@
-import Layout from "./Layout";
-import _Ticket from "./Ticket";
-import Academy from "./academy/Academy";
-const Ticket = {
-    Academy: Academy,
-    Paper: _Ticket,
-    Layout,
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+import TicketDesign from "./Ticket.design";
+import TicketExtension from "./Extension";
+import TableExtension from "./TableExtension";
+function Ticket(props) {
+    return _jsx(TicketDesign, { ...props });
+}
+Ticket.Extension = TicketExtension;
+Ticket.TableExtension = TableExtension;
 export default Ticket;

package/layout/template/Ticket/molecule/HallNotification.molecule.d.ts

@@ -0,0 +1,4 @@
+export default function HallNotificationMolecule({ examAddress, locationUrl, }: {
+    examAddress: string;
+    locationUrl: string;
+}): import("react/jsx-runtime").JSX.Element;

package/layout/template/Ticket/molecule/HallNotification.molecule.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Label } from "../../../../widget";
+export default function HallNotificationMolecule({ examAddress, locationUrl, }) {
+    return (_jsxs("div", { className: "sm:absolute flex flex-col gap-4 left-0 top-80", children: [_jsxs("div", { className: "flex-col font-pretendard-var hidden sm:flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "\uACE0\uC0AC\uC7A5 \uC704\uCE58" }), _jsx("div", { className: "text-gray-dark", children: "\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: examAddress })] }), _jsx(Label.Button, { title: "\uC9C0\uB3C4\uC5D0\uC11C \uBCF4\uAE30", onClick: () => {
+                    window.open(locationUrl);
+                }, option: {
+                    width: "sm",
+                    height: "xs",
+                    background: "bg-green-dark",
+                    text: "text-white font-pretendard-var font-medium",
+                } })] }));
+}

package/layout/template/Ticket/molecule/OmrNotification.molecule.d.ts

@@ -0,0 +1,3 @@
+export default function OmrNotificationMolecule({ omrUrl, }: {
+    omrUrl: string;
+}): import("react/jsx-runtime").JSX.Element;

package/layout/template/Ticket/molecule/OmrNotification.molecule.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Label } from "../../../../widget";
+export default function OmrNotificationMolecule({ omrUrl, }) {
+    return (_jsxs("div", { className: "sm:absolute hidden sm:flex flex-col gap-4 left-0 top-36", children: [_jsxs("div", { className: "flex-col font-pretendard-var flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "OMR \uC791\uC131" }), _jsx("div", { className: "text-gray-dark", children: ", \uC5F0\uC2B5\uD558\uC168\uB098\uC694?" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: "\uB9C8\uD0B9\uD39C\uC73C\uB85C \uC791\uC131\uBC95\uC744 \uBBF8\uB9AC \uC5F0\uC2B5\uD574\uBCF4\uC138\uC694!" })] }), _jsx(Label.Button, { title: "OMR \uC778\uC1C4", onClick: () => window.open(omrUrl), option: {
+                    width: "sm",
+                    height: "xs",
+                    background: "bg-green-dark",
+                    text: "text-white font-pretendard-var font-medium",
+                } })] }));
+}

package/layout/template/Ticket/molecule/RuleNotification.molecule.d.ts

@@ -0,0 +1,3 @@
+export default function RuleNotificationMolecule({ ruleUrl, }: {
+    ruleUrl: string;
+}): import("react/jsx-runtime").JSX.Element;

package/layout/template/Ticket/molecule/RuleNotification.molecule.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Label } from "../../../../widget";
+export default function RuleNotificationMolecule({ ruleUrl, }) {
+    return (_jsxs("div", { className: "sm:absolute flex flex-col gap-4 left-0 top-128", children: [_jsxs("div", { className: "flex-col font-pretendard-var hidden sm:flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "\uC900\uBE44\uBB3C" }), _jsx("div", { className: "text-gray-dark", children: "\uB3C4 \uD655\uC778\uD574\uC8FC\uC138\uC694" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: "\uB9C8\uD0B9\uD39C\uC73C\uB85C \uC791\uC131\uBC95\uC744 \uBBF8\uB9AC \uC5F0\uC2B5\uD574\uBCF4\uC138\uC694!" })] }), _jsx(Label.Button, { title: "\uC2DC\uD5D8 \uADDC\uC815 \uD655\uC778", onClick: () => window.open(ruleUrl), option: {
+                    width: "sm",
+                    height: "xs",
+                    background: "bg-green-dark",
+                    text: "text-white font-pretendard-var font-medium",
+                } })] }));
+}

package/layout/template/Ticket/molecule/TableButtons.molecule.d.ts

@@ -0,0 +1,6 @@
+import { OnClick } from "@edu-tosel/design/interface";
+export default function TableButtonsMolecule({ printAll, printOne, downloadExcel, }: {
+    printAll: OnClick;
+    printOne: OnClick;
+    downloadExcel: OnClick;
+}): import("react/jsx-runtime").JSX.Element;

package/layout/template/Ticket/molecule/TableButtons.molecule.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HiOutlinePrinter } from "react-icons/hi2";
+import { HiOutlineTableCells } from "react-icons/hi2";
+import { cn } from "../../../../util";
+export default function TableButtonsMolecule({ printAll, printOne, downloadExcel, }) {
+    const btn = {
+        displays: "flex items-center justify-center gap-2",
+        rounded: "rounded-lg",
+        backgrounds: "bg-white/50",
+        texts: " text-green-dark font-semibold",
+        shadows: "shadow-main",
+        sizes: "w-1/3 h-full px-2.5",
+        cursors: "cursor-pointer",
+    };
+    return (_jsxs("div", { className: "flex w-full h-12 gap-3", children: [_jsxs("div", { className: cn(btn), onClick: printAll, children: [_jsx(HiOutlinePrinter, { className: "text-2xl" }), _jsx("div", { className: "text-center", children: "\uC804\uCCB4 \uC218\uD5D8\uD45C \uCD9C\uB825" })] }), _jsxs("div", { className: cn(btn), onClick: printOne, children: [_jsx(HiOutlinePrinter, { className: "text-2xl" }), _jsx("div", { className: "text-center", children: "\uD604\uC7AC \uD559\uC0DD \uCD9C\uB825" })] }), _jsxs("div", { className: cn(btn), onClick: downloadExcel, children: [_jsx(HiOutlineTableCells, { className: "text-2xl" }), _jsx("div", { className: "text-center", children: "\uC5D1\uC140 \uB2E4\uC6B4\uB85C\uB4DC" })] })] }));
+}

package/package.json

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

package/version.txt

@@ -1 +1 @@
-1.0.195
+1.0.197

package/layout/template/Ticket/Layout.d.ts

@@ -1,8 +0,0 @@
-import { TicketProps } from "./Ticket";
-interface TicketLayoutProps extends TicketProps {
-    option?: {
-        noPrint?: boolean;
-    };
-}
-export default function Layout({ exam, name, birthday, level, code, profileImageUrl, option, }: TicketLayoutProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/layout/template/Ticket/Layout.js

@@ -1,54 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useReactToPrint } from "react-to-print";
-import { cn } from "../../../util";
-import { Label } from "../../../widget";
-import Ticket from "./Ticket";
-import { useRef } from "react";
-export default function Layout({ exam, name, birthday, level, code, profileImageUrl, option, }) {
-    const { noPrint } = option ?? {};
-    const container = {
-        displays: "flex justify-center items-center",
-        sizes: "w-full min-h-screen overflow-y-scroll",
-        backgrounds: "bg-gray-light",
-    };
-    const body = {
-        positions: "relative justify-center items-center sm:items-start",
-        displays: "flex sm:flex-row flex-col",
-        sizes: "w-full h-fit",
-        spacings: "gap-x-10 m-5",
-    };
-    const ref = useRef(null);
-    const handlePrint = useReactToPrint({
-        content: () => ref.current,
-    });
-    return (_jsx("div", { className: cn(container), children: _jsxs("div", { className: cn(body), children: [_jsx(Ticket, { ref: ref, props: {
-                        exam,
-                        name,
-                        birthday,
-                        level,
-                        code,
-                        profileImageUrl,
-                    } }), _jsxs("div", { className: "relative w-48 flex flex-row md:flex-col md:h-[700px] gap-4 h-full justify-start mt-5 items-center", children: [!noPrint && (_jsx("div", { className: "md:flex hidden", children: _jsx(Label.Button, { title: "\uC218\uD5D8\uD45C \uCD9C\uB825\uD558\uAE30", onClick: handlePrint, option: {
-                                    width: "md",
-                                    height: "sm",
-                                    background: "bg-white shadow-main",
-                                    text: "text-green-dark font-pretendard-var font-medium",
-                                } }) })), _jsxs("div", { className: "sm:absolute hidden sm:flex flex-col gap-4 left-0 top-36", children: [_jsxs("div", { className: "flex-col font-pretendard-var flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "OMR \uC791\uC131" }), _jsx("div", { className: "text-gray-dark", children: ", \uC5F0\uC2B5\uD558\uC168\uB098\uC694?" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: "\uB9C8\uD0B9\uD39C\uC73C\uB85C \uC791\uC131\uBC95\uC744 \uBBF8\uB9AC \uC5F0\uC2B5\uD574\uBCF4\uC138\uC694!" })] }), _jsx(Label.Button, { title: "OMR \uC778\uC1C4", onClick: () => { }, option: {
-                                        width: "sm",
-                                        height: "xs",
-                                        background: "bg-green-dark",
-                                        text: "text-white font-pretendard-var font-medium",
-                                    } })] }), _jsxs("div", { className: "sm:absolute flex flex-col gap-4 left-0 top-80", children: [_jsxs("div", { className: "flex-col font-pretendard-var hidden sm:flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "\uACE0\uC0AC\uC7A5 \uC704\uCE58" }), _jsx("div", { className: "text-gray-dark", children: "\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: exam.address })] }), _jsx(Label.Button, { title: "\uC9C0\uB3C4\uC5D0\uC11C \uBCF4\uAE30", onClick: () => {
-                                        window.open(`https://map.kakao.com/?map_type=TYPE_MAP&itemId=168362793&q=${exam.address}&urlLevel=3&urlX=507920&urlY=1136302`);
-                                    }, option: {
-                                        width: "sm",
-                                        height: "xs",
-                                        background: "bg-green-dark",
-                                        text: "text-white font-pretendard-var font-medium",
-                                    } })] }), _jsxs("div", { className: "sm:absolute flex flex-col gap-4 left-0 top-128", children: [_jsxs("div", { className: "flex-col font-pretendard-var hidden sm:flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "\uC900\uBE44\uBB3C" }), _jsx("div", { className: "text-gray-dark", children: "\uB3C4 \uD655\uC778\uD574\uC8FC\uC138\uC694" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: "\uB9C8\uD0B9\uD39C\uC73C\uB85C \uC791\uC131\uBC95\uC744 \uBBF8\uB9AC \uC5F0\uC2B5\uD574\uBCF4\uC138\uC694!" })] }), _jsx(Label.Button, { title: "\uC2DC\uD5D8 \uADDC\uC815 \uD655\uC778", onClick: () => { }, option: {
-                                        width: "sm",
-                                        height: "xs",
-                                        background: "bg-green-dark",
-                                        text: "text-white font-pretendard-var font-medium",
-                                    } })] })] })] }) }));
-}

package/layout/template/Ticket/academy/Academy.d.ts

@@ -1,20 +0,0 @@
-import { Level } from "../../../../_test/interface";
-export interface ApplicationStatus {
-    applicationId: number | null;
-    level: Level | null;
-    name: string;
-    birthday: string;
-    code: string | null;
-    examHallName: string | null;
-    examHallRoomName: string | null;
-    startTime: string;
-}
-export interface ApplicationsProps {
-    [userId: number]: ApplicationStatus;
-    examHallId: number;
-}
-export default function Academy({ applicationsData, examDate, examName, }: {
-    applicationsData: ApplicationsProps;
-    examName: string;
-    examDate: string;
-}): import("react/jsx-runtime").JSX.Element;

package/layout/template/Ticket/academy/Academy.js

@@ -1,154 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import moment from "moment-timezone";
-import { LevelString } from "../../../../_test/interface";
-import GroupTicket from "./AcademyTicket";
-import React, { useRef, useState } from "react";
-import { Label, Row, TableCard } from "@edu-tosel/design";
-import { cn } from "../../../../util";
-import { HiOutlinePrinter } from "react-icons/hi2";
-import { HiOutlineTableCells } from "react-icons/hi2";
-import { useReactToPrint } from "react-to-print";
-export default function Academy({ applicationsData, examDate, examName, }) {
-    const container = {
-        displays: "flex items-center justify-center gap-6",
-    };
-    const btn = {
-        displays: "flex items-center justify-center gap-2",
-        rounded: "rounded-lg",
-        backgrounds: "bg-white/50",
-        texts: " text-green-dark font-semibold",
-        shadows: "shadow-main",
-        sizes: "w-1/3 h-full px-2.5",
-        cursors: "cursor-pointer",
-    };
-    const formattedData = Object.values(applicationsData ?? {})
-        .filter((app) => app.applicationId !== null)
-        .slice(0, -1);
-    const [selectedStudent, setSelectedStudent] = useState(formattedData[0]);
-    const handleSelectStudent = (student) => {
-        setSelectedStudent(toRender(student));
-    };
-    const ref = useRef(null);
-    const refALot = useRef(null);
-    const handlePrint = useReactToPrint({
-        content: () => ref.current,
-    });
-    const ticketRefs = useRef(formattedData.map(() => React.createRef()));
-    const printAllTickets = useReactToPrint({
-        content: () => refALot.current,
-        onBeforeGetContent: () => {
-            if (refALot.current) {
-                refALot.current.style.display = "block";
-            }
-            return new Promise((resolve) => {
-                setTimeout(resolve, 1);
-            });
-        },
-        onAfterPrint: () => {
-            if (refALot.current) {
-                refALot.current.style.display = "none";
-            }
-        },
-    });
-    const formatTimeToHHMM = (time) => {
-        return moment(time, ["HH:mm:ss", "HH:mm"]).format("HH:mm");
-    };
-    const calculateEndTime = (startTime, level) => {
-        const formattedStartTime = moment(startTime, "HH:mm:ss");
-        const endTime = level === "HJ"
-            ? formattedStartTime.add(1, "hours").add(20, "minutes").format("HH:mm")
-            : formattedStartTime.add(1, "hours").add(10, "minutes").format("HH:mm");
-        return endTime;
-    };
-    return (_jsx(_Fragment, { children: _jsx("div", { className: "w-full min-h-screen flex items-center justify-center bg-gray-light", children: _jsxs("div", { className: cn(container), children: [_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "w-full h-15 bg-green-dark rounded-lg flex justify-between items-center p-5 text-white text-md shadow-main", children: [_jsx("div", { className: "font-semibold", children: examName }), _jsx("div", { children: "\uACE0\uC0AC\uC7A5 \uC2DC\uD5D8" })] }), _jsx(TableCard, { dataField: dataField, dataSet: {
-                                    items: formattedData ?? [],
-                                    renderItem: (application) => (_jsx(Row.Card, { item: toRender(application), dataField: dataField, onClick: () => handleSelectStudent(application) })),
-                                } }), _jsxs("div", { className: "flex w-full h-12 gap-3", children: [_jsxs("div", { className: cn(btn), onClick: printAllTickets, children: [_jsx(HiOutlinePrinter, { className: "text-2xl" }), _jsx("div", { className: "text-center", children: "\uC804\uCCB4 \uC218\uD5D8\uD45C \uCD9C\uB825" })] }), _jsxs("div", { className: cn(btn), onClick: handlePrint, children: [_jsx(HiOutlinePrinter, { className: "text-2xl" }), _jsx("div", { className: "text-center", children: "\uD604\uC7AC \uD559\uC0DD \uCD9C\uB825" })] }), _jsxs("div", { className: cn(btn), children: [_jsx(HiOutlineTableCells, { className: "text-2xl" }), _jsx("div", { className: "text-center", children: "\uC5D1\uC140 \uB2E4\uC6B4\uB85C\uB4DC" })] })] })] }), _jsx("div", { ref: refALot, style: {
-                            display: "none",
-                        }, children: formattedData.map((student, index) => (_jsx(GroupTicket, { ref: ticketRefs.current[index], props: {
-                                exam: {
-                                    title: examName,
-                                    hall: student.examHallName ?? "",
-                                    room: student.examHallRoomName ?? "",
-                                    date: examDate,
-                                    address: "",
-                                    startedAt: student.startTime,
-                                    endedAt: calculateEndTime(student.startTime, student.level),
-                                },
-                                name: student.name ?? "",
-                                birthday: student.birthday ?? "",
-                                profileImageUrl: "",
-                                level: LevelString[student.level ?? "PS"],
-                                code: student.code ?? "",
-                                isAll: true,
-                            } }, student.applicationId))) }), _jsx(GroupTicket, { ref: ref, props: {
-                            exam: {
-                                title: examName,
-                                hall: selectedStudent?.examHallName ?? "",
-                                room: selectedStudent?.examHallRoomName ?? "",
-                                date: examDate,
-                                address: selectedStudent?.examHallName ?? "",
-                                startedAt: formatTimeToHHMM(selectedStudent?.startTime ?? "13:10") ?? "",
-                                endedAt: calculateEndTime(selectedStudent?.startTime ?? "", selectedStudent?.level),
-                            },
-                            name: selectedStudent?.name ?? "",
-                            birthday: selectedStudent?.birthday ?? "",
-                            profileImageUrl: "",
-                            level: LevelString[selectedStudent?.level ?? "PS"],
-                            code: selectedStudent?.code ?? "",
-                        } }), _jsxs("div", { className: "relative w-48 flex flex-row md:flex-col md:h-[700px] gap-4 h-full justify-start mt-5 items-center", children: [_jsxs("div", { className: "sm:absolute hidden sm:flex flex-col gap-4 left-0 top-36", children: [_jsxs("div", { className: "flex-col font-pretendard-var flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "OMR \uC791\uC131" }), _jsx("div", { className: "text-gray-dark", children: ", \uC5F0\uC2B5\uD558\uC168\uB098\uC694?" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: "\uB9C8\uD0B9\uD39C\uC73C\uB85C \uC791\uC131\uBC95\uC744 \uBBF8\uB9AC \uC5F0\uC2B5\uD574\uBCF4\uC138\uC694!" })] }), _jsx(Label.Button, { title: "OMR \uC778\uC1C4", onClick: () => { }, option: {
-                                            width: "sm",
-                                            height: "xs",
-                                            background: "bg-green-dark",
-                                            text: "text-white font-pretendard-var font-medium",
-                                        } })] }), _jsxs("div", { className: "sm:absolute flex flex-col gap-4 left-0 top-80", children: [_jsxs("div", { className: "flex-col font-pretendard-var hidden sm:flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "\uACE0\uC0AC\uC7A5 \uC704\uCE58" }), _jsx("div", { className: "text-gray-dark", children: "\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: selectedStudent?.examHallName })] }), _jsx(Label.Button, { title: "\uC9C0\uB3C4\uC5D0\uC11C \uBCF4\uAE30", onClick: () => {
-                                            window.open(`https://map.kakao.com/?map_type=TYPE_MAP&itemId=168362793&q=${selectedStudent?.examHallName}&urlLevel=3&urlX=507920&urlY=1136302`);
-                                        }, option: {
-                                            width: "sm",
-                                            height: "xs",
-                                            background: "bg-green-dark",
-                                            text: "text-white font-pretendard-var font-medium",
-                                        } })] }), _jsxs("div", { className: "sm:absolute flex flex-col gap-4 left-0 top-128", children: [_jsxs("div", { className: "flex-col font-pretendard-var hidden sm:flex", children: [_jsxs("div", { className: "flex flex-row font-bold text-base leading-tight", children: [_jsx("div", { className: "text-crimson-burgundy", children: "\uC900\uBE44\uBB3C" }), _jsx("div", { className: "text-gray-dark", children: "\uB3C4 \uD655\uC778\uD574\uC8FC\uC138\uC694" })] }), _jsx("div", { className: "text-gray-dark font-medium text-xs break-keep", children: "\uB9C8\uD0B9\uD39C\uC73C\uB85C \uC791\uC131\uBC95\uC744 \uBBF8\uB9AC \uC5F0\uC2B5\uD574\uBCF4\uC138\uC694!" })] }), _jsx(Label.Button, { title: "\uC2DC\uD5D8 \uADDC\uC815 \uD655\uC778", onClick: () => { }, option: {
-                                            width: "sm",
-                                            height: "xs",
-                                            background: "bg-green-dark",
-                                            text: "text-white font-pretendard-var font-medium",
-                                        } })] })] })] }) }) }));
-}
-function toRender(obj) {
-    return {
-        ...obj,
-        levelString: LevelString[obj.level ?? "PS"],
-        formattedBirthday: formatDateToYYMMDD(obj.birthday),
-    };
-}
-function formatDateToYYMMDD(dateString) {
-    if (!dateString) {
-        console.error("Invalid date string provided");
-        return "";
-    }
-    const [year, month, day] = dateString.split("-");
-    return year.slice(2) + month + day;
-}
-const dataField = {
-    name: {
-        title: "이름",
-        size: 20,
-    },
-    formattedBirthday: {
-        title: "생년월일",
-        size: 25,
-    },
-    levelString: {
-        title: "레벨",
-        size: 30,
-    },
-    code: {
-        title: "수험번호",
-        size: 30,
-    },
-    examHallRoomName: {
-        title: "고사실",
-        size: 20,
-    },
-};

package/layout/template/Ticket/academy/AcademyTicket.d.ts

@@ -1,21 +0,0 @@
-interface TicketProps {
-    exam: {
-        title: string;
-        hall: string;
-        room: string;
-        date: string;
-        address: string;
-        startedAt: string;
-        endedAt: string;
-    };
-    name: string;
-    profileImageUrl?: string;
-    birthday: string;
-    level: string;
-    code: string;
-    isAll?: boolean;
-}
-declare const _default: import("react").ForwardRefExoticComponent<{
-    props: TicketProps;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default _default;

package/layout/template/Ticket/academy/AcademyTicket.js

@@ -1,56 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { cn } from "../../../../util";
-function AcademyTicket({ props }, ref) {
-    const { title, date, hall, room, startedAt, endedAt } = props.exam;
-    const { isAll } = props;
-    const isAllSize = isAll ? "w-[210mm] h-[297mm] p-10" : "";
-    //수험번호 섹션 디자인을 위한 배열
-    const numberArray = props.code.split("").map(Number);
-    numberArray.splice(3, 0, null);
-    numberArray.splice(7, 0, null);
-    const container = {
-        sizes: "w-full max-w-[340px] xs:w-[340px] h-[700px] flex flex-col justify-start",
-        spacings: "p-5 print:m-10",
-        boundaries: "border-1 border-gray-medium shadow-main",
-        backgrounds: "bg-white",
-    };
-    const logoWrapper = {
-        displays: "flex flex-row justify-between w-full mb-3",
-    };
-    const svgController = {
-        sizes: "h-8",
-    };
-    const titleDivider = {
-        sizes: "w-full h-0.5",
-        backgrounds: "bg-gradient-to-r from-crimson-burgundy to-green-dark",
-    };
-    const cellWrapper = {
-        displays: "flex flex-row",
-        sizes: "w-full",
-        boundaries: "border-1 border-gray-medium",
-    };
-    const cellTitleLarge = {
-        displays: "flex justify-center items-center shrink-0",
-        sizes: "w-21 h-6",
-        textstyles: "text-2xs font-medium",
-        backgrounds: "bg-gray-light",
-    };
-    const cellTitleSmall = {
-        displays: "flex justify-center items-center shrink-0",
-        sizes: "w-16 h-6",
-        textstyles: "text-2xs font-medium",
-        backgrounds: "bg-gray-light",
-    };
-    const cellText = {
-        sizes: "w-full",
-        displays: "flex justify-center items-center",
-        textstyles: "text-2xs font-medium text-black",
-    };
-    return (_jsx("div", { ref: ref, className: isAllSize, children: _jsxs("div", { className: cn(container), children: [_jsxs("div", { className: cn(logoWrapper), children: [_jsx("img", { className: cn(svgController), src: "/images/logos/logo-itc-main.svg", alt: "" }), _jsx("img", { className: cn(svgController), src: "/images/logos/logo-tosel-main.svg", alt: "" })] }), _jsxs("div", { className: "flex flex-col w-full gap-2.5", children: [_jsx("div", { className: cn(titleDivider) }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-lg font-bold leading-none", children: "\uC218 \uD5D8 \uD45C" }), _jsx("div", { className: "text-sm font-medium leading-none", children: title })] }), _jsx("div", { className: cn(titleDivider) })] }), _jsxs("div", { className: "flex flex-col gap-5 mt-5", children: [_jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge), children: "\uC218\uD5D8\uBC88\uD638" }), _jsx("div", { className: "w-full flex flex-row divide-x-[1px] divide-dashed divide-gray-medium/50", children: numberArray.map((num, index) => (_jsx("div", { className: `flex justify-center items-center text-xs font-medium ${num === null
-                                                    ? "w-2.5 shrink-0 bg-gray-light"
-                                                    : "w-full bg-white"}`, children: num !== null ? num : "" }, index))) })] }), _jsxs("div", { className: "font-medium text-2xs", children: ["*OMR (1)\uBC88 \uD56D\uBAA9\uC5D0 \uD574\uB2F9\uBC88\uD638\uB97C \uB530\uB77C\uC11C \uC368\uC8FC\uC138\uC694.", " "] })] }), _jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge), children: "\uB808\uBCA8" }), _jsx("div", { className: cn(cellText), children: props.level })] }), _jsxs("div", { className: "flex flex-row gap-2", children: [_jsxs("div", { className: "flex flex-col gap-0 h-full w-21 border-1 border-gray-medium shrink-0", children: [_jsx("div", { className: "h-full w-full bg-cover", style: {
-                                                backgroundImage: `url(${props.profileImageUrl ?? ""})`,
-                                            } }), _jsx("div", { className: cn(cellTitleLarge, "w-full"), children: "\uC0AC\uC9C4" })] }), _jsxs("div", { className: "flex flex-col gap-2 w-full", children: [_jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uC774\uB984" }), _jsx("div", { className: cn(cellText), children: props.name })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uC0DD\uB144\uC6D4\uC77C" }), _jsx("div", { className: cn(cellText), children: props.birthday })] })] }), _jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uACE0\uC0AC\uC7A5" }), _jsx("div", { className: cn(cellText), children: hall })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleSmall), children: "\uACE0\uC0AC\uC2E4" }), _jsx("div", { className: cn(cellText), children: room })] })] })] })] }), _jsxs("div", { className: "flex flex-col gap-0", children: [_jsxs("div", { className: cn(cellWrapper), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC2DC\uD5D8\uC77C\uC790" }), _jsx("div", { className: cn(cellText), children: props.exam.date })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC785\uC2E4 \uC644\uB8CC\uC2DC\uAC04" }), _jsx("div", { className: cn(cellText), children: props.exam.startedAt })] }), _jsxs("div", { className: cn(cellWrapper, "border-t-0"), children: [_jsx("div", { className: cn(cellTitleLarge, "bg-green-dark/10"), children: "\uC885\uB8CC\uC2DC\uAC04" }), _jsx("div", { className: cn(cellText), children: props.exam.endedAt })] }), _jsxs("div", { className: "flex flex-col mt-1", children: [_jsx("div", { className: "font-medium text-2xs leading-tight", children: "*\uC785\uC2E4\uC2DC\uAC04 \uC774\uD6C4\uC5D0\uB294 \uC785\uC2E4\uC774 \uC81C\uD55C\uB429\uB2C8\uB2E4." }), _jsx("div", { className: "font-medium text-2xs leading-tight", children: "*\uACE0\uC0AC\uC7A5 \uC5EC\uAC74\uC5D0 \uB530\uB77C \uD1F4\uC2E4\uC2DC\uAC04\uC740 \uC870\uAE08\uC529 \uC0C1\uC774\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4." })] })] }), _jsx("div", { className: "w-full border-b-1 border-dashed border-gray-medium" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "font-bold text-sm leading-tight", children: "\uC751\uC2DC\uC790 \uC720\uC758\uC0AC\uD56D" }), _jsxs("ul", { className: "list-outside list-decimal ml-4 font-medium text-2xs", children: [_jsxs("li", { className: "mb-1", children: ["\uB2E4\uC74C\uC758 \uBB3C\uD488\uC744 \uAF2D \uC900\uBE44\uD574\uC8FC\uC138\uC694:", _jsx("br", {}), " \uCEF4\uD4E8\uD130\uC6A9 \uC0AC\uC778\uD39C / \uC218\uC815 \uD14C\uC774\uD504 / \uC218\uD5D8\uD45C / \uAC80\uC815 \uBCFC\uD39C"] }), _jsxs("li", { className: "mb-1", children: ["\uACE0\uC0AC\uC7A5 \uC704\uCE58\uB97C \uBBF8\uB9AC \uD655\uC778\uD574\uC8FC\uC138\uC694:", _jsx("br", {}), " \uC218\uD5D8\uD45C\uC5D0 \uAE30\uC7AC\uB41C \uACE0\uC0AC\uC7A5, \uACE0\uC0AC\uC2E4 \uC815\uBCF4\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694."] }), _jsxs("li", { children: ["\uD559\uBD80\uBAA8 \uCD9C\uC785 \uD1B5\uC81C:", _jsx("br", {}), "\uACE0\uC0AC\uC2E4 \uB0B4\uBD80\uC5D0\uB294 \uD559\uBD80\uBAA8\uC758 \uCD9C\uC785\uC774 \uC5C4\uACA9\uD788 \uD1B5\uC81C\uB429\uB2C8\uB2E4."] })] })] })] })] }) }));
-}
-export default forwardRef(AcademyTicket);