@vadimcomanescu/nadicode-design-system 2.0.0

package/dist/chunk-DF47R6LN.js

@@ -0,0 +1,347 @@
+// src/lib/shader-presets.ts
+var PALETTE = {
+  "arctic-light": {
+    bg: "#f7f7f8",
+    c1: "#fbf4e0",
+    c2: "#dee1e3",
+    c3: "#f5e8c0",
+    c4: "#ecedee",
+    accent: "#8a5e08"
+  },
+  "arctic-dark": {
+    bg: "#101114",
+    c1: "#141009",
+    c2: "#202328",
+    c3: "#211a0c",
+    c4: "#16191d",
+    accent: "#e8a020"
+  },
+  bloom: {
+    bg: "#fefdfb",
+    c1: "#fff1ee",
+    c2: "#f5f1ec",
+    c3: "#ffe0d9",
+    c4: "#fbf9f6",
+    accent: "#e85739"
+  }
+};
+var SPEED = {
+  hero: 0.4,
+  section: 0.25,
+  ambient: 0.15,
+  card: 0.1
+};
+function colorsForIntent(p, intent) {
+  switch (intent) {
+    case "ambient":
+      return [p.c1, p.c2];
+    case "card":
+      return [p.c1, p.c2, p.c3];
+    case "section":
+      return [p.c1, p.c2, p.c3, p.c4];
+    case "hero":
+      return [p.c1, p.c2, p.c3, p.c4, p.accent];
+  }
+}
+function dualColors(p, intent) {
+  return {
+    colorFront: intent === "hero" ? p.accent : p.c3,
+    colorBack: p.bg
+  };
+}
+function triColors(p, intent) {
+  return {
+    colorFront: intent === "hero" ? p.accent : p.c3,
+    colorMid: p.c1,
+    colorBack: p.bg
+  };
+}
+var builders = {
+  meshGradient: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      distortion: 0.4,
+      swirl: 0.1,
+      grainMixer: 0,
+      grainOverlay: 0
+    };
+  },
+  smokeRing: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      thickness: 0.6,
+      radius: 0.5,
+      innerShape: 1,
+      noiseIterations: 4,
+      noiseScale: 1.5
+    };
+  },
+  neuroNoise: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      ...triColors(p, intent),
+      speed: SPEED[intent],
+      brightness: intent === "hero" ? 0.6 : 0.4,
+      contrast: 0.5
+    };
+  },
+  dotOrbit: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      size: 0.5,
+      sizeRange: 0.3,
+      spreading: 0.4,
+      stepsPerColor: 2
+    };
+  },
+  dotGrid: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colorFill: intent === "hero" ? p.accent : p.c1,
+      colorStroke: p.c2,
+      size: 8,
+      gapX: 30,
+      gapY: 30,
+      strokeWidth: 1,
+      sizeRange: 0.2,
+      opacityRange: 0.3,
+      shape: "circle"
+    };
+  },
+  simplexNoise: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      stepsPerColor: 3,
+      softness: 0.7
+    };
+  },
+  metaballs: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      count: intent === "hero" ? 8 : 5,
+      size: 0.6
+    };
+  },
+  waves: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      ...dualColors(p, intent),
+      shape: 1,
+      frequency: 1,
+      amplitude: 0.5,
+      spacing: 0.5,
+      proportion: 0.5,
+      softness: 0.8
+    };
+  },
+  perlinNoise: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      ...dualColors(p, intent),
+      speed: SPEED[intent],
+      proportion: 0.5,
+      softness: 0.6,
+      octaveCount: 4,
+      persistence: 0.5,
+      lacunarity: 2
+    };
+  },
+  voronoi: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      stepsPerColor: 2,
+      colorGap: p.bg,
+      colorGlow: p.c1,
+      distortion: 0.15,
+      gap: 0.02,
+      glow: 0.3
+    };
+  },
+  warp: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      proportion: 0.5,
+      softness: 0.7,
+      shape: "stripes",
+      shapeScale: 0.5,
+      distortion: 0.3,
+      swirl: 0.2,
+      swirlIterations: 5
+    };
+  },
+  godRays: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colorBloom: p.c1,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      spotty: 0.3,
+      midSize: 0.4,
+      midIntensity: 0.5,
+      density: 0.5,
+      intensity: intent === "hero" ? 0.6 : 0.3,
+      bloom: 0.3
+    };
+  },
+  spiral: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      ...dualColors(p, intent),
+      speed: SPEED[intent],
+      density: 0.3,
+      distortion: 0.2,
+      strokeWidth: 0.3,
+      strokeTaper: 0.3,
+      strokeCap: 0.2,
+      noise: 0.1,
+      noiseFrequency: 0.3,
+      softness: 0.6
+    };
+  },
+  swirl: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      bandCount: 4,
+      twist: 0.5,
+      center: 0.5,
+      proportion: 0.5,
+      softness: 0.7,
+      noiseFrequency: 0.3,
+      noise: 0.2
+    };
+  },
+  dithering: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      ...dualColors(p, intent),
+      speed: SPEED[intent],
+      shape: "simplex",
+      type: "4x4",
+      size: 4
+    };
+  },
+  grainGradient: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      softness: 0.7,
+      intensity: 0.5,
+      noise: 0.3,
+      shape: "wave"
+    };
+  },
+  pulsingBorder: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      roundness: 0.5,
+      thickness: 0.15,
+      softness: 0.6,
+      intensity: intent === "hero" ? 0.7 : 0.4,
+      bloom: 0.2,
+      spots: 3,
+      spotSize: 0.3,
+      pulse: 0.5,
+      smoke: 0.3,
+      smokeSize: 0.5
+    };
+  },
+  colorPanels: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colors: colorsForIntent(p, intent),
+      colorBack: p.bg,
+      speed: SPEED[intent],
+      angle1: 30,
+      angle2: 60,
+      length: 0.5,
+      edges: false,
+      blur: 0.5,
+      fadeIn: 0.3,
+      fadeOut: 0.3,
+      density: 0.5,
+      gradient: 0.5
+    };
+  },
+  staticMeshGradient: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      positions: 0.5,
+      waveX: 0.3,
+      waveXShift: 0,
+      waveY: 0.3,
+      waveYShift: 0,
+      mixing: 0.5,
+      grainMixer: 0,
+      grainOverlay: 0
+    };
+  },
+  staticRadialGradient: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colors: colorsForIntent(p, intent),
+      speed: SPEED[intent],
+      radius: 0.8,
+      focalDistance: 0.3,
+      focalAngle: 0,
+      falloff: 0.5,
+      mixing: 0.5,
+      distortion: 0.1,
+      distortionShift: 0,
+      distortionFreq: 0.5,
+      grainMixer: 0,
+      grainOverlay: 0
+    };
+  },
+  liquidMetal: (theme, intent) => {
+    const p = PALETTE[theme];
+    return {
+      colorBack: p.bg,
+      colorTint: intent === "hero" ? p.accent : p.c1,
+      speed: SPEED[intent],
+      repetition: 3,
+      shiftRed: 0,
+      shiftBlue: 0,
+      contour: 0.5,
+      softness: 0.5,
+      distortion: 0.3,
+      angle: 0,
+      shape: "metaballs"
+    };
+  }
+};
+var SHADER_NAMES = Object.keys(builders);
+function getShaderPreset(shader, theme, intent = "hero") {
+  return builders[shader](theme, intent);
+}
+
+export { SHADER_NAMES, getShaderPreset };

package/dist/chunk-DFPXK2JO.js

@@ -0,0 +1,71 @@
+import { Badge } from './chunk-S4JAHKOP.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var lineTypeStyles = {
+  add: "bg-success/10 text-text-primary",
+  remove: "bg-destructive/10 text-text-primary",
+  context: "text-text-secondary"
+};
+var linePrefix = {
+  add: "+",
+  remove: "-",
+  context: " "
+};
+function CodeDiffViewer({ className, filePath, language, hunks, onAccept, onReject, ref, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn("surface-solid rounded-lg overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between gap-2 px-4 py-2 border-b border-border/50", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-sm font-mono text-text-primary truncate", children: filePath }),
+          !!language && /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-[10px] px-1.5 py-0 shrink-0", children: language })
+        ] }) }),
+        hunks.map((hunk, hunkIdx) => /* @__PURE__ */ jsxs("div", { className: "border-b border-border/30 last:border-b-0", children: [
+          /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: hunk.changes.map((change, changeIdx) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "flex font-mono text-xs leading-6",
+                lineTypeStyles[change.type]
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "w-12 shrink-0 text-right pr-2 text-text-tertiary select-none border-r border-border/30", children: change.lineNumber ?? "" }),
+                /* @__PURE__ */ jsx("span", { className: "w-5 shrink-0 text-center select-none text-text-tertiary", children: linePrefix[change.type] }),
+                /* @__PURE__ */ jsx("span", { className: "flex-1 pr-4 whitespace-pre", children: change.content })
+              ]
+            },
+            changeIdx
+          )) }),
+          (onAccept || onReject) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-4 py-1.5 bg-surface/30 border-t border-border/30", children: [
+            !!onAccept && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => onAccept(hunkIdx),
+                className: "text-xs font-medium text-success hover:text-success/80 transition-colors",
+                "aria-label": `Accept hunk ${hunkIdx + 1}`,
+                children: "Accept"
+              }
+            ),
+            !!onReject && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => onReject(hunkIdx),
+                className: "text-xs font-medium text-destructive hover:text-destructive/80 transition-colors",
+                "aria-label": `Reject hunk ${hunkIdx + 1}`,
+                children: "Reject"
+              }
+            )
+          ] })
+        ] }, hunkIdx))
+      ]
+    }
+  );
+}
+
+export { CodeDiffViewer };

package/dist/chunk-DJTF3XFB.js

@@ -0,0 +1,86 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/ui/BrandIcons.tsx
+var GoogleIcon = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    viewBox: "0 0 24 24",
+    width: "24",
+    height: "24",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z",
+          fill: "#4285F4"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z",
+          fill: "#34A853"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l3.66-2.84z",
+          fill: "#FBBC05"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M12 5.38c1.62 0 3.06.56 4.21 1.66l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z",
+          fill: "#EA4335"
+        }
+      )
+    ]
+  }
+);
+var MicrosoftIcon = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    viewBox: "0 0 23 23",
+    width: "23",
+    height: "23",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("path", { fill: "#f3f3f3", d: "M0 0h23v23H0z" }),
+      /* @__PURE__ */ jsx("path", { fill: "#f35325", d: "M1 1h10v10H1z" }),
+      /* @__PURE__ */ jsx("path", { fill: "#81bc06", d: "M12 1h10v10H12z" }),
+      /* @__PURE__ */ jsx("path", { fill: "#05a6f0", d: "M1 12h10v10H1z" }),
+      /* @__PURE__ */ jsx("path", { fill: "#ffba08", d: "M12 12h10v10H12z" })
+    ]
+  }
+);
+var GitHubIcon = (props) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    viewBox: "0 0 24 24",
+    width: "24",
+    height: "24",
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "currentColor",
+    ...props,
+    children: /* @__PURE__ */ jsx("path", { d: "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.43.372.823 1.102.823 2.222 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" })
+  }
+);
+var AppleIcon = (props) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    viewBox: "0 0 24 24",
+    width: "24",
+    height: "24",
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "currentColor",
+    ...props,
+    children: /* @__PURE__ */ jsx("path", { d: "M17.05 20.28c-.98.95-2.05 1.72-3.33 1.72-1.25 0-1.64-.75-3.1-.75s-1.92.73-3.08.73c-1.13 0-2.27-.88-3.28-1.93-2.01-2.1-3.52-5.91-3.52-9.15 0-5.18 3.32-7.91 6.47-7.91 1.67 0 2.65.65 3.65.65s1.95-.65 3.52-.65c1.37 0 3.23.47 4.5 2.11-3.08 2.08-2.6 6.32.22 7.55-1.07 1.92-2.33 3.75-3.05 4.63zm-3.8-17.75c.03-.43.05-.87.05-1.3 0-1.12-.22-2.18-.62-3.1.9.15 1.72.75 2.37 1.5.65.75 1.08 1.83 1.08 3.12l-.02.32c-.93 0-1.85-.4-2.48-1.07-.4-.43-.38-.97-.38-1.47z" })
+  }
+);
+
+export { AppleIcon, GitHubIcon, GoogleIcon, MicrosoftIcon };

package/dist/chunk-DQPK2XRL.js

@@ -0,0 +1,66 @@
+import { useStyleMotion, m } from './chunk-PD2YEH3H.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { useInView, useReducedMotion } from 'motion/react';
+import { useRef, Children } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+function StaggerChildren({
+  children,
+  className,
+  staggerMs = 80,
+  direction = "up",
+  distance,
+  once = true
+}) {
+  const ref = useRef(null);
+  const isInView = useInView(ref, { once, margin: "-40px" });
+  const shouldReduceMotion = useReducedMotion();
+  const { spring, distance: styleDistance } = useStyleMotion();
+  const d = distance ?? styleDistance.md;
+  const getOffset = () => {
+    switch (direction) {
+      case "up":
+        return { y: d };
+      case "down":
+        return { y: -d };
+      case "left":
+        return { x: d };
+      case "right":
+        return { x: -d };
+    }
+  };
+  if (shouldReduceMotion) {
+    return /* @__PURE__ */ jsx("div", { className, children });
+  }
+  return /* @__PURE__ */ jsx(
+    m.div,
+    {
+      ref,
+      className: cn(className),
+      initial: "hidden",
+      animate: isInView ? "visible" : "hidden",
+      variants: {
+        visible: { transition: { staggerChildren: staggerMs / 1e3 } },
+        hidden: {}
+      },
+      children: Children.map(children, (child) => /* @__PURE__ */ jsx(
+        m.div,
+        {
+          className: "h-full",
+          variants: {
+            hidden: { opacity: 0, ...getOffset() },
+            visible: {
+              opacity: 1,
+              x: 0,
+              y: 0,
+              transition: spring.snappy
+            }
+          },
+          children: child
+        }
+      ))
+    }
+  );
+}
+
+export { StaggerChildren };

package/dist/chunk-DT6DGTVW.js

@@ -0,0 +1,41 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/logos/Replit.tsx
+function Replit(props) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "1em",
+      height: "1em",
+      viewBox: "0 0 20 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M0 1.5C0 0.671573 0.671573 0 1.5 0H8.5C9.32843 0 10 0.671573 10 1.5V8H1.5C0.671573 8 0 7.32843 0 6.5V1.5Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M10 8H18.5C19.3284 8 20 8.67157 20 9.5V14.5C20 15.3284 19.3284 16 18.5 16H10V8Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M0 17.5C0 16.6716 0.671573 16 1.5 16H10V22.5C10 23.3284 9.32843 24 8.5 24H1.5C0.671573 24 0 23.3284 0 22.5V17.5Z",
+            fill: "currentColor"
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { Replit };

package/dist/chunk-E7RBK6ML.js

@@ -0,0 +1,44 @@
+import { useAnimatedIcon } from './chunk-ASKFAYYR.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { useAnimation, motion } from 'motion/react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function PlusIcon({
+  onMouseEnter,
+  onMouseLeave,
+  className,
+  size = 28,
+  ref,
+  ...props
+}) {
+  const controls = useAnimation();
+  const { handleMouseEnter, handleMouseLeave } = useAnimatedIcon(ref, {
+    onMouseEnter,
+    onMouseLeave,
+    animate: () => controls.start("animate"),
+    reset: () => controls.start("normal")
+  });
+  return /* @__PURE__ */ jsx("div", { className: cn(className), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, ...props, children: /* @__PURE__ */ jsxs(
+    motion.svg,
+    {
+      animate: controls,
+      fill: "none",
+      height: size,
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "2",
+      transition: { type: "spring", stiffness: 100, damping: 15 },
+      variants: { normal: { rotate: 0 }, animate: { rotate: 180 } },
+      viewBox: "0 0 24 24",
+      width: size,
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M5 12h14" }),
+        /* @__PURE__ */ jsx("path", { d: "M12 5v14" })
+      ]
+    }
+  ) });
+}
+
+export { PlusIcon };