@edu-tosel/design 1.0.34 → 1.0.36

package/package.json

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

package/store/index.d.ts

@@ -14,8 +14,10 @@ interface WidgetProps {
     clearTempData: () => void;
     flag: boolean;
     setFlag: () => void;
-    isOwn: boolean;
-    setIsOwn: (prop: boolean) => void;
+    isOwn: boolean | string;
+    setIsOwn: (prop: boolean | string) => void;
+    isOwnId: string;
+    setIsOwnId: (prop: string) => void;
     isDark: boolean;
     setDark: () => void;
 }

package/store/index.js

@@ -62,6 +62,8 @@ export const useWidgetStore = create((set) => ({
     setFlag: () => set((state) => ({ flag: !state.flag })),
     isOwn: false,
     setIsOwn: (prop) => set({ isOwn: prop }),
+    isOwnId: "",
+    setIsOwnId: (prop) => set({ isOwnId: prop }),
     isDark: false,
     setDark: () => set((state) => ({ isDark: !state.isDark })),
 }));

package/tailwind.config.ts

@@ -56,6 +56,7 @@ export default {
         "red-crimson": "#760023",
         "red-velvet": "#AC647A",
         "green-dark": "#105652",
+        "green-light": "#DFE6E5",
         "blue-sky": "#44C5F3",
         "blue-navy": "#173A8B",
         "blue-pastel": "#CED6E6",
@@ -119,6 +120,7 @@ export default {
         14.125: "3.53125rem",
         14.5: "3.625rem",
         15: "3.75rem",
+        15.5: "3.875rem",
         16: "4rem",
         18: "4.5rem",
         18.5: "4.625rem",
@@ -138,6 +140,7 @@ export default {
         25: "6.25rem",
         26: "6.5rem",
         27: "6.75rem",
+        27.5: "6.875rem",
         28.78: "7.195rem",
         29: "7.25rem",
         30: "7.5rem",
@@ -146,6 +149,7 @@ export default {
         36.5: "9.125rem",
         36.75: "9.1875rem",
         38: "9.5rem",
+        39.5: "9.875rem",
         40: "10rem",
         41: "10.25rem",
         42: "10.5rem",
@@ -191,6 +195,7 @@ export default {
         122: "30.5rem",
         124: "31rem",
         125: "31.25rem",
+        125.5: "31.375rem",
         126: "31.5rem",
         127.5: "31.875rem",
         128: "32rem",

package/util/sortByOrder.d.ts

@@ -1,4 +1,5 @@
 import { Order } from "../interface";
-export default function sortOrder<K extends string, T extends {
-    [p in K]: any;
-}>(args: T[], order: Order[]): T[];
+export default function sortOrder<T>({ items, orders, }: {
+    items?: T[];
+    orders: Order[];
+}): T[];

package/util/sortByOrder.js

@@ -1,10 +1,10 @@
-export default function sortOrder(args, order) {
-    const allEmpty = order.every(({ orderHow }) => orderHow === "");
+export default function sortOrder({ items, orders, }) {
+    const allEmpty = orders.every(({ orderHow }) => orderHow === "");
     const sortedData = allEmpty
-        ? [...args]
-        : [...args].sort((aValue, bValue) => {
-            for (let i = 0; i < order.length; i++) {
-                const { orderBy, orderHow } = order[i];
+        ? [...items]
+        : [...items].sort((aValue, bValue) => {
+            for (let i = 0; i < orders.length; i++) {
+                const { orderBy, orderHow } = orders[i];
                 if (orderHow === "")
                     continue;
                 const a = aValue[orderBy];

package/version.txt

@@ -1 +1 @@
-1.0.34
+1.0.36

package/card/template/InfoCard.d.ts

@@ -1,20 +0,0 @@
-import { InfoCardPersonalInformationProps, InfoCardExamProps, InfoCardGradeProps, InfoCardItemProps, InfoCardProductProps, InfoCardExamDataREGProps, InfoCardExamDataOLYProps } from "../../interface";
-declare function PersonalInformation({ titles, data, }: InfoCardPersonalInformationProps): import("react/jsx-runtime").JSX.Element;
-declare function Exam({ titles, data }: InfoCardExamProps): import("react/jsx-runtime").JSX.Element;
-declare function ExamDataREG({ titles, data }: InfoCardExamDataREGProps): import("react/jsx-runtime").JSX.Element;
-declare function ExamDataOLY({ titles, data }: InfoCardExamDataOLYProps): import("react/jsx-runtime").JSX.Element;
-declare function Product({ titles, data }: InfoCardProductProps): import("react/jsx-runtime").JSX.Element;
-declare function Item({ titles, data }: InfoCardItemProps): import("react/jsx-runtime").JSX.Element;
-declare function Grade({ titles, data }: InfoCardGradeProps): import("react/jsx-runtime").JSX.Element;
-declare const InfoCard: {
-    PersonalInformation: typeof PersonalInformation;
-    Exam: typeof Exam;
-    ExamData: {
-        REG: typeof ExamDataREG;
-        OLY: typeof ExamDataOLY;
-    };
-    Product: typeof Product;
-    Item: typeof Item;
-    Grade: typeof Grade;
-};
-export default InfoCard;

package/card/template/InfoCard.js

@@ -1,155 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { InfoCardDesign } from "../widget/InfoCard.design";
-import { Events, Label, NoData } from "../..";
-import { cn, gradient } from "../../util";
-const label = {
-    positions: "absolute bottom-5 right-5",
-};
-function PersonalInformation({ titles, data, }) {
-    const body = {
-        container: "flex flex-col pt-5.75",
-        belong: "text-crimson-burgundy",
-        username: "text-gray-dim font-pretendard-bold",
-        name: "text-xl font-pretendard-bold text-crimson-burgundy",
-        subInfo: {
-            displays: "flex flex-col mt-7.5",
-            fonts: "text-xs text-gray-dim",
-        },
-    };
-    return (_jsx(InfoCardDesign, { titles: titles, options: {
-            titleBorder: "border-crimson-burgundy",
-            width: "md",
-            height: "md",
-            background: gradient.bg.greenToRedSoft,
-            boundary: "border-3 border-crimson-burgundy/30",
-        }, children: _jsxs(_Fragment, { children: [_jsxs("div", { className: cn(body.container), children: [_jsxs("div", { className: cn(body.belong), children: [data.school, "/", data.academy] }), _jsx("div", { className: cn(body.username), children: data.username }), _jsx("div", { className: cn(body.name), children: data.name }), _jsxs("div", { className: cn(body.subInfo), children: [_jsx("div", { children: data.email }), _jsx("div", { children: data.phone })] })] }), _jsx(Label.Button, { title: "\uD559\uC6D0 \uB4F1\uB85D\uD558\uAE30", onClick: () => { }, options: {
-                        width: "md",
-                        background: "bg-crimson-burgundy",
-                        text: "text-white",
-                        className: cn(label),
-                    } })] }) }));
-}
-function Exam({ titles, data }) {
-    const { status, isPublic, manager, examDate, endDate } = data;
-    const container = {
-        positions: "relative",
-        displays: "flex flex-col justify-between mt-2.5",
-        sizes: "h-19.25 w-full",
-    };
-    return (_jsx(InfoCardDesign, { titles: titles, options: {
-            titleBorder: "border-red-crimson",
-            width: "sm",
-            height: "xs",
-        }, children: _jsxs(_Fragment, { children: [_jsxs("div", { className: cn(container), children: [_jsxs("div", { className: "flex gap-4 font-pretendard-bold ", children: [manager, " / ", isPublic ? "공개시험" : "비공개시험"] }), _jsxs("div", { children: [_jsxs("div", { className: "text-xs", children: ["\uC811\uC218\uB9C8\uAC10: ", endDate] }), _jsxs("div", { className: "text-xs", children: ["\uC2DC\uD5D8\uC77C: ", examDate] })] })] }), _jsx(Label.Button, { title: status, onClick: () => { }, options: { width: "sm", height: "xs", className: cn(label) } })] }) }));
-}
-function ExamDataREG({ titles, data }) {
-    const container = {
-        positions: "relative",
-        displays: "flex flex-col gap-5",
-        sizes: "h-36.75 w-50 pt-5",
-    };
-    const dataBox = {
-        container: "flex justify-between",
-        rightBox: "flex items-end",
-        score: "text-4xl font-pretendard-bold leading-none",
-    };
-    const arr = [
-        ["part 1", data && data?.scores[0], "text-crimson-burgundy"],
-        ["part 2", data && data?.scores[1], "text-crimson-burgundy"],
-        [
-            "total",
-            data && data?.scores[0] + data?.scores[1],
-            "text-gray-dim border-t border-dashed border-gray-dim pt-1",
-        ],
-    ];
-    return (_jsx(InfoCardDesign, { titles: titles, options: {
-            width: "xs",
-            height: "md",
-            titleBorder: "border-crimson-burgundy",
-        }, children: _jsx(Events.Replace, { widgets: [
-                [
-                    !data,
-                    _jsx(NoData.Sign, { script: "\uC774\uC804 \uAE30\uB85D\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.", color: "#910023", className: "text-[#910023] mt-12" }),
-                ],
-            ], children: _jsx("div", { className: cn(container), children: arr.map(([part, score, styles]) => (_jsxs("div", { className: cn(dataBox.container, styles), children: [_jsx("div", { children: part }), _jsxs("div", { className: cn(dataBox.rightBox), children: [_jsx("div", { className: "text-4xl font-pretendard-bold leading-none", children: score }), _jsx("div", { children: "\uC810" })] })] }))) }) }) }));
-}
-function ExamDataOLY({ titles, data }) {
-    const container = {
-        displays: "flex justify-center",
-        sizes: "w-full",
-        margins: "mt-11.375",
-    };
-    const body = {
-        displays: "flex flex-col justify-between items-center",
-        sizes: "h-20",
-    };
-    return (_jsx(InfoCardDesign, { titles: titles, options: { width: "xs", height: "md", titleBorder: "border-green-dark" }, children: _jsx(Events.Replace, { widgets: [
-                [
-                    !data,
-                    _jsx(NoData.Sign, { script: "\uC774\uC804 \uAE30\uB85D\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.", color: "#105652", className: "text-[#105652] mt-12" }),
-                ],
-            ], children: _jsx("div", { className: cn(container), children: _jsxs("div", { className: cn(body), children: [_jsxs("div", { className: "flex items-end text-green-dark", children: [_jsx("div", { className: "text-4xl font-pretendard-bold leading-none ", children: data?.score }), _jsx("div", { children: "\uC810" })] }), _jsxs("div", { className: "text-gray-dim", children: [data?.prize, "\uC744 \uC218\uC0C1\uD558\uC600\uC2B5\uB2C8\uB2E4."] })] }) }) }) }));
-}
-function Product({ titles, data }) {
-    const { date, status, receiver, requester } = data;
-    const container = {
-        positions: "relative",
-        displays: "flex flex-col mt-2.5",
-        sizes: "h-19.25 w-full",
-    };
-    return (_jsx(InfoCardDesign, { titles: titles, options: {
-            titleBorder: "border-jr-blue",
-            width: "sm",
-            height: "xs",
-        }, children: _jsxs(_Fragment, { children: [_jsxs("div", { className: cn(container), children: [_jsxs("div", { className: "text-sm", children: ["\uC77C\uC2DC: ", date] }), _jsxs("div", { className: "text-sm", children: ["\uC694\uCCAD\uC790: ", requester ?? "No Data"] }), _jsxs("div", { className: "text-sm", children: ["\uC218\uC2E0\uC790: ", receiver ?? "No Data"] })] }), _jsx(Label.Button, { title: status ?? "", onClick: () => console.log("click"), options: {
-                        width: "sm",
-                        height: "xs",
-                        className: cn(label),
-                        background: "bg-gray-light hover:bg-blue-sky",
-                        text: "hover:text-white",
-                    } })] }) }));
-}
-function Item({ titles, data }) {
-    const { item } = data;
-    return (_jsx(InfoCardDesign, { titles: titles, options: {
-            titleBorder: "border-blue-navy",
-            width: "xs",
-            height: "xs",
-        }, children: _jsx("div", { children: item }) }));
-}
-function Grade({ titles, data }) {
-    const container = {
-        positions: "relative",
-        displays: "flex flex-col justify-between mt-2.5",
-        sizes: "h-19.5 w-full",
-    };
-    const levelBox = {
-        displays: "flex justify-center items-center ",
-        sizes: "w-22.5 h-6.4",
-        styles: "bg-white-off text-sm rounded-md",
-        text: data.levelColor,
-    };
-    return (_jsx(InfoCardDesign, { titles: titles, options: {
-            titleBorder: "border-blue-navy",
-            width: "sm",
-            height: "xs",
-        }, children: _jsxs(_Fragment, { children: [_jsxs("div", { className: cn(container), children: [_jsxs("div", { className: "flex items-center gap-5", children: [_jsx("div", { className: cn(levelBox), children: data.levelString }), _jsx("span", { className: "text-sm", children: "\uD559\uC6D0\uC0DD, 23\uC138" })] }), _jsxs("div", { className: "absolute bottom-0 left-0 flex items-end gap-8 text-blue-navy", children: [_jsxs("div", { className: "w-20 h-12 flex justify-end items-end", children: [_jsx("div", { className: "leading-none text-4xl font-pretendard-bold", children: data.score }), _jsx("div", { children: "\uC810" })] }), _jsxs("div", { className: "w-14 h-12 flex justify-end items-end", children: [_jsx("div", { className: "leading-none text-4xl font-pretendard-bold", children: data.grade }), _jsx("div", { children: "\uB4F1\uAE09" })] })] })] }), _jsx(Label.Button, { title: "\uC0C1\uC138\uBCF4\uAE30", onClick: () => { }, options: {
-                        width: "sm",
-                        height: "xs",
-                        text: "text-white hover:text-blue-navy",
-                        background: "bg-blue-navy hover:bg-gray-light",
-                        className: cn(label),
-                    } }), _jsx("div", { className: "absolute right-5 top-5 w-22.5 h-22.5", children: _jsx("div", { className: "relative h-full w-full rounded-md overflow-hidden", children: _jsx("img", { className: "bg-cover rounded-md ", src: data.profileImage }) }) })] }) }));
-}
-const InfoCard = {
-    PersonalInformation,
-    Exam,
-    ExamData: {
-        REG: ExamDataREG,
-        OLY: ExamDataOLY,
-    },
-    Product,
-    Item,
-    Grade,
-};
-export default InfoCard;

package/card/widget/InfoCard.design.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from "../../util";
-import Card from "./Card.design";
-export function InfoCardDesign({ titles: { title, subtitle }, debug, options, children, }) {
-    const { titleBorder, text } = options ?? {};
-    const container = {
-        paddings: "pt-5 px-5",
-    };
-    const topBox = {
-        container: {
-            displays: "flex justify-between",
-            sizes: "w-full h-13.25",
-            styles: `${titleBorder} border-b-2 pb-2.5`,
-        },
-        titleText: "h-6 font-pretendard-bold text-xl w-52 truncate",
-        subtitleText: "h-7 text-base font-extralight flex items-center",
-        right: {
-            fontColor: `${text ?? "text-black"}`,
-            displays: "flex flex-col-reverse",
-        },
-    };
-    return (_jsxs(Card, { options: { ...options, classNames: cn(container) }, debug: debug, children: [_jsx("div", { className: cn(topBox.container), children: _jsxs("div", { className: "text-gray-dim ", children: [_jsx("div", { className: cn(topBox.titleText), children: title }), _jsx("div", { className: cn(topBox.subtitleText), children: subtitle ?? "" })] }) }), children] }));
-}

package/card/widget/TableCard.design.d.ts

@@ -1,4 +0,0 @@
-import { TableCardProps } from "../../interface";
-export default function TableCardDesign<K extends string, T extends {
-    [p in K]: any;
-}>({ dataSet, dataField, options }: TableCardProps<T>): import("react/jsx-runtime").JSX.Element;

package/layout/widget/Row.design.d.ts

@@ -1,2 +0,0 @@
-import { RowProps } from "../../interface";
-export default function RowDesign<T extends Record<string, any>>({ item, dataField, options, onClick, buttons, }: RowProps<T>): import("react/jsx-runtime").JSX.Element;