@edu-tosel/design 1.0.34 → 1.0.35

package/layout/template/Shelf.js

@@ -1,18 +1,25 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../../util";
-import ShelfDesign from "../widget/Shelf.design";
+import ShelfDesign from "../design/Shelf.design";
+const gap = {
+    xy: "gap-7.5",
+    x: "gap-x-7.5",
+    y: "gap-y-7.5",
+    none: "gap-0",
+};
 function Shelf({ titles, debug, children }) {
     const container = {
         displays: "inline-flex flex-col gap-12 w-full",
     };
-    return (_jsx(ShelfDesign, { titles: titles, classNames: cn(container), debug: debug, children: children }));
+    return (_jsx(ShelfDesign, { titles: titles, className: cn(container), debug: debug, children: children }));
 }
-function Wrap({ classNames, titles, children, debug, }) {
+function Wrap({ className, titles, children, debug, options, }) {
     const container = {
-        displays: "flex flex-row flex-wrap gap-x-7.5",
-        classNames,
+        displays: "flex flex-row flex-wrap",
+        gaps: gap[options?.gap ?? "xy"],
+        className,
     };
-    return (_jsx(ShelfDesign, { titles: titles, classNames: cn(container), options: {
+    return (_jsx(ShelfDesign, { titles: titles, className: cn(container), options: {
             titleSize: "text-lg xl:text-2xl",
             subtitleSize: "text-sm",
         }, debug: debug, children: children }));
@@ -21,7 +28,7 @@ function Row({ titles, children, debug }) {
     const container = {
         displays: "flex flex-row gap-7.5",
     };
-    return (_jsx(ShelfDesign, { titles: titles, classNames: cn(container), options: {
+    return (_jsx(ShelfDesign, { titles: titles, className: cn(container), options: {
             titleSize: "text-lg xl:text-2xl",
             subtitleSize: "text-sm",
         }, debug: debug, children: children }));
@@ -30,7 +37,7 @@ function Col({ titles, children, debug }) {
     const container = {
         displays: "flex flex-col flex-wrap gap-y-5",
     };
-    return (_jsx(ShelfDesign, { titles: titles, classNames: cn(container), options: {
+    return (_jsx(ShelfDesign, { titles: titles, className: cn(container), options: {
             titleSize: "text-lg xl:text-2xl",
             subtitleSize: "text-sm",
         }, debug: debug, children: children }));

package/modal/template/Alert.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import ModalDesign from "../widget/Modal.design";
+import ModalDesign from "../design/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: "flex flex-col gap-3", children: _jsxs("div", { className: "flex flex-col gap-6", children: [_jsx("div", { className: "text-3xl font-pretendard-bold", children: title }), _jsx("div", { className: "h-2 w-14 rounded-full bg-pale-lavender" }), _jsx("div", { className: "text-xl font-pretendard-bold", children: script })] }) }) }));
+    return (_jsx(ModalDesign, { isVisible: isVisible, className: "pt-18 px-25", options: { buttons, isCloseButton: true }, children: _jsx("div", { className: "flex flex-col gap-3", children: _jsxs("div", { className: "flex flex-col gap-6", children: [_jsx("div", { className: "text-3xl font-pretendard-bold", children: title }), _jsx("div", { className: "h-2 w-14 rounded-full bg-pale-lavender" }), _jsx("div", { className: "text-xl font-pretendard-bold", children: script })] }) }) }));
 }

package/modal/template/Input.js

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

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