@edu-tosel/design 0.1.4 → 0.1.6

package/text/LineBreaks.d.ts

@@ -0,0 +1,4 @@
+export declare function LineBreaks({ texts, gap }: {
+    texts: string[];
+    gap?: number;
+}): import("react/jsx-runtime").JSX.Element;

package/text/LineBreaks.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { col } from "../util";
+export function LineBreaks({ texts, gap }) {
+    return (_jsx("div", { className: col(gap), children: texts.map((text, index) => (_jsx("div", { className: "leading-tight", children: text }, index))) }));
+}

package/text/index.d.ts

@@ -1,5 +1 @@
-import "../style.css";
-export declare function LineBreaks({ texts, gap }: {
-    texts: string[];
-    gap?: number;
-}): import("react/jsx-runtime").JSX.Element;
+export * from "./LineBreaks";

package/text/index.js

@@ -1,18 +1 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import "../style.css";
-import { col } from "../util";
-export function LineBreaks(_a) {
-    var texts = _a.texts, gap = _a.gap;
-    return (_jsx("div", __assign({ className: col(gap) }, { children: texts.map(function (text, index) { return (_jsx("div", { children: text }, index)); }) })));
-}
+export * from "./LineBreaks";

package/util/classNames.d.ts

@@ -1 +1 @@
-export default function classNames(...props: string[]): string;
+export default function classNames(...props: string[]): string;

package/util/classNames.js

@@ -1,8 +1,4 @@
-export default function classNames() {
-    var props = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        props[_i] = arguments[_i];
-    }
-    var array = props.map(function (prop) { return prop.split(" "); });
-    return array.flat().join(" ");
-}
+export default function classNames(...props) {
+    const array = props.map((prop) => prop.split(" "));
+    return array.flat().join(" ");
+}

package/util/colors.d.ts

@@ -1,10 +1,10 @@
-export declare const colorsByLevel: {
-    PS: string;
-    ST: string;
-    BA: string;
-    JR: string;
-    HJ: string;
-};
-export declare const gradient: {
-    lab: string;
-};
+export declare const colorsByLevel: {
+    PS: string;
+    ST: string;
+    BA: string;
+    JR: string;
+    HJ: string;
+};
+export declare const gradient: {
+    lab: string;
+};

package/util/colors.js

@@ -1,10 +1,10 @@
-export var colorsByLevel = {
-    PS: "ps-pink",
-    ST: "st-orange",
-    BA: "ba-yellow",
-    JR: "jr-blue",
-    HJ: "hj-blue",
-};
-export var gradient = {
-    lab: "bg-gradient-to-br from-violet-light/20 to-blue-sky/40 ",
-};
+export const colorsByLevel = {
+    PS: "ps-pink",
+    ST: "st-orange",
+    BA: "ba-yellow",
+    JR: "jr-blue",
+    HJ: "hj-blue",
+};
+export const gradient = {
+    lab: "gradient-to-br from-violet-light/20 to-blue-sky/40 ",
+};

package/util/display.d.ts

@@ -1,25 +1,25 @@
-export declare const row: (gap?: number) => string;
-export declare const col: (gap?: number, width?: number | string) => string;
-export declare const between: {
-    row: string;
-    col: string;
-};
-export declare const center: {
-    col: (gap?: number) => string;
-    row: (gap?: number) => string;
-    colO: (gap?: number) => string;
-    rowO: (gap?: number) => string;
-    screen: {
-        default: string;
-        col: (gap?: number) => string;
-        row: (gap?: number) => string;
-    };
-};
-export declare const grid: {
-    col: (col: number, gap?: number) => string;
-    row: (row: number, gap?: number) => string;
-};
-export declare const box: {
-    row: (height: number, gap?: number) => string;
-    col: (width: number, gap?: number) => string;
-};
+export declare const row: (gap?: number) => string;
+export declare const col: (gap?: number, width?: number | string) => string;
+export declare const between: {
+    row: string;
+    col: string;
+};
+export declare const center: {
+    col: (gap?: number) => string;
+    row: (gap?: number) => string;
+    colO: (gap?: number) => string;
+    rowO: (gap?: number) => string;
+    screen: {
+        default: string;
+        col: (gap?: number) => string;
+        row: (gap?: number) => string;
+    };
+};
+export declare const grid: {
+    col: (col: number, gap?: number) => string;
+    row: (row: number, gap?: number) => string;
+};
+export declare const box: {
+    row: (height: number, gap?: number) => string;
+    col: (width: number, gap?: number) => string;
+};

package/util/display.js

@@ -1,55 +1,25 @@
-export var row = function (gap) {
-    if (gap === void 0) { gap = 8; }
-    return "flex flex-row gap-".concat(gap, " ");
-};
-export var col = function (gap, width) {
-    if (gap === void 0) { gap = 8; }
-    return "flex flex-col gap-".concat(gap, " ").concat(width ? "w-".concat(width) : "w-full", " ");
-};
-export var between = {
-    row: "flex flex-row justify-between items-center ",
-    col: "flex flex-col justify-between items-center ",
-};
-export var center = {
-    col: function (gap) {
-        if (gap === void 0) { gap = 0; }
-        return "gap-".concat(gap, " flex flex-col items-center ");
-    },
-    row: function (gap) {
-        if (gap === void 0) { gap = 0; }
-        return "gap-".concat(gap, " flex flex-row items-center ");
-    },
-    colO: function (gap) {
-        if (gap === void 0) { gap = 0; }
-        return "gap-".concat(gap, " flex flex-col justify-center items-center ");
-    },
-    rowO: function (gap) {
-        if (gap === void 0) { gap = 0; }
-        return "gap-".concat(gap, " flex flex-row justify-center items-center ");
-    },
-    screen: {
-        default: "flex justify-center items-center min-h-screen w-full overflow-hidden min-h-screen relative ",
-        col: function (gap) {
-            if (gap === void 0) { gap = 0; }
-            return "gap-".concat(gap, " flex flex-col justify-center items-center min-h-screen w-full ");
-        },
-        row: function (gap) {
-            if (gap === void 0) { gap = 0; }
-            return "gap-".concat(gap, " flex flex-row justify-center items-center min-h-screen w-full ");
-        },
-    },
-};
-export var grid = {
-    col: function (col, gap) {
-        if (gap === void 0) { gap = 12; }
-        return "grid grid-cols-".concat(col, " gap-").concat(gap, " ");
-    },
-    row: function (row, gap) {
-        if (gap === void 0) { gap = 12; }
-        return "grid grid-rows-".concat(row, "  gap-").concat(gap);
-    },
-};
-export var box = {
-    row: function (height, gap) { return "h-".concat(height, " gap-").concat(gap, " flex flex-row "); },
-    col: function (width, gap) { return "w-".concat(width, " gap-").concat(gap, " flex flex-col "); },
-};
+export const row = (gap = 8) => `flex flex-row gap-${gap} `;
+export const col = (gap = 8, width) => `flex flex-col gap-${gap} ${width ? `w-${width}` : "w-full"} `;
+export const between = {
+    row: "flex flex-row justify-between items-center ",
+    col: "flex flex-col justify-between items-center ",
+};
+export const center = {
+    col: (gap = 0) => `gap-${gap} flex flex-col items-center `,
+    row: (gap = 0) => `gap-${gap} flex flex-row items-center `,
+    colO: (gap = 0) => `gap-${gap} flex flex-col justify-center items-center `,
+    rowO: (gap = 0) => `gap-${gap} flex flex-row justify-center items-center `,
+    screen: {
+        default: "flex justify-center items-center min-h-screen w-full overflow-hidden min-h-screen relative ",
+        col: (gap = 0) => `gap-${gap} flex flex-col justify-center items-center min-h-screen w-full `,
+        row: (gap = 0) => `gap-${gap} flex flex-row justify-center items-center min-h-screen w-full `,
+    },
+};
+export const grid = {
+    col: (col, gap = 12) => `grid grid-cols-${col} gap-${gap} `,
+    row: (row, gap = 12) => `grid grid-rows-${row}  gap-${gap}`,
+};
+export const box = {
+    row: (height, gap) => `h-${height} gap-${gap} flex flex-row `,
+    col: (width, gap) => `w-${width} gap-${gap} flex flex-col `,
+};

package/util/displayResponsive.d.ts

@@ -1,3 +1,3 @@
-export declare const responsiveColToRow: () => string;
-export declare const responsiveRowToCol: () => string;
-export declare const responsiveGridToCol: (gridCell: number) => string;
+export declare const responsiveColToRow: () => string;
+export declare const responsiveRowToCol: () => string;
+export declare const responsiveGridToCol: (gridCell: number) => string;

package/util/displayResponsive.js

@@ -1,15 +1,15 @@
-export var responsiveColToRow = function () {
-    var df = "flex flex-col";
-    var mark = "md:flex-row";
-    return [df, mark].join(" ");
-};
-export var responsiveRowToCol = function () {
-    var df = "flex flex-row";
-    var md = "md:flex-col";
-    return [df, md].join(" ");
-};
-export var responsiveGridToCol = function (gridCell) {
-    var df = "grid grid-cols-".concat(gridCell);
-    var md = "md:flex md:flex-col";
-    return [df, md].join(" ");
-};
+export const responsiveColToRow = () => {
+    const df = "flex flex-col";
+    const mark = "md:flex-row";
+    return [df, mark].join(" ");
+};
+export const responsiveRowToCol = () => {
+    const df = "flex flex-row";
+    const md = "md:flex-col";
+    return [df, md].join(" ");
+};
+export const responsiveGridToCol = (gridCell) => {
+    const df = `grid grid-cols-${gridCell}`;
+    const md = "md:flex md:flex-col";
+    return [df, md].join(" ");
+};

package/util/index.d.ts

@@ -1,7 +1,7 @@
-export { default as cn } from "./classNames";
-export * from "./colors";
-export * from "./display";
-export * from "./displayResponsive";
-export * from "./pattern";
-export * from "./position";
-export * from "./shape";
+export { default as cn } from "./classNames";
+export * from "./colors";
+export * from "./display";
+export * from "./displayResponsive";
+export * from "./pattern";
+export * from "./position";
+export * from "./shape";

package/util/index.js

@@ -1,7 +1,7 @@
-export { default as cn } from "./classNames";
-export * from "./colors";
-export * from "./display";
-export * from "./displayResponsive";
-export * from "./pattern";
-export * from "./position";
-export * from "./shape";
+export { default as cn } from "./classNames";
+export * from "./colors";
+export * from "./display";
+export * from "./displayResponsive";
+export * from "./pattern";
+export * from "./position";
+export * from "./shape";

package/util/pattern.d.ts

@@ -1,7 +1,7 @@
-type Color = [string, string];
-export declare const buttonStyle: {
-    default: (colorSet: [Color, Color] | [Color], size?: {
-        width: number;
-    } | undefined) => string;
-};
-export {};
+type Color = [string, string];
+export declare const buttonStyle: {
+    default: (colorSet: [Color, Color] | [Color], size?: {
+        width: number;
+    }) => string;
+};
+export {};

package/util/pattern.js

@@ -1,15 +1,15 @@
-export var buttonStyle = {
-    default: function (colorSet, size) {
-        var colors = colorSet[0], hoverColors = colorSet[1];
-        var bgColor = colors[0], textColor = colors[1];
-        var _a = hoverColors || ["", ""], bgHoverColor = _a[0], textHoverColor = _a[1];
-        var width = (size || { width: 32 }).width;
-        var classNames = [
-            "w-".concat(width),
-            "bg-".concat(bgColor, " ").concat(bgHoverColor ? "hover:bg-".concat(bgHoverColor) : ""),
-            "text-".concat(textColor, " ").concat(textHoverColor ? "hover:text-".concat(textHoverColor) : ""),
-            "font-bold py-2 px-4 rounded",
-        ];
-        return classNames.join(" ");
-    },
-};
+export const buttonStyle = {
+    default: (colorSet, size) => {
+        const [colors, hoverColors] = colorSet;
+        const [bgColor, textColor] = colors;
+        const [bgHoverColor, textHoverColor] = hoverColors || ["", ""];
+        const { width } = size || { width: 32 };
+        const classNames = [
+            `w-${width}`,
+            `bg-${bgColor} ${bgHoverColor ? `hover:bg-${bgHoverColor}` : ""}`,
+            `text-${textColor} ${textHoverColor ? `hover:text-${textHoverColor}` : ""}`,
+            "font-bold py-2 px-4 rounded",
+        ];
+        return classNames.join(" ");
+    },
+};

package/util/position.d.ts

@@ -1,14 +1,14 @@
-export declare const fixed: {
-    tl: (top: number | string, left: number | string) => string;
-    br: (bottom: number | string, right: number | string) => string;
-};
-export declare const absolute: {
-    tl: (top?: number | string, left?: number | string) => string;
-    tr: (top?: number | string, right?: number | string) => string;
-    br: (bottom?: number, right?: number) => string;
-    bl: (bottom?: number, left?: number) => string;
-    full: {
-        tl: (top?: number | string, left?: number | string) => string;
-        bl: (bottom?: number | string, left?: number | string) => string;
-    };
-};
+export declare const fixed: {
+    tl: (top: number | string, left: number | string) => string;
+    br: (bottom: number | string, right: number | string) => string;
+};
+export declare const absolute: {
+    tl: (top?: number | string, left?: number | string) => string;
+    tr: (top?: number | string, right?: number | string) => string;
+    br: (bottom?: number, right?: number) => string;
+    bl: (bottom?: number, left?: number) => string;
+    full: {
+        tl: (top?: number | string, left?: number | string) => string;
+        bl: (bottom?: number | string, left?: number | string) => string;
+    };
+};

package/util/position.js

@@ -1,56 +1,44 @@
-export var fixed = {
-    tl: function (top, left) { return "fixed top-".concat(top, " left-").concat(left, " z-50 "); },
-    br: function (bottom, right) {
-        return "fixed bottom-".concat(bottom, " right-").concat(right, " z-50 ");
-    },
-};
-export var absolute = {
-    tl: function (top, left) {
-        var topClass = function () {
-            if (typeof top === "number" && top < 0)
-                return "-top-".concat(Math.abs(top));
-            return "top-".concat(top);
-        };
-        var leftClass = function () {
-            if (typeof left === "number" && left < 0)
-                return "-left-".concat(Math.abs(left));
-            return "left-".concat(left);
-        };
-        return "absolute ".concat(topClass(), " ").concat(leftClass(), " ");
-    },
-    tr: function (top, right) {
-        var topClass = function () {
-            if (typeof top === "number" && top < 0)
-                return "-top-".concat(Math.abs(top), " ");
-            return "top-".concat(top);
-        };
-        var rightClass = function () {
-            if (typeof right === "number" && right < 0)
-                return "-right-".concat(Math.abs(right), " ");
-            return "right-".concat(right);
-        };
-        return "absolute ".concat(topClass(), " ").concat(rightClass(), " ");
-    },
-    br: function (bottom, right) {
-        if (bottom === void 0) { bottom = 0; }
-        if (right === void 0) { right = 0; }
-        return "absolute bottom-".concat(bottom, " right-").concat(right, " ");
-    },
-    bl: function (bottom, left) {
-        if (bottom === void 0) { bottom = 0; }
-        if (left === void 0) { left = 0; }
-        return "absolute bottom-".concat(bottom, " left-").concat(left, " ");
-    },
-    full: {
-        tl: function (top, left) {
-            if (!(typeof top === "number") || !(typeof left === "number"))
-                return "absolute top-".concat(top, " left-").concat(left, " w-full ");
-            var topClass = top >= 0 ? "top-".concat(top) : "-top-".concat(Math.abs(top));
-            var leftClass = left >= 0 ? "left-".concat(left) : "-left-".concat(Math.abs(left));
-            return "absolute w-full ".concat(topClass, " ").concat(leftClass, " ");
-        },
-        bl: function (bottom, left) {
-            return "absolute bottom-".concat(bottom !== null && bottom !== void 0 ? bottom : 0, " left-").concat(left !== null && left !== void 0 ? left : 0, " w-full ");
-        },
-    },
-};
+export const fixed = {
+    tl: (top, left) => `fixed top-${top} left-${left} z-50 `,
+    br: (bottom, right) => `fixed bottom-${bottom} right-${right} z-50 `,
+};
+export const absolute = {
+    tl: (top, left) => {
+        const topClass = () => {
+            if (typeof top === "number" && top < 0)
+                return `-top-${Math.abs(top)}`;
+            return `top-${top}`;
+        };
+        const leftClass = () => {
+            if (typeof left === "number" && left < 0)
+                return `-left-${Math.abs(left)}`;
+            return `left-${left}`;
+        };
+        return `absolute ${topClass()} ${leftClass()} `;
+    },
+    tr: (top, right) => {
+        const topClass = () => {
+            if (typeof top === "number" && top < 0)
+                return `-top-${Math.abs(top)} `;
+            return `top-${top}`;
+        };
+        const rightClass = () => {
+            if (typeof right === "number" && right < 0)
+                return `-right-${Math.abs(right)} `;
+            return `right-${right}`;
+        };
+        return `absolute ${topClass()} ${rightClass()} `;
+    },
+    br: (bottom = 0, right = 0) => `absolute bottom-${bottom} right-${right} `,
+    bl: (bottom = 0, left = 0) => `absolute bottom-${bottom} left-${left} `,
+    full: {
+        tl: (top, left) => {
+            if (!(typeof top === "number") || !(typeof left === "number"))
+                return `absolute top-${top} left-${left} w-full `;
+            const topClass = top >= 0 ? `top-${top}` : `-top-${Math.abs(top)}`;
+            const leftClass = left >= 0 ? `left-${left}` : `-left-${Math.abs(left)}`;
+            return `absolute w-full ${topClass} ${leftClass} `;
+        },
+        bl: (bottom, left) => `absolute bottom-${bottom ?? 0} left-${left ?? 0} w-full `,
+    },
+};

package/util/shape.d.ts

@@ -1 +1 @@
-export declare const circle: (radius: number) => string;
+export declare const circle: (radius: number) => string;

package/util/shape.js

@@ -1,3 +1,3 @@
-export var circle = function (radius) {
-    return "rounded-full w-".concat(radius, " h-").concat(radius, " overflow-hidden ");
-};
+export const circle = (radius) => {
+    return `rounded-full w-${radius} h-${radius} overflow-hidden `;
+};

package/version.txt

@@ -1 +1 @@
-0.1.4
+0.1.6

package/header/index.js

@@ -1,25 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import "../style.css";
-import { useState } from "react";
-import { circle } from "../util";
-function Menu() {
-    var classNames = ["absolute -left-24 z-40 h-80 w-48 border-2 bg-white "].join(" ");
-    return (_jsxs("div", __assign({ className: classNames + " fade-in-100 animate-in" }, { children: [_jsx("div", { children: "\u314E\u3147" }), _jsx("div", { children: "\u314E\u3147" })] })));
-}
-export function DashboardHeader(_a) {
-    var title = _a.title, image = _a.image;
-    var _b = useState(false), isOpen = _b[0], setIsOpen = _b[1];
-    var _c = image !== null && image !== void 0 ? image : [], src = _c[0], href = _c[1];
-    return (_jsxs("div", __assign({ className: "relative flex h-20 w-full items-center justify-between bg-white px-19 shadow-black/10 shadow-b-md" }, { children: [_jsxs("div", __assign({ className: "flex h-12 items-center gap-9" }, { children: [src && href ? (_jsx("a", __assign({ href: href }, { children: _jsx("img", { src: src, alt: "logo", className: "h-12" }) }))) : (_jsx("div", { children: "TOSEL Lab" })), _jsx("div", __assign({ className: "text-3xl font-bold" }, { children: title }))] })), _jsxs("div", __assign({ className: "relative" }, { children: [_jsx("button", __assign({ onClick: function () { return setIsOpen(!isOpen); }, className: circle(9) + "border-2" }, { children: "+" })), isOpen ? _jsx(Menu, {}) : null] }))] })));
-}