@edu-tosel/design 1.0.13 → 1.0.15

package/{board → layout}/widget/Tab.js

@@ -4,16 +4,14 @@ import { cn } from "../../util";
 export default function Tab({ tabs }) {
     const [tabsSelection, setTabsSelection] = useState(tabs.map((_, i) => i === 0));
     const container = {
-        positions: "xl:absolute xl:-bottom-14 xl:left-0 z-5",
-        displays: "hidden xl:flex xl:items-end xl:gap-4",
-        sizes: "xl:h-16",
-        paddings: "xl:px-8 xl:pb-2 ",
-        styles: "bg-white/50 rounded-b-xl ",
+        positions: "xl:absolute xl:-bottom-18 xl:left-0 z-5",
+        displays: "hidden xl:flex xl:items-center xl:gap-2.5",
+        sizes: "xl:h-14.5",
+        paddings: "px-2.5",
+        styles: "bg-white/30 rounded-xl ",
     };
     return (_jsx("div", { className: cn(container), children: tabs.map(([title, onClick], index) => (_jsx("button", { onClick: () => {
                 setTabsSelection(tabsSelection.map((_, i) => i === index));
                 return onClick();
-            }, className: `h-9 w-32 rounded-md ${tabsSelection[index]
-                ? "border-4 border-blue-500"
-                : "border-4 border-red-500"}`, children: title }, title))) }));
+            }, className: `text-green-dark duration-500 h-9 w-32 rounded-md ${tabsSelection[index] && "bg-white rounded-2xl"}`, children: title }, title))) }));
 }

package/modal/index.d.ts

@@ -1,3 +1 @@
-export { default as TestModal } from "./TestModal";
-export { default as AlertModal } from "./AlertModal";
-export { default as ControllerModal } from "./ControllerModal";
+export { default as Modal } from "./template";

package/modal/index.js

@@ -1,3 +1 @@
-export { default as TestModal } from "./TestModal";
-export { default as AlertModal } from "./AlertModal";
-export { default as ControllerModal } from "./ControllerModal";
+export { default as Modal } from "./template";

package/modal/template/Alert.d.ts

@@ -0,0 +1,2 @@
+import { AlertModalProps } from "../../interface/Modal";
+export default function Alert({ isVisible, title, scripts, options, }: AlertModalProps): import("react/jsx-runtime").JSX.Element;

package/modal/template/Alert.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { col } from "../../util";
+import ModalDesign from "../widget/Modal.design";
+export default function Alert({ isVisible, title, scripts, options, }) {
+    const { script, subScript } = scripts ?? {};
+    const { buttons } = options ?? {};
+    return (_jsx(ModalDesign, { isVisible: isVisible, classNames: "pt-18 px-25", options: { buttons, isCloseButton: true }, children: _jsx("div", { className: col(3), children: _jsxs("div", { className: col(6), children: [_jsx("div", { className: "text-3xl font-bold", children: title }), _jsx("div", { className: "h-2 w-14 rounded-full bg-pale-lavender" }), _jsx("div", { className: "text-xl font-bold", children: script })] }) }) }));
+}

package/modal/template/Input.d.ts

@@ -0,0 +1,6 @@
+import { State } from "../../interface";
+import { ModalProps } from "../../interface/Modal";
+export default function Input<T>({ isVisible, title, options, state, }: Omit<ModalProps, "children"> & {
+    title?: string;
+    state: State<T>;
+}): import("react/jsx-runtime").JSX.Element;

package/modal/template/Input.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import ModalDesign from "../widget/Modal.design";
+export default function Input({ isVisible, title, options, state, }) {
+    const { buttons } = options ?? {};
+    return (_jsxs(ModalDesign, { isVisible: isVisible, classNames: "pt-18 px-25", options: { buttons, isCloseButton: true }, children: [_jsx("div", { className: "text-xl font-bold", children: title }), _jsx("input", { className: "border-2 border-black w-80 h-8", value: state[0], onChange: (e) => state[1](e.target.value) })] }));
+}

package/modal/template/index.d.ts

@@ -0,0 +1,7 @@
+import Alert from "./Alert";
+import Input from "./Input";
+declare const Modal: {
+    Alert: typeof Alert;
+    Input: typeof Input;
+};
+export default Modal;

package/modal/template/index.js

@@ -0,0 +1,7 @@
+import Alert from "./Alert";
+import Input from "./Input";
+const Modal = {
+    Alert,
+    Input,
+};
+export default Modal;

package/modal/widget/Modal.design.d.ts

@@ -0,0 +1,2 @@
+import { ModalProps } from "../../interface/Modal";
+export default function ModalDesign({ isVisible, children, options, debug, }: ModalProps): import("react").ReactPortal;

package/modal/widget/Modal.design.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import ReactDOM from "react-dom";
+import { useTransition, animated } from "react-spring";
+import { useWidgetStore } from "../../store";
+import { cn } from "../../util";
+import isDebug from "../../util/isDebug";
+const widthSize = {
+    xs: "w-2/3 min-w-76 max-w-176",
+    sm: "w-2/3 min-w-76 max-w-176",
+    md: "w-2/3 min-w-76 max-w-176",
+    lg: "w-full min-w-76 max-w-360",
+    xl: "w-2/3 min-w-76 max-w-360",
+    "2xl": "w-2/3 min-w-76 max-w-360",
+    full: "w-full",
+};
+const heightSize = {
+    xs: "",
+    sm: "h-100",
+    md: "h-72 sm:h-48",
+    lg: "h-120",
+    xl: "h-180",
+    "2xl": "w-2/3 min-w-76 max-w-176",
+    full: "h-full",
+};
+export default function ModalDesign({ isVisible, children, options, debug, }) {
+    const { buttons, width, height, closeButtonColor, isCloseButton } = options ?? {};
+    const { clearModal } = useWidgetStore();
+    const background = {
+        positions: "z-50 fixed top-0 left-0",
+        displays: "flex items-center justify-center ",
+        sizes: "min-h-screen w-full ",
+        styles: "bg-black/10 backdrop-blur-sm ",
+    };
+    const container = {
+        paddings: "pl-25 pt-18 pb-12",
+        sizes: `${heightSize[height ?? "sm"]} ${widthSize[width ?? "md"]}`,
+        styles: "rounded-xl bg-white relative overflow-hidden",
+        debug: debug && isDebug(`border-2 border-${debug}`),
+    };
+    const button = {
+        container: {
+            positions: "absolute bottom-8 right-10",
+            displays: "flex justify-end gap-4",
+        },
+        body: {
+            paddings: "px-8 py-2 ",
+            styles: "rounded-2xl bg-black text-2xl font-bold text-white",
+        },
+    };
+    const closeButton = {
+        positions: "absolute top-5 left-7",
+        displays: "flex justify-center items-center",
+        sizes: "h-9 w-9",
+        background: closeButtonColor ?? "bg-black",
+        styles: "rounded-full",
+    };
+    const transitions = useTransition(isVisible, {
+        from: { opacity: 0 },
+        enter: { opacity: 1 },
+        leave: { opacity: 0 },
+        config: { duration: 200 },
+    });
+    return ReactDOM.createPortal(transitions((styles, item) => item && (_jsx(animated.div, { style: styles, className: cn(background), children: _jsxs("div", { className: cn(container), children: [children, buttons ? (_jsx("div", { className: cn(button.container), children: buttons.map(([text, onClick]) => (_jsx("button", { className: cn(button.body), onClick: onClick, children: text }, text))) })) : null, isCloseButton && (_jsx("button", { className: cn(closeButton), onClick: clearModal, children: _jsx("div", { className: "x-shape" }) }))] }) }))), document.body);
+}

package/navigation/Navigation.d.ts

@@ -1,4 +1,4 @@
-export declare const buttonClassNames: (href: string, nowPath: string, color?: [string, string]) => string;
+export declare const buttonClassNames: (href: string, nowPath: string, color?: [string, [string, string]]) => string;
 export declare function NavigationContainer({ children, }: {
     children: React.ReactNode;
 }): import("react/jsx-runtime").JSX.Element;

package/navigation/Navigation.js

@@ -1,24 +1,28 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { center, cn } from "../util";
+import { cn } from "../util";
+import { useWidgetStore } from "../store";
+import checkPathMatch from "../util/checkPathMatch";
 export const buttonClassNames = (href, nowPath, color) => {
-    const [bg, text] = color ?? ["white", "black"];
-    const classNames = [
-        center.row(6),
-        `text-${text}`,
-        "font-bold w-full xl:w-50 h-11 xl:rounded-2xl flex justify-center xl:justify-start xl:pl-5",
-    ].join(" ");
-    const checkPathMatch = (href, nowPath) => {
-        return href.split("/").pop() === nowPath.split("/").pop();
+    const { isDark } = useWidgetStore();
+    const [bg, [text, selectedText]] = color ?? ["white", ["white", "black"]];
+    const container = {
+        displays: "flex flex-row items-center justify-center xl:justify-start gap-2.5",
+        sizes: " w-full xl:w-51 h-11 ",
+        styles: "xl:rounded-2xl xl:pl-5 font-bold ",
     };
     const toggle = checkPathMatch(href, nowPath)
-        ? `bg-${bg}`
-        : "bg-gray-500 xl:bg-transparent";
-    return [classNames, toggle].join(" ");
+        ? !isDark
+            ? `bg-${bg} text-${selectedText}`
+            : "bg-white text-black"
+        : (!isDark ? "bg-white " : "bg-black ") +
+            `xl:bg-transparent xl:hover:bg-white/50 hover:text-green-dark text-${text} dark:text-white`;
+    return [cn(container), toggle].join(" ");
 };
 export function NavigationContainer({ children, }) {
-    const displays = "flex flex-row xl:flex-col z-40";
-    const positions = "fixed bottom-0 left-0 xl:static";
-    const sizes = "w-full xl:w-auto";
-    const styles = "";
-    return (_jsx("div", { className: cn(displays, positions, sizes, styles), children: children }));
+    const container = {
+        positions: "fixed xl:static bottom-0 left-0 z-40",
+        displays: "flex flex-row xl:flex-col",
+        sizes: "w-full xl:w-auto",
+    };
+    return _jsx("div", { className: cn(container), children: children });
 }

package/overlay/index.d.ts

@@ -0,0 +1 @@
+export { default as Overlay } from "./template";

package/overlay/index.js

@@ -0,0 +1 @@
+export { default as Overlay } from "./template";

package/overlay/template/Info.d.ts

@@ -0,0 +1,2 @@
+import { InfoOverlayProps } from "../../interface/Overlay";
+export default function Info({ event, isVisible, }: Omit<InfoOverlayProps, "titles">): import("react/jsx-runtime").JSX.Element;

package/overlay/template/Info.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import OverlayDesign from "../widget/Overlay.design";
+export default function Info({ event, isVisible, }) {
+    return (_jsx(OverlayDesign, { titles: { title: "유저 관리" }, event: event, isVisible: isVisible, children: _jsx("div", { children: "TEST" }) }));
+}

package/overlay/template/Manage.d.ts

@@ -0,0 +1,2 @@
+import { ManageOverlayProps } from "../../interface";
+export default function Manage({ titles, isVisible, event, elements, }: ManageOverlayProps): import("react/jsx-runtime").JSX.Element;

package/overlay/template/Manage.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Select, Toggle } from "../..";
+import OverlayDesign from "../widget/Overlay.design";
+import { useId } from "react";
+export default function Manage({ titles, isVisible, event, elements, }) {
+    const id = useId();
+    return (_jsx(OverlayDesign, { titles: titles, event: event, isVisible: isVisible, children: elements?.map(({ title, type, labels, state, isDisabled, selectOptions }) => {
+            if (type === "select")
+                return (_jsx(Frame, { title: title, children: _jsx(Select, { state: state, selectOptions: selectOptions }) }, id + title));
+            if (type === "toggle")
+                return (_jsx(Frame, { title: title, children: _jsx(Toggle, { state: state, labels: labels, isDisabled: isDisabled }) }, id + title));
+            return null;
+        }) }));
+}
+function Frame({ title, children, }) {
+    return (_jsxs("div", { className: "flex items-center gap-3.75", children: [_jsx("div", { className: "w-20 text-sm font-bold text-gray-dim", children: title }), children] }));
+}

package/overlay/template/index.d.ts

@@ -0,0 +1,7 @@
+import Info from "./Info";
+import Manage from "./Manage";
+declare const Overlay: {
+    Info: typeof Info;
+    Manage: typeof Manage;
+};
+export default Overlay;

package/overlay/template/index.js

@@ -0,0 +1,7 @@
+import Info from "./Info";
+import Manage from "./Manage";
+const Overlay = {
+    Info,
+    Manage,
+};
+export default Overlay;

package/overlay/widget/Overlay.design.d.ts

@@ -0,0 +1,2 @@
+import { OverlayProps } from "../../interface";
+export default function OverlayDesign({ titles, children, event, isVisible, }: OverlayProps): JSX.Element;

package/overlay/widget/Overlay.design.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTransition, animated } from "react-spring";
+import { cn } from "../../util";
+import { useWidgetStore } from "../../store";
+export default function OverlayDesign({ titles, children, event, isVisible, }) {
+    const { removeView, setIsOwn } = useWidgetStore();
+    const { title } = titles;
+    const container = {
+        positions: "absolute top-0 right-0 z-30",
+        sizes: "h-full h",
+        styles: "box-shadow-sm bg-white",
+    };
+    const body = {
+        positions: "relative",
+        paddings: "pt-12 pl-12",
+        displays: "flex flex-col gap-3.5",
+    };
+    const transitions = useTransition(isVisible, {
+        from: { width: "0%" },
+        enter: { width: "80%", maxWidth: "540px" },
+        leave: { width: "0%" },
+        config: { duration: 300 },
+    });
+    return transitions((styles, item) => item && (_jsxs(animated.div, { style: styles, className: cn(container), onClick: () => setIsOwn(true), children: [_jsxs("div", { className: cn(body), children: [_jsx("div", { className: "font-bold text-2xl", children: title }), _jsx("div", { className: "flex flex-col gap-3", children: children })] }), event && (_jsx("button", { className: "absolute top-3 left-3 bg-black w-6 h-6", onClick: () => removeView(event) }))] })));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edu-tosel/design",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "UI components for International TOSEL Committee",
   "keywords": [
     "jsx",
@@ -14,11 +14,15 @@
   "type": "module",
   "scripts": {},
   "dependencies": {
-    "@edu-tosel/design": "^1.0.11",
+    "date-fns": "^2.30.0",
+    "date-fns-tz": "^2.0.1",
     "react": "^18.2.0",
+    "react-datepicker": "^6.4.0",
     "react-dom": "^18.2.0",
+    "react-icons": "^5.0.1",
     "react-lottie-player": "^1.5.6",
     "react-router-dom": "^6.21.3",
+    "react-spring": "^9.7.3",
     "recharts": "^2.11.0",
     "tailwind-scrollbar-hide": "^1.1.7",
     "tailwindcss-animate": "^1.0.7",

package/store/index.d.ts

@@ -1,16 +1,23 @@
-import { WidgetEvent } from "../interface/Widget";
+import { Order, WidgetEvent } from "../interface";
 interface WidgetProps {
     events: WidgetEvent[];
     setView: (prop: string) => void;
     removeView: (prop: string) => void;
+    clearView: () => void;
     setModal: (prop: string) => void;
     removeModal: (prop: string) => void;
     clearModal: () => void;
-    order: [string, "asc" | "desc"];
-    setOrder: (prop: string) => void;
+    order: Record<string, Order[]>;
+    setOrder: (prop: string, id: string) => void;
     tempData: Record<string, string | number>;
     setTempData: (prop: Record<string, string | number>) => void;
     clearTempData: () => void;
+    flag: boolean;
+    setFlag: () => void;
+    isOwn: boolean;
+    setIsOwn: (prop: boolean) => void;
+    isDark: boolean;
+    setDark: () => void;
 }
 export declare const useWidgetStore: import("zustand").UseBoundStore<import("zustand").StoreApi<WidgetProps>>;
 export {};

package/store/index.js

@@ -1,24 +1,45 @@
 import { create } from "zustand";
 export const useWidgetStore = create((set) => ({
     events: [],
-    setView: (prop) => set((state) => ({
-        events: [...state.events, { event: prop, type: "view" }],
-    })),
+    setView: (prop) => set((state) => {
+        if (state.events.find(({ event }) => event === prop) !== undefined)
+            return state;
+        return {
+            events: [...state.events, { event: prop, type: "view" }],
+        };
+    }),
     removeView: (prop) => {
         set((state) => ({
             events: state.events.filter(({ event }) => event !== prop),
         }));
     },
-    order: ["", "asc"],
-    setOrder: (prop) => {
+    clearView: () => set((state) => ({
+        events: state.events.filter(({ type }) => type !== "view"),
+    })),
+    order: {},
+    setOrder: (id, prop) => {
         set((state) => {
-            if (state.order[0] !== prop) {
-                return {
-                    order: [prop, "asc"],
-                };
-            }
+            const currentOrder = state.order[id] ?? [];
+            const update = () => {
+                const temp = currentOrder.find(({ orderBy }) => orderBy === prop);
+                if (temp !== undefined) {
+                    return {
+                        ...temp,
+                        orderHow: temp.orderHow === "asc"
+                            ? "desc"
+                            : temp.orderHow === "desc"
+                                ? ""
+                                : "asc",
+                    };
+                }
+                return { orderBy: prop, orderHow: "asc" };
+            };
+            const updatedOrder = [
+                ...currentOrder.filter(({ orderBy }) => orderBy !== prop),
+                update(),
+            ];
             return {
-                order: [prop, state.order[1] === "asc" ? "desc" : "asc"],
+                order: { ...state.order, [id]: updatedOrder },
             };
         });
     },
@@ -36,4 +57,10 @@ export const useWidgetStore = create((set) => ({
     tempData: {},
     setTempData: (prop) => set((state) => ({ tempData: { ...state.tempData, ...prop } })),
     clearTempData: () => set({ tempData: {} }),
+    flag: false,
+    setFlag: () => set((state) => ({ flag: !state.flag })),
+    isOwn: false,
+    setIsOwn: (prop) => set({ isOwn: prop }),
+    isDark: false,
+    setDark: () => set((state) => ({ isDark: !state.isDark })),
 }));

package/tailwind.config.ts

@@ -17,6 +17,8 @@ export default {
         kostar: ["kostar"],
         nicomoji: ["nicomoji"],
         megrim: ["megrim"],
+        "times-newer-roman-bold": ["times-newer-roman-bold"],
+        "times-newer-roman-bolditalic": ["times-newer-roman-bolditalic"],
       },
       backgroundImage: {
         "image-space": "url('/images/home/space.png')",
@@ -26,6 +28,22 @@ export default {
           "0%, 100%": { backgroundPosition: "left center" },
           "50%": { backgroundPosition: "right center" },
         },
+        fadeIn: {
+          from: { opacity: "0" },
+          to: { opacity: "1" },
+        },
+        fadeOut: {
+          from: { opacity: "1" },
+          to: { opacity: "0" },
+        },
+        increaseWidth: {
+          from: { width: "0%" },
+          to: { width: "33.3%" },
+        },
+        decreaseWidth: {
+          from: { width: "33.3%" },
+          to: { width: "0%" },
+        },
       },
       colors: {
         "white-off": "#F5F5F5",
@@ -45,6 +63,7 @@ export default {
         "silver-pale": "#DFD8CA",
 
         // Brand Colors
+        "cocoon-green": "#00E35B",
         "ps-pink": "#E3006E",
         "ps-pink-light": "#FFBADB",
         "st-orange": "#ED6A00",
@@ -64,22 +83,36 @@ export default {
       spacing: {
         "sun-calc": "calc(50% - 6rem)",
         1: "0.25rem",
+        2.5: "0.625rem",
+        3.75: "0.9375rem",
+        4.75: "1.1875rem",
+        6.25: "1.5625rem",
+        6.5: "1.625rem",
         7: "1.75rem",
         7.5: "1.875rem",
         8: "2rem",
         9: "2.25rem",
         11: "2.75rem",
         12: "3rem",
+        13.25: "3.3125rem",
+        13.75: "3.4375rem",
         14: "3.5rem",
+        14.5: "3.625rem",
         15: "3.75rem",
         16: "4rem",
         18: "4.5rem",
+        18.75: "4.6875rem",
         19: "4.75rem",
+        19.25: "4.8125rem",
+        21: "5.25rem",
+        21.75: "5.4375rem",
         22: "5.5rem",
         23: "5.75rem",
         25: "6.25rem",
         26: "6.5rem",
         27: "6.75rem",
+        28.78: "7.195rem",
+        29: "7.25rem",
         30: "7.5rem",
         34: "8.5rem",
         36: "9rem",
@@ -92,11 +125,14 @@ export default {
         48: "12rem",
         49: "12.25rem",
         50: "12.5rem",
+        51: "12.75rem",
         52: "13rem",
+        52.5: "13.125rem",
         54: "13.5rem",
         56: "14rem",
         62: "15.5rem",
         64: "16rem",
+        67.5: "16.875rem",
         68: "17rem",
         69: "17.25rem",
         70: "17.5rem",
@@ -129,13 +165,24 @@ export default {
         132: "33rem",
         135: "33.75rem",
         136: "34rem",
+        138.75: "34.6875rem",
         140: "35rem",
         144: "36rem",
+        145: "36.25rem",
+        145.25: "36.375rem",
+        146: "36.5rem",
+        147: "36.75rem",
         148: "37rem",
+        151.5: "37.875rem",
+        151.75: "37.9375rem",
+        152: "38rem",
+        153: "38.25rem",
         158: "39.5rem",
+        159: "39.75rem",
         160: "40rem",
         164: "41rem",
         168: "42rem",
+        171.5: "42.875rem",
         172: "43rem",
         176: "44rem",
         178: "44.5rem",
@@ -261,6 +308,8 @@ export default {
         "7xl": "4.5rem",
         "8xl": "6rem",
         "9xl": "8rem",
+        "10xl": "10rem",
+        "11xl": "12rem",
       },
       screens: {
         xxxs: "332px",
@@ -409,6 +458,7 @@ export default {
         "100/100": "100%",
       },
       height: {
+        "2/3": "66.6666667%",
         "4/7": "57.1428571%",
         "3/7": "42.8571429%",
         "5/12": "41.6666667%",
@@ -420,6 +470,8 @@ export default {
         "9/10": "90%",
       },
       zIndex: {
+        "100": "100",
+        "90": "90",
         "50": "50",
         "49": "49",
         "48": "48",
@@ -439,6 +491,9 @@ export default {
     },
   },
   safelist: [
+    {
+      pattern: /font-.*/,
+    },
     {
       pattern: /animate-.*/,
     },
@@ -551,4 +606,5 @@ export default {
     },
   ],
   plugins: [tailwindcssAnimate],
+  darkMode: "selector",
 } satisfies Config;

package/text/Formatter.d.ts

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

package/text/Formatter.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+export function Formatter({ script }) {
+    const lines = script.split("\n");
+    const htmlRegex = /<div.*?>.*?<\/div>/gs;
+    const result = lines.map((line, index) => {
+        const htmlMatch = line.match(htmlRegex);
+        if (htmlMatch)
+            return (_jsx("div", { dangerouslySetInnerHTML: { __html: htmlMatch[0] } }, index));
+        if (line.startsWith("# "))
+            return (_jsx("div", { className: "text-3xl", children: line.replace("# ", "") }, index));
+        if (line.startsWith("## "))
+            return (_jsx("div", { className: "text-2xl", children: line.replace("## ", "") }, index));
+        if (line.startsWith("```"))
+            return (_jsx("div", { className: "bg-gray-200 p-2", children: line.replace(/^```|```$/g, "") }, index));
+        return _jsx("div", { children: line }, index);
+    });
+    return _jsx(_Fragment, { children: result });
+}

package/text/index.d.ts

@@ -1 +1,2 @@
 export * from "./LineBreaks";
+export * from "./Formatter";

package/text/index.js

@@ -1 +1,2 @@
 export * from "./LineBreaks";
+export * from "./Formatter";

package/util/checkPathMatch.d.ts

@@ -0,0 +1,2 @@
+declare const checkPathMatch: (href: string, nowPath: string) => boolean;
+export default checkPathMatch;

package/util/checkPathMatch.js

@@ -0,0 +1,8 @@
+const checkPathMatch = (href, nowPath) => {
+    const nowPathFormat = nowPath
+        .split("/")
+        .filter((segment) => !/^\d+$/.test(segment))
+        .join("/");
+    return href.split("/").pop() === nowPathFormat.split("/").pop();
+};
+export default checkPathMatch;

package/util/colors.d.ts

@@ -7,5 +7,6 @@ export declare const colorsByLevel: {
 };
 export declare const gradient: {
     lab: string;
-    green_to_red: string;
+    greenToRed: string;
+    greenToRedSoft: string;
 };

package/util/colors.js

@@ -7,5 +7,6 @@ export const colorsByLevel = {
 };
 export const gradient = {
     lab: "gradient-to-br from-violet-light/20 to-blue-sky/40 ",
-    green_to_red: "gradient-to-r from-green-dark/20 to-red-crimson/20",
+    greenToRed: "gradient-to-r from-green-dark to-red-crimson",
+    greenToRedSoft: "gradient-to-r from-green-dark/20 to-red-crimson/20",
 };

package/util/convertUnixTimestampToDate.d.ts

@@ -0,0 +1 @@
+export default function convertUnixTimestampToDate(unixTimestamp: number): string;