@deepnoid/ui 0.0.112 → 0.1.1

package/dist/chunk-2ZT6V4QR.mjs

@@ -0,0 +1,591 @@
+"use client";
+import {
+  __commonJS,
+  __toESM
+} from "./chunk-AC6TWLRT.mjs";
+
+// ../../node_modules/tailwindcss/lib/util/createPlugin.js
+var require_createPlugin = __commonJS({
+  "../../node_modules/tailwindcss/lib/util/createPlugin.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports, "default", {
+      enumerable: true,
+      get: function() {
+        return _default;
+      }
+    });
+    function createPlugin(plugin2, config) {
+      return {
+        handler: plugin2,
+        config
+      };
+    }
+    createPlugin.withOptions = function(pluginFunction, configFunction = () => ({})) {
+      const optionsFunction = function(options) {
+        return {
+          __options: options,
+          handler: pluginFunction(options),
+          config: configFunction(options)
+        };
+      };
+      optionsFunction.__isOptionsFunction = true;
+      optionsFunction.__pluginFunction = pluginFunction;
+      optionsFunction.__configFunction = configFunction;
+      return optionsFunction;
+    };
+    var _default = createPlugin;
+  }
+});
+
+// ../../node_modules/tailwindcss/lib/public/create-plugin.js
+var require_create_plugin = __commonJS({
+  "../../node_modules/tailwindcss/lib/public/create-plugin.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports, "default", {
+      enumerable: true,
+      get: function() {
+        return _default;
+      }
+    });
+    var _createPlugin = /* @__PURE__ */ _interop_require_default(require_createPlugin());
+    function _interop_require_default(obj) {
+      return obj && obj.__esModule ? obj : {
+        default: obj
+      };
+    }
+    var _default = _createPlugin.default;
+  }
+});
+
+// ../../node_modules/tailwindcss/plugin.js
+var require_plugin = __commonJS({
+  "../../node_modules/tailwindcss/plugin.js"(exports, module) {
+    "use strict";
+    var createPlugin = require_create_plugin();
+    module.exports = (createPlugin.__esModule ? createPlugin : { default: createPlugin }).default;
+  }
+});
+
+// src/utils/tailwind-variants.ts
+import { createTV } from "tailwind-variants";
+
+// ../tailwind-config/src/plugin.ts
+var import_plugin = __toESM(require_plugin());
+
+// ../tailwind-config/src/colors/semantic-palette.ts
+var semanticPalette = {
+  light: {
+    primary: {
+      soft: "#EFF8FF",
+      light: "#C7E5FA",
+      main: "#3F9CF2",
+      dark: "#2980E7",
+      strong: "#204A88"
+    },
+    secondary: {
+      soft: "#F8F1FF",
+      light: "#DEC1FA",
+      main: "#9B3FF2",
+      dark: "#7E27CF",
+      strong: "#3E0C6D"
+    },
+    body: {
+      foreground: "#333333",
+      background: "#FFFFFF"
+    },
+    neutral: {
+      soft: "#F2F3F4",
+      light: "#DFE2E7",
+      main: "#808488",
+      dark: "#5B5E62",
+      strong: "#383A3E"
+    },
+    trans: {
+      soft: "#000000, 0.05",
+      light: "#000000, 0.1",
+      main: "#000000, 0.2",
+      dark: "#000000, 0.3",
+      strong: "#000000, 0.6"
+    },
+    common: {
+      black: "#333333",
+      white: "#FFFFFF",
+      transparent: "#FFFFFF, 0"
+    },
+    info: {
+      soft: "#F3FBFB",
+      light: "#B5F0F0",
+      main: "#1FAFAF",
+      dark: "#189494",
+      strong: ""
+    },
+    success: {
+      soft: "#F0FBF0",
+      light: "#92DCB2",
+      main: "#24A25B",
+      dark: "#137F42",
+      strong: ""
+    },
+    warning: {
+      soft: "#FEF8EB",
+      light: "#F9C967",
+      main: "#EDA410",
+      dark: "#C8890A",
+      strong: ""
+    },
+    danger: {
+      soft: "#FFF3F7",
+      light: "#FFBAD1",
+      main: "#FF4684",
+      dark: "#C62F62",
+      strong: ""
+    }
+  },
+  dark: {
+    primary: {
+      soft: "#EFF8FF",
+      light: "#C7E5FA",
+      main: "#3F9CF2",
+      dark: "#2980E7",
+      strong: "#204A88"
+    },
+    secondary: {
+      soft: "#F8F1FF",
+      light: "#DEC1FA",
+      main: "#9B3FF2",
+      dark: "#7E27CF",
+      strong: "#3E0C6D"
+    },
+    body: {
+      foreground: "#333333",
+      background: "#FFFFFF"
+    },
+    neutral: {
+      soft: "#F2F3F4",
+      light: "#DFE2E7",
+      main: "#808488",
+      dark: "#5B5E62",
+      strong: "#383A3E"
+    },
+    trans: {
+      soft: "#000000, 0.05",
+      light: "#000000, 0.1",
+      main: "#000000, 0.2",
+      dark: "#000000, 0.3",
+      strong: "#000000, 0.6"
+    },
+    common: {
+      black: "#333333",
+      white: "#FFFFFF",
+      transparent: "#FFFFFF, 0"
+    },
+    info: {
+      soft: "#F3FBFB",
+      light: "#B5F0F0",
+      main: "#1FAFAF",
+      dark: "#189494",
+      strong: ""
+    },
+    success: {
+      soft: "#F0FBF0",
+      light: "#92DCB2",
+      main: "#24A25B",
+      dark: "#137F42",
+      strong: ""
+    },
+    warning: {
+      soft: "#FEF8EB",
+      light: "#F9C967",
+      main: "#EDA410",
+      dark: "#C8890A",
+      strong: ""
+    },
+    danger: {
+      soft: "#FFF3F7",
+      light: "#FFBAD1",
+      main: "#FF4684",
+      dark: "#C62F62",
+      strong: ""
+    }
+  }
+};
+
+// ../tailwind-config/src/typography/font.ts
+var fontSize = {
+  h1: [
+    "40px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h2: [
+    "34px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h3: [
+    "28px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h4: [
+    "24px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h5: [
+    "20px",
+    {
+      fontWeight: "600"
+    }
+  ],
+  sm: [
+    "12px",
+    {
+      lineHeight: "18px",
+      fontWeight: "400"
+    }
+  ],
+  md: [
+    "14px",
+    {
+      lineHeight: "21px",
+      fontWeight: "400"
+    }
+  ],
+  lg: [
+    "16px",
+    {
+      lineHeight: "24px",
+      fontWeight: "400"
+    }
+  ],
+  xl: [
+    "18px",
+    {
+      lineHeight: "27px",
+      fontWeight: "400"
+    }
+  ]
+};
+
+// ../tailwind-config/src/animation/slide.ts
+var sliceAnimation = {
+  slideInFromTop: "slideInFromTop 0.5s ease-out",
+  slideInFromBottom: "slideInFromBottom 0.5s ease-out",
+  slideInFromLeft: "slideInFromLeft 0.5s ease-out",
+  slideInFromRight: "slideInFromRight 0.5s ease-out",
+  slideOutToTop: "slideOutToTop 0.5s ease-in",
+  slideOutToBottom: "slideOutToBottom 0.5s ease-in",
+  slideOutToLeft: "slideOutToLeft 0.5s ease-in",
+  slideOutToRight: "slideOutToRight 0.5s ease-in"
+};
+var sliceKeyframe = {
+  slideInFromTop: {
+    "0%": {
+      transform: "translateY(-10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromBottom: {
+    "0%": {
+      transform: "translateY(10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromLeft: {
+    "0%": {
+      transform: "translateX(-10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromRight: {
+    "0%": {
+      transform: "translateX(10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    }
+  },
+  slideOutToTop: {
+    "0%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateY(-10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToBottom: {
+    "0%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateY(10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToLeft: {
+    "0%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateX(-10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToRight: {
+    "0%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateX(10px)",
+      opacity: "0"
+    }
+  }
+};
+
+// ../tailwind-config/src/animation/index.ts
+var animation = { ...sliceAnimation };
+var keyframes = { ...sliceKeyframe };
+
+// ../tailwind-config/src/shadow/index.ts
+var boxShadow = {
+  "border-1": "inner 0 0 0 1px inset",
+  "border-2": "inner 0 0 0 2px inset",
+  "border-3": "inner 0 0 0 3px inset",
+  "border-4": "inner 0 0 0 4px inset",
+  "border-5": "inner 0 0 0 5px inset",
+  "border-6": "inner 0 0 0 6px inset",
+  "border-7": "inner 0 0 0 7px inset",
+  "border-8": "inner 0 0 0 8px inset",
+  "border-9": "inner 0 0 0 9px inset",
+  "border-10": "inner 0 0 0 10px inset",
+  inner: "inset 0 4px 8px 0 rgba(36, 39, 44, 0.2)",
+  drop: "0 20px 40px 0 rgba(36, 39, 44, 0.2)"
+};
+
+// ../tailwind-config/src/border/radius.ts
+var borderRadius = {
+  sm: "4px",
+  md: "6px",
+  lg: "8px",
+  xl: "10px",
+  none: "0",
+  full: "9999px"
+};
+
+// ../tailwind-config/src/border/width.ts
+var borderWidth = {
+  sm: "1px",
+  md: "1.25px",
+  lg: "1.5px",
+  xl: "1.75px"
+};
+
+// ../tailwind-config/src/space/gap.ts
+var gap = {
+  sm: "4px",
+  md: "6px",
+  lg: "8px",
+  xl: "10px"
+};
+
+// ../tailwind-config/src/utils/color.ts
+var getTransColor = (hex, alpha) => {
+  const bigint = parseInt(hex.slice(1), 16);
+  const r = bigint >> 16 & 255;
+  const g = bigint >> 8 & 255;
+  const b = bigint & 255;
+  return `rgba(${r},${g},${b},${alpha})`;
+};
+
+// ../tailwind-config/src/plugin.ts
+var resolveConfig = (themes = {}, defaultTheme, prefix = "dn") => {
+  const resolved = {
+    variants: [],
+    utilities: {},
+    colors: {},
+    boxShadow: {}
+  };
+  for (const [themeName, { extend, colors }] of Object.entries(themes)) {
+    let cssSelector = `.${themeName},[data-theme="${themeName}"]`;
+    const scheme = themeName === "light" || themeName === "dark" ? themeName : extend;
+    if (themeName === defaultTheme) cssSelector = `:root,${cssSelector}`;
+    resolved.utilities[cssSelector] = scheme ? { "color-scheme": scheme } : {};
+    resolved.variants.push({
+      name: themeName,
+      definition: [`&.${themeName}`, `&[data-theme='${themeName}']`]
+    });
+    const flatColors = flattenThemeObject(colors);
+    for (const [colorName, colorValue] of Object.entries(flatColors)) {
+      if (!colorValue) continue;
+      try {
+        const ColorVariable = `--${prefix}-${colorName}`;
+        resolved.utilities[cssSelector][ColorVariable] = colorValue;
+        if (colorValue.includes(",")) {
+          const [hex, alpha] = colorValue.split(",").map((s) => s.trim());
+          if ((hex == null ? void 0 : hex.startsWith("#")) && alpha !== void 0) {
+            resolved.colors[colorName] = () => {
+              return getTransColor(hex, parseFloat(alpha) || 1);
+            };
+          }
+        } else {
+          resolved.colors[colorName] = () => {
+            return `var(${ColorVariable})`;
+          };
+        }
+      } catch (error) {
+        console.error("error", error == null ? void 0 : error.message);
+      }
+    }
+  }
+  resolved.utilities = {
+    ...resolved.utilities,
+    ".scrollbar-hide": {
+      "-ms-overflow-style": "none",
+      "scrollbar-width": "none",
+      "&::-webkit-scrollbar": {
+        display: "none"
+      }
+    },
+    ".input-arrow-hide": {
+      "&[type='number']::-webkit-inner-spin-button": {
+        "-webkit-appearance": "none",
+        margin: "0"
+      },
+      "&[type='number']::-webkit-outer-spin-button": {
+        "-webkit-appearance": "none",
+        margin: "0"
+      },
+      "&[type='number']": {
+        "-moz-appearance": "textfield"
+        // Firefox용
+      }
+    }
+  };
+  return resolved;
+};
+var flattenThemeObject = (theme) => {
+  const result = {};
+  for (const [key, value] of Object.entries(theme)) {
+    if (typeof value === "string") {
+      result[key] = value;
+    } else if (typeof value === "object") {
+      for (const [subKey, subValue] of Object.entries(value)) {
+        result[`${key}-${subKey}`] = subValue;
+      }
+    }
+  }
+  return result;
+};
+var deepnoidUi = (colorChip = {}, defaultTheme = "light") => {
+  const lightPalette = structuredClone(semanticPalette.light);
+  const darkPalette = structuredClone(semanticPalette.dark);
+  const mergedLight = { ...lightPalette, ...colorChip.light };
+  const mergedDark = { ...darkPalette, ...colorChip.dark };
+  const themes = {
+    light: { extend: "light", colors: mergedLight },
+    dark: { extend: "dark", colors: mergedDark }
+  };
+  const resolved = resolveConfig(themes, defaultTheme);
+  return (0, import_plugin.default)(
+    ({ addBase, addUtilities, addVariant }) => {
+      addBase({
+        html: {
+          fontFamily: "NanumSquare"
+        },
+        'input[type="time"]::-webkit-calendar-picker-indicator': {
+          display: "none",
+          "-webkit-appearance": "none"
+        },
+        'input[type="date"]::-webkit-calendar-picker-indicator': {
+          display: "none",
+          "-webkit-appearance": "none"
+        }
+      });
+      addUtilities({ ...resolved == null ? void 0 : resolved.utilities });
+      resolved == null ? void 0 : resolved.variants.forEach((variant) => {
+        addVariant(variant.name, variant.definition);
+      });
+    },
+    {
+      theme: {
+        extend: {
+          fontFamily: {
+            NanumSquare: [
+              "NanumSquare",
+              "-apple-system",
+              ".SFNSText-Regular",
+              "San Francisco",
+              "BlinkMacSystemFont",
+              "Segoe UI",
+              "Helvetica Neue",
+              "Helvetica",
+              "Arial",
+              "sans-serif"
+            ]
+          },
+          // @ts-ignore
+          colors: { ...resolved == null ? void 0 : resolved.colors },
+          borderRadius,
+          borderWidth,
+          fontSize,
+          boxShadow,
+          gap,
+          keyframes,
+          animation
+        }
+      }
+    }
+  );
+};
+
+// src/utils/tailwind-variants.ts
+function typedKeys(obj) {
+  return Object.keys(obj);
+}
+var COMMON_SIZE = ["sm", "md", "lg", "xl"];
+var tv = createTV({
+  twMergeConfig: {
+    classGroups: {
+      fontSize: [{ text: [...typedKeys(fontSize)] }],
+      borderRadius: [{ rounded: [...typedKeys(borderRadius)] }],
+      boxShadow: [{ shadow: [...typedKeys(boxShadow)] }],
+      padding: [{ p: [...COMMON_SIZE] }],
+      gap: [{ gap: [...typedKeys(gap)] }]
+    }
+  }
+});
+
+export {
+  deepnoidUi,
+  tv
+};