@jameskabz/nextcraft-ui 0.2.0 → 0.3.0

package/dist/index.js

@@ -1,22 +1,27 @@
+// src/utils/cn.ts
+function cn(...values) {
+  return values.filter(Boolean).join(" ");
+}
+
 // src/components/craft-button.tsx
 import { jsx } from "react/jsx-runtime";
-var cn = (...classes) => classes.filter(Boolean).join(" ");
 var sizeClasses = {
   sm: "h-9 px-4 text-xs",
   md: "h-11 px-6 text-sm",
   lg: "h-13 px-8 text-base"
 };
 var variantClasses = {
-  solid: "bg-gradient-to-br from-sky-400 via-blue-500 to-indigo-600 text-white shadow-lg shadow-blue-500/50 hover:shadow-xl hover:shadow-blue-500/60 hover:scale-[1.02] active:scale-[0.98]",
+  solid: "bg-gradient-to-br from-[rgb(var(--nc-accent-1))] via-[rgb(var(--nc-accent-2))] to-[rgb(var(--nc-accent-3))] text-white shadow-[0_12px_30px_rgb(var(--nc-accent-1)/0.45)] hover:shadow-[0_16px_36px_rgb(var(--nc-accent-1)/0.6)] hover:scale-[1.02] active:scale-[0.98]",
   ghost: "bg-white/5 text-white hover:bg-white/10 backdrop-blur-sm border border-white/10 hover:border-white/20",
-  outline: "bg-transparent text-sky-400 border-2 border-sky-400/50 hover:border-sky-400 hover:bg-sky-400/10",
-  gradient: "bg-gradient-to-r from-violet-600 via-fuchsia-500 to-pink-500 text-white shadow-lg shadow-fuchsia-500/50 hover:shadow-xl hover:shadow-fuchsia-500/60 hover:scale-[1.02] active:scale-[0.98]"
+  outline: "bg-transparent text-[color:rgb(var(--nc-accent-1))] border-2 border-[color:rgb(var(--nc-accent-1)/0.5)] hover:border-[color:rgb(var(--nc-accent-1))] hover:bg-[color:rgb(var(--nc-accent-1)/0.1)]",
+  gradient: "bg-gradient-to-r from-[rgb(var(--nc-accent-1))] via-[rgb(var(--nc-accent-2))] to-[rgb(var(--nc-accent-3))] text-white shadow-[0_12px_30px_rgb(var(--nc-accent-2)/0.45)] hover:shadow-[0_16px_36px_rgb(var(--nc-accent-2)/0.6)] hover:scale-[1.02] active:scale-[0.98]"
 };
 function CraftButton({
   className,
   variant = "solid",
   size = "md",
   glow = true,
+  tone,
   disabled,
   ...props
 }) {
@@ -24,32 +29,21 @@ function CraftButton({
     "button",
     {
       className: cn(
-        "relative inline-flex items-center justify-center gap-2 rounded-xl font-semibold tracking-wide transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sky-400 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-900 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100",
+        "relative inline-flex items-center justify-center gap-2 rounded-xl font-semibold tracking-wide transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[rgb(var(--nc-accent-1)/0.6)] focus-visible:ring-offset-2 focus-visible:ring-offset-slate-900 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100",
         sizeClasses[size],
         variantClasses[variant],
-        glow && (variant === "solid" || variant === "gradient") ? "before:absolute before:-inset-1 before:rounded-xl before:bg-linear-to-r before:from-sky-400/20 before:via-blue-500/20 before:to-indigo-600/20 before:blur-xl before:-z-10 before:opacity-0 hover:before:opacity-100 before:transition-opacity" : "",
+        glow && (variant === "solid" || variant === "gradient") ? "before:absolute before:-inset-1 before:rounded-xl before:bg-linear-to-r before:from-[rgb(var(--nc-accent-1)/0.2)] before:via-[rgb(var(--nc-accent-2)/0.2)] before:to-[rgb(var(--nc-accent-3)/0.2)] before:blur-xl before:-z-10 before:opacity-0 hover:before:opacity-100 before:transition-opacity" : "",
         className
       ),
+      "data-nc-theme": tone,
       disabled,
       ...props
     }
   );
 }
 
-// src/utils/cn.ts
-function cn2(...values) {
-  return values.filter(Boolean).join(" ");
-}
-
 // src/components/glass-card.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
-var cardToneClasses = {
-  aurora: "bg-gradient-to-br from-emerald-400/15 via-teal-400/10 to-cyan-400/15 border-emerald-300/30",
-  ember: "bg-gradient-to-br from-amber-400/15 via-orange-400/10 to-rose-400/15 border-amber-300/30",
-  ocean: "bg-gradient-to-br from-sky-400/15 via-blue-400/10 to-indigo-400/15 border-sky-300/30",
-  midnight: "bg-gradient-to-br from-violet-400/15 via-purple-400/10 to-fuchsia-400/15 border-violet-300/30",
-  cosmic: "bg-gradient-to-br from-pink-400/15 via-purple-400/10 to-indigo-400/15 border-pink-300/30"
-};
 var intensityClasses = {
   subtle: "backdrop-blur-md bg-opacity-50",
   medium: "backdrop-blur-xl bg-opacity-70",
@@ -57,7 +51,7 @@ var intensityClasses = {
 };
 function GlassCard({
   className,
-  tone = "ocean",
+  tone,
   intensity = "medium",
   bordered = true,
   children,
@@ -66,17 +60,19 @@ function GlassCard({
   return /* @__PURE__ */ jsx2(
     "div",
     {
-      className: cn2(
+      className: cn(
         "relative overflow-hidden rounded-3xl p-6 text-white",
         "shadow-[0_8px_32px_rgba(0,0,0,0.3)]",
         "transition-all duration-300",
         "hover:shadow-[0_8px_40px_rgba(0,0,0,0.4)]",
         intensityClasses[intensity],
-        cardToneClasses[tone],
+        "bg-linear-to-br from-[rgb(var(--nc-accent-1)/0.15)] via-[rgb(var(--nc-accent-2)/0.10)] to-[rgb(var(--nc-accent-3)/0.15)]",
+        "border-[rgb(var(--nc-accent-1)/0.3)]",
         bordered ? "border-2" : "border-0",
         "before:absolute before:inset-0 before:bg-linear-to-br before:from-white/10 before:to-transparent before:opacity-0 hover:before:opacity-100 before:transition-opacity before:duration-300",
         className
       ),
+      "data-nc-theme": tone,
       ...props,
       children: /* @__PURE__ */ jsx2("div", { className: "relative z-10", children })
     }
@@ -86,40 +82,35 @@ function GlassCard({
 // src/components/craft-input.tsx
 import * as React from "react";
 import { jsx as jsx3, jsxs } from "react/jsx-runtime";
-var cn3 = (...classes) => classes.filter(Boolean).join(" ");
-var inputToneClasses = {
-  aurora: "border-emerald-400/30 focus:border-emerald-400/80 focus:ring-emerald-400/30 placeholder:text-emerald-200/40",
-  ember: "border-amber-400/30 focus:border-amber-400/80 focus:ring-amber-400/30 placeholder:text-amber-200/40",
-  ocean: "border-sky-400/30 focus:border-sky-400/80 focus:ring-sky-400/30 placeholder:text-sky-200/40",
-  midnight: "border-violet-400/30 focus:border-violet-400/80 focus:ring-violet-400/30 placeholder:text-violet-200/40"
-};
 var inputSizeClasses = {
   sm: "h-10 px-4 text-sm",
   md: "h-12 px-5 text-base",
   lg: "h-14 px-6 text-lg"
 };
 var CraftInput = React.forwardRef(
-  ({ className, tone = "ocean", inputSize = "md", glow = true, icon, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { className: "relative w-full", children: [
+  ({ className, tone, inputSize = "md", glow = true, icon, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs("div", { className: "relative w-full", "data-nc-theme": tone, children: [
       icon && /* @__PURE__ */ jsx3("div", { className: "absolute left-4 top-1/2 -translate-y-1/2 text-white/50", children: icon }),
       /* @__PURE__ */ jsx3(
         "input",
         {
           ref,
-          className: cn3(
+          className: cn(
             "w-full rounded-2xl border-2 bg-white/5 text-white backdrop-blur-xl",
             "shadow-[inset_0_2px_8px_rgba(0,0,0,0.3)]",
             "focus:outline-none focus:ring-4",
             "transition-all duration-300",
             "disabled:opacity-50 disabled:cursor-not-allowed",
             inputSizeClasses[inputSize],
-            inputToneClasses[tone],
+            "border-[rgb(var(--nc-accent-1)/0.3)]",
+            "focus:border-[rgb(var(--nc-accent-1)/0.8)] focus:ring-[rgb(var(--nc-accent-1)/0.3)]",
+            "placeholder:text-[rgb(var(--nc-accent-soft)/0.4)]",
             glow ? "focus:shadow-[0_0_30px_-5px_var(--glow-color)]" : "",
             icon ? "pl-12" : "",
             className
           ),
           style: {
-            "--glow-color": tone === "aurora" ? "rgba(52,211,153,0.5)" : tone === "ember" ? "rgba(251,191,36,0.5)" : tone === "midnight" ? "rgba(167,139,250,0.5)" : "rgba(56,189,248,0.5)"
+            "--glow-color": "rgb(var(--nc-accent-1) / 0.5)"
           },
           ...props
         }
@@ -128,9 +119,129 @@ var CraftInput = React.forwardRef(
   }
 );
 CraftInput.displayName = "CraftInput";
+
+// src/theme/theme-context.tsx
+import * as React2 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var THEME_NAMES = [
+  "aurora",
+  "ember",
+  "ocean",
+  "midnight",
+  "cosmic"
+];
+var ThemeContext = React2.createContext(null);
+var DEFAULT_THEME_KEY = "nextcraft-theme";
+var DEFAULT_MODE_KEY = "nextcraft-mode";
+function ThemeProvider({
+  children,
+  defaultTheme = "ocean",
+  defaultMode = "system",
+  storageKeyTheme = DEFAULT_THEME_KEY,
+  storageKeyMode = DEFAULT_MODE_KEY
+}) {
+  const [theme, setTheme] = React2.useState(defaultTheme);
+  const [mode, setMode] = React2.useState(defaultMode);
+  React2.useEffect(() => {
+    if (typeof window === "undefined") return;
+    try {
+      const storedTheme = window.localStorage.getItem(storageKeyTheme);
+      const storedMode = window.localStorage.getItem(storageKeyMode);
+      if (storedTheme) setTheme(storedTheme);
+      if (storedMode) setMode(storedMode);
+    } catch {
+    }
+  }, [storageKeyTheme, storageKeyMode]);
+  React2.useEffect(() => {
+    if (typeof window === "undefined") return;
+    try {
+      window.localStorage.setItem(storageKeyTheme, theme);
+      window.localStorage.setItem(storageKeyMode, mode);
+    } catch {
+    }
+  }, [theme, mode, storageKeyTheme, storageKeyMode]);
+  React2.useEffect(() => {
+    if (typeof document === "undefined") return;
+    const root = document.documentElement;
+    root.dataset.ncTheme = theme;
+    if (mode !== "system") {
+      root.dataset.ncMode = mode;
+      return;
+    }
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    const applySystem = () => {
+      root.dataset.ncMode = mediaQuery.matches ? "dark" : "light";
+    };
+    applySystem();
+    if (typeof mediaQuery.addEventListener === "function") {
+      mediaQuery.addEventListener("change", applySystem);
+      return () => mediaQuery.removeEventListener("change", applySystem);
+    }
+    mediaQuery.addListener(applySystem);
+    return () => mediaQuery.removeListener(applySystem);
+  }, [theme, mode]);
+  const value = React2.useMemo(
+    () => ({ theme, mode, setTheme, setMode }),
+    [theme, mode]
+  );
+  return /* @__PURE__ */ jsx4(ThemeContext.Provider, { value, children });
+}
+function useTheme() {
+  const context = React2.useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useTheme must be used within ThemeProvider");
+  }
+  return context;
+}
+
+// src/components/theme-switcher.tsx
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+var MODE_OPTIONS = ["system", "light", "dark"];
+function ThemeSwitcher({ className, showLabels = true, ...props }) {
+  const { theme, mode, setTheme, setMode } = useTheme();
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: cn(
+        "flex flex-wrap items-center gap-3 rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white shadow-[inset_0_1px_0_rgba(255,255,255,0.06)]",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs2("label", { className: "flex items-center gap-2", children: [
+          showLabels && /* @__PURE__ */ jsx5("span", { className: "text-white/70", children: "Theme" }),
+          /* @__PURE__ */ jsx5(
+            "select",
+            {
+              className: "rounded-lg border border-white/10 bg-white/10 px-3 py-1 text-white outline-none focus:ring-2 focus:ring-[rgb(var(--nc-accent-1)/0.5)]",
+              value: theme,
+              onChange: (event) => setTheme(event.target.value),
+              children: THEME_NAMES.map((name) => /* @__PURE__ */ jsx5("option", { value: name, className: "text-slate-900", children: name }, name))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs2("label", { className: "flex items-center gap-2", children: [
+          showLabels && /* @__PURE__ */ jsx5("span", { className: "text-white/70", children: "Mode" }),
+          /* @__PURE__ */ jsx5(
+            "select",
+            {
+              className: "rounded-lg border border-white/10 bg-white/10 px-3 py-1 text-white outline-none focus:ring-2 focus:ring-[rgb(var(--nc-accent-1)/0.5)]",
+              value: mode,
+              onChange: (event) => setMode(event.target.value),
+              children: MODE_OPTIONS.map((value) => /* @__PURE__ */ jsx5("option", { value, className: "text-slate-900", children: value }, value))
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
 export {
   CraftButton,
   CraftInput,
-  GlassCard
+  GlassCard,
+  ThemeProvider,
+  ThemeSwitcher,
+  useTheme
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/craft-button.tsx","../src/utils/cn.ts","../src/components/glass-card.tsx","../src/components/craft-input.tsx"],"sourcesContent":["import * as React from \"react\";\n\nconst cn = (...classes: (string | boolean | undefined)[]) => \n  classes.filter(Boolean).join(\" \");\n\ntype CraftButtonVariant = \"solid\" | \"ghost\" | \"outline\" | \"gradient\";\ntype CraftButtonSize = \"sm\" | \"md\" | \"lg\";\n\nexport type CraftButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n  variant?: CraftButtonVariant;\n  size?: CraftButtonSize;\n  glow?: boolean;\n};\n\nconst sizeClasses: Record<CraftButtonSize, string> = {\n  sm: \"h-9 px-4 text-xs\",\n  md: \"h-11 px-6 text-sm\",\n  lg: \"h-13 px-8 text-base\",\n};\n\nconst variantClasses: Record<CraftButtonVariant, string> = {\n  solid:\n    \"bg-gradient-to-br from-sky-400 via-blue-500 to-indigo-600 text-white shadow-lg shadow-blue-500/50 hover:shadow-xl hover:shadow-blue-500/60 hover:scale-[1.02] active:scale-[0.98]\",\n  ghost:\n    \"bg-white/5 text-white hover:bg-white/10 backdrop-blur-sm border border-white/10 hover:border-white/20\",\n  outline:\n    \"bg-transparent text-sky-400 border-2 border-sky-400/50 hover:border-sky-400 hover:bg-sky-400/10\",\n  gradient:\n    \"bg-gradient-to-r from-violet-600 via-fuchsia-500 to-pink-500 text-white shadow-lg shadow-fuchsia-500/50 hover:shadow-xl hover:shadow-fuchsia-500/60 hover:scale-[1.02] active:scale-[0.98]\",\n};\n\nexport function CraftButton({\n  className,\n  variant = \"solid\",\n  size = \"md\",\n  glow = true,\n  disabled,\n  ...props\n}: CraftButtonProps) {\n  return (\n    <button\n      className={cn(\n        \"relative inline-flex items-center justify-center gap-2 rounded-xl font-semibold tracking-wide transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sky-400 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-900 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100\",\n        sizeClasses[size],\n        variantClasses[variant],\n        glow && (variant === \"solid\" || variant === \"gradient\")\n          ? \"before:absolute before:-inset-1 before:rounded-xl before:bg-linear-to-r before:from-sky-400/20 before:via-blue-500/20 before:to-indigo-600/20 before:blur-xl before:-z-10 before:opacity-0 hover:before:opacity-100 before:transition-opacity\"\n          : \"\",\n        className\n      )}\n      disabled={disabled}\n      {...props}\n    />\n  );\n}","export function cn(...values: Array<string | false | null | undefined>): string {\n  return values.filter(Boolean).join(\" \");\n}\n","import { cn } from \"@/utils/cn\";\n\nexport type GlassCardProps = React.HTMLAttributes<HTMLDivElement> & {\n  tone?: \"aurora\" | \"ember\" | \"ocean\" | \"midnight\" | \"cosmic\";\n  intensity?: \"subtle\" | \"medium\" | \"strong\";\n  bordered?: boolean;\n};\n\nconst cardToneClasses: Record<NonNullable<GlassCardProps[\"tone\"]>, string> = {\n  aurora:\n    \"bg-gradient-to-br from-emerald-400/15 via-teal-400/10 to-cyan-400/15 border-emerald-300/30\",\n  ember: \n    \"bg-gradient-to-br from-amber-400/15 via-orange-400/10 to-rose-400/15 border-amber-300/30\",\n  ocean: \n    \"bg-gradient-to-br from-sky-400/15 via-blue-400/10 to-indigo-400/15 border-sky-300/30\",\n  midnight:\n    \"bg-gradient-to-br from-violet-400/15 via-purple-400/10 to-fuchsia-400/15 border-violet-300/30\",\n  cosmic:\n    \"bg-gradient-to-br from-pink-400/15 via-purple-400/10 to-indigo-400/15 border-pink-300/30\",\n};\n\nconst intensityClasses: Record<NonNullable<GlassCardProps[\"intensity\"]>, string> = {\n  subtle: \"backdrop-blur-md bg-opacity-50\",\n  medium: \"backdrop-blur-xl bg-opacity-70\",\n  strong: \"backdrop-blur-2xl bg-opacity-90\",\n};\n\nexport function GlassCard({\n  className,\n  tone = \"ocean\",\n  intensity = \"medium\",\n  bordered = true,\n  children,\n  ...props\n}: GlassCardProps) {\n  return (\n    <div\n      className={cn(\n        \"relative overflow-hidden rounded-3xl p-6 text-white\",\n        \"shadow-[0_8px_32px_rgba(0,0,0,0.3)]\",\n        \"transition-all duration-300\",\n        \"hover:shadow-[0_8px_40px_rgba(0,0,0,0.4)]\",\n        intensityClasses[intensity],\n        cardToneClasses[tone],\n        bordered ? \"border-2\" : \"border-0\",\n        \"before:absolute before:inset-0 before:bg-linear-to-br before:from-white/10 before:to-transparent before:opacity-0 hover:before:opacity-100 before:transition-opacity before:duration-300\",\n        className\n      )}\n      {...props}\n    >\n      <div className=\"relative z-10\">{children}</div>\n    </div>\n  );\n}","\nimport * as React from \"react\";\n\nconst cn = (...classes: (string | boolean | undefined)[]) => \n  classes.filter(Boolean).join(\" \");\n\n// ============================================================================\n// CRAFT INPUT\n// ============================================================================\n\ntype CraftInputTone = \"aurora\" | \"ember\" | \"ocean\" | \"midnight\";\ntype CraftInputSize = \"sm\" | \"md\" | \"lg\";\n\nexport type CraftInputProps = Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  \"size\"\n> & {\n  tone?: CraftInputTone;\n  inputSize?: CraftInputSize;\n  glow?: boolean;\n  icon?: React.ReactNode;\n};\n\nconst inputToneClasses: Record<CraftInputTone, string> = {\n  aurora:\n    \"border-emerald-400/30 focus:border-emerald-400/80 focus:ring-emerald-400/30 placeholder:text-emerald-200/40\",\n  ember:\n    \"border-amber-400/30 focus:border-amber-400/80 focus:ring-amber-400/30 placeholder:text-amber-200/40\",\n  ocean: \n    \"border-sky-400/30 focus:border-sky-400/80 focus:ring-sky-400/30 placeholder:text-sky-200/40\",\n  midnight:\n    \"border-violet-400/30 focus:border-violet-400/80 focus:ring-violet-400/30 placeholder:text-violet-200/40\",\n};\n\nconst inputSizeClasses: Record<CraftInputSize, string> = {\n  sm: \"h-10 px-4 text-sm\",\n  md: \"h-12 px-5 text-base\",\n  lg: \"h-14 px-6 text-lg\",\n};\n\nexport const CraftInput = React.forwardRef<HTMLInputElement, CraftInputProps>(\n  (\n    { className, tone = \"ocean\", inputSize = \"md\", glow = true, icon, ...props },\n    ref\n  ) => {\n    return (\n      <div className=\"relative w-full\">\n        {icon && (\n          <div className=\"absolute left-4 top-1/2 -translate-y-1/2 text-white/50\">\n            {icon}\n          </div>\n        )}\n        <input\n          ref={ref}\n          className={cn(\n            \"w-full rounded-2xl border-2 bg-white/5 text-white backdrop-blur-xl\",\n            \"shadow-[inset_0_2px_8px_rgba(0,0,0,0.3)]\",\n            \"focus:outline-none focus:ring-4\",\n            \"transition-all duration-300\",\n            \"disabled:opacity-50 disabled:cursor-not-allowed\",\n            inputSizeClasses[inputSize],\n            inputToneClasses[tone],\n            glow ? \"focus:shadow-[0_0_30px_-5px_var(--glow-color)]\" : \"\",\n            icon ? \"pl-12\" : \"\",\n            className\n          )}\n          style={{\n            \"--glow-color\": tone === \"aurora\" ? \"rgba(52,211,153,0.5)\" : \n                            tone === \"ember\" ? \"rgba(251,191,36,0.5)\" : \n                            tone === \"midnight\" ? \"rgba(167,139,250,0.5)\" :\n                            \"rgba(56,189,248,0.5)\"\n          } as React.CSSProperties}\n          {...props}\n        />\n      </div>\n    );\n  }\n);\n\nCraftInput.displayName = \"CraftInput\";"],"mappings":";AAwCI;AAtCJ,IAAM,KAAK,IAAI,YACb,QAAQ,OAAO,OAAO,EAAE,KAAK,GAAG;AAWlC,IAAM,cAA+C;AAAA,EACnD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,iBAAqD;AAAA,EACzD,OACE;AAAA,EACF,OACE;AAAA,EACF,SACE;AAAA,EACF,UACE;AACJ;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB,eAAe,OAAO;AAAA,QACtB,SAAS,YAAY,WAAW,YAAY,cACxC,kPACA;AAAA,QACJ;AAAA,MACF;AAAA,MACA;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;;;ACtDO,SAASA,OAAM,QAA0D;AAC9E,SAAO,OAAO,OAAO,OAAO,EAAE,KAAK,GAAG;AACxC;;;ACgDM,gBAAAC,YAAA;AA1CN,IAAM,kBAAuE;AAAA,EAC3E,QACE;AAAA,EACF,OACE;AAAA,EACF,OACE;AAAA,EACF,UACE;AAAA,EACF,QACE;AACJ;AAEA,IAAM,mBAA6E;AAAA,EACjF,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AACV;AAEO,SAAS,UAAU;AAAA,EACxB;AAAA,EACA,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,WAAW;AAAA,EACX;AAAA,EACA,GAAG;AACL,GAAmB;AACjB,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,iBAAiB,SAAS;AAAA,QAC1B,gBAAgB,IAAI;AAAA,QACpB,WAAW,aAAa;AAAA,QACxB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,0BAAAD,KAAC,SAAI,WAAU,iBAAiB,UAAS;AAAA;AAAA,EAC3C;AAEJ;;;ACpDA,YAAY,WAAW;AA6CjB,SAEI,OAAAE,MAFJ;AA3CN,IAAMC,MAAK,IAAI,YACb,QAAQ,OAAO,OAAO,EAAE,KAAK,GAAG;AAmBlC,IAAM,mBAAmD;AAAA,EACvD,QACE;AAAA,EACF,OACE;AAAA,EACF,OACE;AAAA,EACF,UACE;AACJ;AAEA,IAAM,mBAAmD;AAAA,EACvD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,IAAM,aAAmB;AAAA,EAC9B,CACE,EAAE,WAAW,OAAO,SAAS,YAAY,MAAM,OAAO,MAAM,MAAM,GAAG,MAAM,GAC3E,QACG;AACH,WACE,qBAAC,SAAI,WAAU,mBACZ;AAAA,cACC,gBAAAD,KAAC,SAAI,WAAU,0DACZ,gBACH;AAAA,MAEF,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAWC;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,iBAAiB,SAAS;AAAA,YAC1B,iBAAiB,IAAI;AAAA,YACrB,OAAO,mDAAmD;AAAA,YAC1D,OAAO,UAAU;AAAA,YACjB;AAAA,UACF;AAAA,UACA,OAAO;AAAA,YACL,gBAAgB,SAAS,WAAW,yBACpB,SAAS,UAAU,yBACnB,SAAS,aAAa,0BACtB;AAAA,UAClB;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA,OACF;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;","names":["cn","jsx","cn","jsx","cn"]}
+{"version":3,"sources":["../src/utils/cn.ts","../src/components/craft-button.tsx","../src/components/glass-card.tsx","../src/components/craft-input.tsx","../src/theme/theme-context.tsx","../src/components/theme-switcher.tsx"],"sourcesContent":["export function cn(...values: Array<string | false | null | undefined>): string {\n  return values.filter(Boolean).join(\" \");\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\n\ntype CraftButtonVariant = \"solid\" | \"ghost\" | \"outline\" | \"gradient\";\ntype CraftButtonSize = \"sm\" | \"md\" | \"lg\";\n\nexport type CraftButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n  variant?: CraftButtonVariant;\n  size?: CraftButtonSize;\n  glow?: boolean;\n  tone?: ThemeName;\n};\n\nconst sizeClasses: Record<CraftButtonSize, string> = {\n  sm: \"h-9 px-4 text-xs\",\n  md: \"h-11 px-6 text-sm\",\n  lg: \"h-13 px-8 text-base\",\n};\n\nconst variantClasses: Record<CraftButtonVariant, string> = {\n  solid:\n    \"bg-gradient-to-br from-[rgb(var(--nc-accent-1))] via-[rgb(var(--nc-accent-2))] to-[rgb(var(--nc-accent-3))] text-white shadow-[0_12px_30px_rgb(var(--nc-accent-1)/0.45)] hover:shadow-[0_16px_36px_rgb(var(--nc-accent-1)/0.6)] hover:scale-[1.02] active:scale-[0.98]\",\n  ghost:\n    \"bg-white/5 text-white hover:bg-white/10 backdrop-blur-sm border border-white/10 hover:border-white/20\",\n  outline:\n    \"bg-transparent text-[color:rgb(var(--nc-accent-1))] border-2 border-[color:rgb(var(--nc-accent-1)/0.5)] hover:border-[color:rgb(var(--nc-accent-1))] hover:bg-[color:rgb(var(--nc-accent-1)/0.1)]\",\n  gradient:\n    \"bg-gradient-to-r from-[rgb(var(--nc-accent-1))] via-[rgb(var(--nc-accent-2))] to-[rgb(var(--nc-accent-3))] text-white shadow-[0_12px_30px_rgb(var(--nc-accent-2)/0.45)] hover:shadow-[0_16px_36px_rgb(var(--nc-accent-2)/0.6)] hover:scale-[1.02] active:scale-[0.98]\",\n};\n\nexport function CraftButton({\n  className,\n  variant = \"solid\",\n  size = \"md\",\n  glow = true,\n  tone,\n  disabled,\n  ...props\n}: CraftButtonProps) {\n  return (\n    <button\n      className={cn(\n        \"relative inline-flex items-center justify-center gap-2 rounded-xl font-semibold tracking-wide transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[rgb(var(--nc-accent-1)/0.6)] focus-visible:ring-offset-2 focus-visible:ring-offset-slate-900 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100\",\n        sizeClasses[size],\n        variantClasses[variant],\n        glow && (variant === \"solid\" || variant === \"gradient\")\n          ? \"before:absolute before:-inset-1 before:rounded-xl before:bg-linear-to-r before:from-[rgb(var(--nc-accent-1)/0.2)] before:via-[rgb(var(--nc-accent-2)/0.2)] before:to-[rgb(var(--nc-accent-3)/0.2)] before:blur-xl before:-z-10 before:opacity-0 hover:before:opacity-100 before:transition-opacity\"\n          : \"\",\n        className\n      )}\n      data-nc-theme={tone}\n      disabled={disabled}\n      {...props}\n    />\n  );\n}\n","import { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\n\nexport type GlassCardProps = React.HTMLAttributes<HTMLDivElement> & {\n  tone?: ThemeName;\n  intensity?: \"subtle\" | \"medium\" | \"strong\";\n  bordered?: boolean;\n};\n\nconst intensityClasses: Record<NonNullable<GlassCardProps[\"intensity\"]>, string> = {\n  subtle: \"backdrop-blur-md bg-opacity-50\",\n  medium: \"backdrop-blur-xl bg-opacity-70\",\n  strong: \"backdrop-blur-2xl bg-opacity-90\",\n};\n\nexport function GlassCard({\n  className,\n  tone,\n  intensity = \"medium\",\n  bordered = true,\n  children,\n  ...props\n}: GlassCardProps) {\n  return (\n    <div\n      className={cn(\n        \"relative overflow-hidden rounded-3xl p-6 text-white\",\n        \"shadow-[0_8px_32px_rgba(0,0,0,0.3)]\",\n        \"transition-all duration-300\",\n        \"hover:shadow-[0_8px_40px_rgba(0,0,0,0.4)]\",\n        intensityClasses[intensity],\n        \"bg-linear-to-br from-[rgb(var(--nc-accent-1)/0.15)] via-[rgb(var(--nc-accent-2)/0.10)] to-[rgb(var(--nc-accent-3)/0.15)]\",\n        \"border-[rgb(var(--nc-accent-1)/0.3)]\",\n        bordered ? \"border-2\" : \"border-0\",\n        \"before:absolute before:inset-0 before:bg-linear-to-br before:from-white/10 before:to-transparent before:opacity-0 hover:before:opacity-100 before:transition-opacity before:duration-300\",\n        className\n      )}\n      data-nc-theme={tone}\n      {...props}\n    >\n      <div className=\"relative z-10\">{children}</div>\n    </div>\n  );\n}\n","\nimport * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\n\n// ============================================================================\n// CRAFT INPUT\n// ============================================================================\n\ntype CraftInputSize = \"sm\" | \"md\" | \"lg\";\n\nexport type CraftInputProps = Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  \"size\"\n> & {\n  tone?: ThemeName;\n  inputSize?: CraftInputSize;\n  glow?: boolean;\n  icon?: React.ReactNode;\n};\n\nconst inputSizeClasses: Record<CraftInputSize, string> = {\n  sm: \"h-10 px-4 text-sm\",\n  md: \"h-12 px-5 text-base\",\n  lg: \"h-14 px-6 text-lg\",\n};\n\nexport const CraftInput = React.forwardRef<HTMLInputElement, CraftInputProps>(\n  (\n    { className, tone, inputSize = \"md\", glow = true, icon, ...props },\n    ref\n  ) => {\n    return (\n      <div className=\"relative w-full\" data-nc-theme={tone}>\n        {icon && (\n          <div className=\"absolute left-4 top-1/2 -translate-y-1/2 text-white/50\">\n            {icon}\n          </div>\n        )}\n        <input\n          ref={ref}\n          className={cn(\n            \"w-full rounded-2xl border-2 bg-white/5 text-white backdrop-blur-xl\",\n            \"shadow-[inset_0_2px_8px_rgba(0,0,0,0.3)]\",\n            \"focus:outline-none focus:ring-4\",\n            \"transition-all duration-300\",\n            \"disabled:opacity-50 disabled:cursor-not-allowed\",\n            inputSizeClasses[inputSize],\n            \"border-[rgb(var(--nc-accent-1)/0.3)]\",\n            \"focus:border-[rgb(var(--nc-accent-1)/0.8)] focus:ring-[rgb(var(--nc-accent-1)/0.3)]\",\n            \"placeholder:text-[rgb(var(--nc-accent-soft)/0.4)]\",\n            glow ? \"focus:shadow-[0_0_30px_-5px_var(--glow-color)]\" : \"\",\n            icon ? \"pl-12\" : \"\",\n            className\n          )}\n          style={{\n            \"--glow-color\": \"rgb(var(--nc-accent-1) / 0.5)\",\n          } as React.CSSProperties}\n          {...props}\n        />\n      </div>\n    );\n  }\n);\n\nCraftInput.displayName = \"CraftInput\";\n","\"use client\";\n\nimport * as React from \"react\";\n\nexport type ThemeName = \"aurora\" | \"ember\" | \"ocean\" | \"midnight\" | \"cosmic\";\nexport type ThemeMode = \"light\" | \"dark\" | \"system\";\n\nexport const THEME_NAMES: ThemeName[] = [\n  \"aurora\",\n  \"ember\",\n  \"ocean\",\n  \"midnight\",\n  \"cosmic\",\n];\n\ntype ThemeContextValue = {\n  theme: ThemeName;\n  mode: ThemeMode;\n  setTheme: (theme: ThemeName) => void;\n  setMode: (mode: ThemeMode) => void;\n};\n\nconst ThemeContext = React.createContext<ThemeContextValue | null>(null);\n\ntype ThemeProviderProps = {\n  children: React.ReactNode;\n  defaultTheme?: ThemeName;\n  defaultMode?: ThemeMode;\n  storageKeyTheme?: string;\n  storageKeyMode?: string;\n};\n\nconst DEFAULT_THEME_KEY = \"nextcraft-theme\";\nconst DEFAULT_MODE_KEY = \"nextcraft-mode\";\n\nexport function ThemeProvider({\n  children,\n  defaultTheme = \"ocean\",\n  defaultMode = \"system\",\n  storageKeyTheme = DEFAULT_THEME_KEY,\n  storageKeyMode = DEFAULT_MODE_KEY,\n}: ThemeProviderProps) {\n  const [theme, setTheme] = React.useState<ThemeName>(defaultTheme);\n  const [mode, setMode] = React.useState<ThemeMode>(defaultMode);\n\n  React.useEffect(() => {\n    if (typeof window === \"undefined\") return;\n    try {\n      const storedTheme = window.localStorage.getItem(storageKeyTheme) as ThemeName | null;\n      const storedMode = window.localStorage.getItem(storageKeyMode) as ThemeMode | null;\n      if (storedTheme) setTheme(storedTheme);\n      if (storedMode) setMode(storedMode);\n    } catch {\n      // Ignore storage errors.\n    }\n  }, [storageKeyTheme, storageKeyMode]);\n\n  React.useEffect(() => {\n    if (typeof window === \"undefined\") return;\n    try {\n      window.localStorage.setItem(storageKeyTheme, theme);\n      window.localStorage.setItem(storageKeyMode, mode);\n    } catch {\n      // Ignore storage errors.\n    }\n  }, [theme, mode, storageKeyTheme, storageKeyMode]);\n\n  React.useEffect(() => {\n    if (typeof document === \"undefined\") return;\n    const root = document.documentElement;\n    root.dataset.ncTheme = theme;\n\n    if (mode !== \"system\") {\n      root.dataset.ncMode = mode;\n      return;\n    }\n\n    const mediaQuery = window.matchMedia(\"(prefers-color-scheme: dark)\");\n    const applySystem = () => {\n      root.dataset.ncMode = mediaQuery.matches ? \"dark\" : \"light\";\n    };\n\n    applySystem();\n\n    if (typeof mediaQuery.addEventListener === \"function\") {\n      mediaQuery.addEventListener(\"change\", applySystem);\n      return () => mediaQuery.removeEventListener(\"change\", applySystem);\n    }\n\n    mediaQuery.addListener(applySystem);\n    return () => mediaQuery.removeListener(applySystem);\n  }, [theme, mode]);\n\n  const value = React.useMemo(\n    () => ({ theme, mode, setTheme, setMode }),\n    [theme, mode]\n  );\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;\n}\n\nexport function useTheme() {\n  const context = React.useContext(ThemeContext);\n  if (!context) {\n    throw new Error(\"useTheme must be used within ThemeProvider\");\n  }\n  return context;\n}\n","\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport { THEME_NAMES, type ThemeMode, type ThemeName, useTheme } from \"@/theme/theme-context\";\n\nconst MODE_OPTIONS: ThemeMode[] = [\"system\", \"light\", \"dark\"];\n\nexport type ThemeSwitcherProps = React.HTMLAttributes<HTMLDivElement> & {\n  showLabels?: boolean;\n};\n\nexport function ThemeSwitcher({ className, showLabels = true, ...props }: ThemeSwitcherProps) {\n  const { theme, mode, setTheme, setMode } = useTheme();\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-wrap items-center gap-3 rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white shadow-[inset_0_1px_0_rgba(255,255,255,0.06)]\",\n        className\n      )}\n      {...props}\n    >\n      <label className=\"flex items-center gap-2\">\n        {showLabels && <span className=\"text-white/70\">Theme</span>}\n        <select\n          className=\"rounded-lg border border-white/10 bg-white/10 px-3 py-1 text-white outline-none focus:ring-2 focus:ring-[rgb(var(--nc-accent-1)/0.5)]\"\n          value={theme}\n          onChange={(event) => setTheme(event.target.value as ThemeName)}\n        >\n          {THEME_NAMES.map((name) => (\n            <option key={name} value={name} className=\"text-slate-900\">\n              {name}\n            </option>\n          ))}\n        </select>\n      </label>\n      <label className=\"flex items-center gap-2\">\n        {showLabels && <span className=\"text-white/70\">Mode</span>}\n        <select\n          className=\"rounded-lg border border-white/10 bg-white/10 px-3 py-1 text-white outline-none focus:ring-2 focus:ring-[rgb(var(--nc-accent-1)/0.5)]\"\n          value={mode}\n          onChange={(event) => setMode(event.target.value as ThemeMode)}\n        >\n          {MODE_OPTIONS.map((value) => (\n            <option key={value} value={value} className=\"text-slate-900\">\n              {value}\n            </option>\n          ))}\n        </select>\n      </label>\n    </div>\n  );\n}\n"],"mappings":"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","names":["jsx","jsx","React","jsx","jsx","jsxs"]}