@snow-labs/brutal-ui 0.1.1 → 0.2.1

package/dist/index.js

@@ -2,7 +2,7 @@
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Accordion as Accordion$1 } from '@base-ui/react/accordion';
-import { ChevronDownIcon, ChevronUpIcon, ChevronRightIcon, MoreHorizontalIcon, CheckIcon, XIcon, SearchIcon, ChevronLeftIcon } from 'lucide-react';
+import { ChevronDownIcon, ChevronUpIcon, ChevronRightIcon, MoreHorizontalIcon, CheckIcon, XIcon, SearchIcon, ChevronLeftIcon, Menu as Menu$1 } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { cva } from 'class-variance-authority';
 import { Avatar as Avatar$1 } from '@base-ui/react/avatar';
@@ -28,12 +28,15 @@ import { ScrollArea as ScrollArea$1 } from '@base-ui/react/scroll-area';
 import { Select as Select$1 } from '@base-ui/react/select';
 import { Separator as Separator$1 } from '@base-ui/react/separator';
 import * as React2 from 'react';
+import { createContext, useContext, useState, useEffect, useRef, useCallback } from 'react';
 import { Slider as Slider$1 } from '@base-ui/react/slider';
 import { Switch as Switch$1 } from '@base-ui/react/switch';
 import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
 import { Toggle as Toggle$1 } from '@base-ui/react/toggle';
 import { ToggleGroup as ToggleGroup$1 } from '@base-ui/react/toggle-group';
 import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
+import { useReactTable, getPaginationRowModel, getFilteredRowModel, getSortedRowModel, getCoreRowModel, flexRender } from '@tanstack/react-table';
+import { dropTargetForElements, draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 
 // src/lib/utils.ts
 function cn(...inputs) {
@@ -2853,13 +2856,50 @@ function TooltipContent({
     }
   ) });
 }
+
+// src/lib/animations.ts
+var fadeInUp = {
+  hidden: { opacity: 0, y: 20 },
+  visible: { opacity: 1, y: 0 }
+};
+var fadeIn = {
+  hidden: { opacity: 0 },
+  visible: { opacity: 1 }
+};
+var staggerContainer = {
+  hidden: {},
+  visible: {
+    transition: {
+      staggerChildren: 0.08,
+      delayChildren: 0.1
+    }
+  }
+};
+var scaleIn = {
+  hidden: { opacity: 0, scale: 0.95 },
+  visible: { opacity: 1, scale: 1 }
+};
+var slideInLeft = {
+  hidden: { opacity: 0, x: -30 },
+  visible: { opacity: 1, x: 0 }
+};
+var slideInRight = {
+  hidden: { opacity: 0, x: 30 },
+  visible: { opacity: 1, x: 0 }
+};
+var defaultTransition = {
+  duration: 0.5,
+  ease: [0.25, 0.1, 0.25, 1]
+};
+var springTransition = {
+  type: "spring",
+  stiffness: 300,
+  damping: 30
+};
 var colorMap = {
   white: "bg-background text-foreground",
   brand: "bg-brand",
   "brand-muted": "bg-brand-muted text-foreground",
-  blue: "bg-section-blue",
-  gray: "bg-section-gray text-foreground",
-  cream: "bg-section-cream text-foreground",
   black: "bg-foreground text-background",
   cta: "bg-cta"
 };
@@ -2873,16 +2913,28 @@ var paddingMap = {
   default: "brutal-section",
   lg: "brutal-section py-28 sm:py-36 md:py-44"
 };
+var patternMap = {
+  dots: "brutal-dots",
+  stripes: "brutal-stripes",
+  noise: "brutal-noise",
+  grain: "brutal-grain",
+  crosshatch: "brutal-crosshatch",
+  "grid-dots": "brutal-grid-dots",
+  "gradient-mesh": "brutal-gradient-mesh",
+  none: ""
+};
 function BrutalSection({
   children,
   color = "white",
   className,
   containerSize = "default",
   padding = "default",
+  pattern,
   dots = false,
   stripes = false,
   id
 }) {
+  const resolvedPattern = pattern ?? (dots ? "dots" : void 0) ?? (stripes ? "stripes" : void 0) ?? "none";
   return /* @__PURE__ */ jsx(
     "section",
     {
@@ -2890,82 +2942,141 @@ function BrutalSection({
       className: cn(
         paddingMap[padding],
         colorMap[color],
-        dots && "brutal-dots",
-        stripes && "brutal-stripes",
+        patternMap[resolvedPattern],
         className
       ),
       children: /* @__PURE__ */ jsx("div", { className: containerMap[containerSize], children })
     }
   );
 }
+var paths = {
+  wave: "M0,64 C160,128 320,0 480,64 C640,128 800,0 960,64 L960,160 L0,160 Z",
+  jagged: "M0,80 L80,40 L160,80 L240,20 L320,80 L400,40 L480,80 L560,20 L640,80 L720,40 L800,80 L880,20 L960,80 L960,160 L0,160 Z",
+  curve: "M0,128 Q480,-32 960,128 L960,160 L0,160 Z",
+  castle: "M0,80 L0,60 L80,60 L80,80 L120,80 L120,40 L200,40 L200,80 L240,80 L240,60 L320,60 L320,80 L360,80 L360,40 L440,40 L440,80 L480,80 L480,60 L560,60 L560,80 L600,80 L600,40 L680,40 L680,80 L720,80 L720,60 L800,60 L800,80 L840,80 L840,40 L920,40 L920,80 L960,80 L960,160 L0,160 Z",
+  "torn-paper": "M0,70 C30,65 45,85 80,72 C115,59 130,90 170,78 C210,66 225,88 270,75 C315,62 340,92 380,79 C420,66 445,86 490,73 C535,60 560,88 600,76 C640,64 665,90 710,77 C755,64 780,84 830,71 C875,58 900,86 960,80 L960,160 L0,160 Z",
+  "brush-stroke": "M0,90 C80,50 120,100 200,60 C280,20 360,110 480,70 C600,30 640,100 720,80 C800,60 880,100 960,70 L960,160 L0,160 Z",
+  geometric: "M0,100 L120,60 L240,80 L360,40 L480,90 L600,50 L720,70 L840,30 L960,80 L960,160 L0,160 Z",
+  blob: "M0,80 C80,120 160,40 280,80 C400,120 440,30 560,70 C680,110 760,40 960,80 L960,160 L0,160 Z",
+  diagonal: "M0,160 L960,60 L960,160 Z",
+  zigzag: "M0,80 L60,40 L120,80 L180,40 L240,80 L300,40 L360,80 L420,40 L480,80 L540,40 L600,80 L660,40 L720,80 L780,40 L840,80 L900,40 L960,80 L960,160 L0,160 Z",
+  "hand-drawn": "M0,72 C20,68 35,82 60,75 C85,68 95,84 125,76 C155,68 170,85 200,77 C230,69 245,83 275,75 C305,67 320,86 350,78 C380,70 395,82 425,74 C455,66 470,84 500,76 C530,68 545,83 575,75 C605,67 620,85 650,77 C680,69 695,82 725,74 C755,66 770,84 800,76 C830,68 845,83 875,75 C905,67 920,82 960,74 L960,160 L0,160 Z"
+};
+function SectionDivider({
+  from = "hsl(var(--background))",
+  to = "hsl(var(--background))",
+  flip = false,
+  className = "",
+  variant = "wave",
+  layers = false
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("relative -my-px w-full overflow-hidden", className),
+      style: { backgroundColor: from },
+      children: [
+        layers && /* @__PURE__ */ jsx(
+          "svg",
+          {
+            viewBox: "0 0 960 160",
+            preserveAspectRatio: "none",
+            className: "absolute inset-0 block w-full opacity-30",
+            style: {
+              height: "clamp(40px, 6vw, 80px)",
+              transform: flip ? "scaleY(-1) translateY(4px)" : "translateY(-4px)"
+            },
+            children: /* @__PURE__ */ jsx("path", { d: paths[variant], fill: to })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            viewBox: "0 0 960 160",
+            preserveAspectRatio: "none",
+            className: "relative block w-full",
+            style: {
+              height: "clamp(40px, 6vw, 80px)",
+              transform: flip ? "scaleY(-1)" : void 0
+            },
+            children: /* @__PURE__ */ jsx("path", { d: paths[variant], fill: to })
+          }
+        )
+      ]
+    }
+  );
+}
 function BrutalHero({
+  variant = "split",
   badge,
+  badgePosition = "above",
   headline,
   description,
   ctaText,
   ctaHref = "#",
   ctaVariant = "cta",
+  secondaryText,
+  secondaryHref,
   visual,
   color = "brand",
+  pattern,
   proof,
   className
 }) {
-  return /* @__PURE__ */ jsx(BrutalSection, { color, padding: "lg", className, children: /* @__PURE__ */ jsxs(
+  const badgeElement = badge && /* @__PURE__ */ jsx(
     "div",
     {
       className: cn(
-        "grid items-center gap-12",
-        visual ? "lg:grid-cols-2 lg:gap-16" : "max-w-3xl"
+        "inline-flex w-fit border-brutal border-foreground bg-background px-3 py-1 font-mono text-xs font-bold uppercase tracking-widest text-foreground shadow-brutal-sm",
+        badgePosition === "floating" && "absolute -top-3 left-6 z-10"
       ),
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
-          badge && /* @__PURE__ */ jsx("div", { className: "inline-flex w-fit border-brutal border-foreground bg-background px-3 py-1 font-mono text-xs font-bold uppercase tracking-widest shadow-brutal-sm", children: badge }),
-          /* @__PURE__ */ jsx("h1", { className: "brutal-display text-balance", children: headline }),
-          /* @__PURE__ */ jsx("p", { className: "brutal-body-lg max-w-lg opacity-80", children: description }),
-          /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { variant: ctaVariant, size: "xl", render: /* @__PURE__ */ jsx("a", { href: ctaHref }), children: ctaText }) }),
-          proof && /* @__PURE__ */ jsxs("p", { className: "flex items-center gap-2 text-sm font-medium opacity-70", children: [
-            /* @__PURE__ */ jsx("span", { className: "inline-flex size-5 items-center justify-center border border-current text-xs", children: "\u2713" }),
-            proof
-          ] })
-        ] }),
-        visual && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: visual })
-      ]
-    }
-  ) });
-}
-function WaveDivider({
-  from = "hsl(var(--background))",
-  to = "hsl(var(--background))",
-  flip = false,
-  className = "",
-  variant = "wave"
-}) {
-  const paths = {
-    wave: "M0,64 C160,128 320,0 480,64 C640,128 800,0 960,64 L960,160 L0,160 Z",
-    jagged: "M0,80 L80,40 L160,80 L240,20 L320,80 L400,40 L480,80 L560,20 L640,80 L720,40 L800,80 L880,20 L960,80 L960,160 L0,160 Z",
-    curve: "M0,128 Q480,-32 960,128 L960,160 L0,160 Z",
-    castle: "M0,80 L0,60 L80,60 L80,80 L120,80 L120,40 L200,40 L200,80 L240,80 L240,60 L320,60 L320,80 L360,80 L360,40 L440,40 L440,80 L480,80 L480,60 L560,60 L560,80 L600,80 L600,40 L680,40 L680,80 L720,80 L720,60 L800,60 L800,80 L840,80 L840,40 L920,40 L920,80 L960,80 L960,160 L0,160 Z"
-  };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: `relative -my-px w-full overflow-hidden ${className}`,
-      style: { backgroundColor: from },
-      children: /* @__PURE__ */ jsx(
-        "svg",
-        {
-          viewBox: "0 0 960 160",
-          preserveAspectRatio: "none",
-          className: "block w-full",
-          style: {
-            height: "clamp(40px, 6vw, 80px)",
-            transform: flip ? "scaleY(-1)" : void 0
-          },
-          children: /* @__PURE__ */ jsx("path", { d: paths[variant], fill: to })
-        }
-      )
-    }
-  );
+      children: badge
+    }
+  );
+  const textContent = /* @__PURE__ */ jsxs("div", { className: cn(
+    "flex flex-col gap-6",
+    variant === "centered" && "items-center text-center"
+  ), children: [
+    badgePosition === "above" && badgeElement,
+    /* @__PURE__ */ jsxs("h1", { className: cn(
+      "brutal-display text-balance",
+      variant === "centered" && "mx-auto max-w-4xl"
+    ), children: [
+      badgePosition === "inline" && badgeElement,
+      headline
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: cn(
+      "brutal-body-lg max-w-lg opacity-80",
+      variant === "centered" && "mx-auto"
+    ), children: description }),
+    /* @__PURE__ */ jsxs("div", { className: cn(
+      "flex flex-col gap-4 sm:flex-row sm:flex-wrap",
+      variant === "centered" && "sm:justify-center"
+    ), children: [
+      /* @__PURE__ */ jsx(Button, { variant: ctaVariant, size: "xl", className: "w-full sm:w-auto", render: /* @__PURE__ */ jsx("a", { href: ctaHref }), children: ctaText }),
+      secondaryText && /* @__PURE__ */ jsx(Button, { variant: "outline", size: "xl", className: "w-full sm:w-auto", render: /* @__PURE__ */ jsx("a", { href: secondaryHref || "#" }), children: secondaryText })
+    ] }),
+    proof && /* @__PURE__ */ jsxs("p", { className: "flex items-center gap-2 text-sm font-medium opacity-70", children: [
+      /* @__PURE__ */ jsx("span", { className: "inline-flex size-5 items-center justify-center border border-current text-xs", children: "\u2713" }),
+      proof
+    ] })
+  ] });
+  const layoutClass = {
+    split: "grid items-center gap-12 lg:grid-cols-2 lg:gap-16",
+    centered: "flex flex-col items-center gap-12",
+    overlap: "relative",
+    asymmetric: "grid items-center gap-12 lg:grid-cols-[3fr_2fr] lg:gap-16"
+  }[variant];
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, padding: "lg", pattern, className: cn("relative", className), children: [
+    badgePosition === "floating" && badgeElement,
+    /* @__PURE__ */ jsxs("div", { className: layoutClass, children: [
+      textContent,
+      visual && variant === "overlap" ? /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center opacity-20", children: visual }) : visual ? /* @__PURE__ */ jsx("div", { className: cn(
+        "flex items-center justify-center",
+        variant === "asymmetric" && "-rotate-2 transform"
+      ), children: visual }) : null
+    ] })
+  ] });
 }
 var colMap = {
   2: "sm:grid-cols-2",
@@ -2973,6 +3084,7 @@ var colMap = {
   4: "sm:grid-cols-2 lg:grid-cols-4"
 };
 function BrutalFeatureGrid({
+  variant = "icon-top",
   badge,
   headline,
   description,
@@ -2983,57 +3095,196 @@ function BrutalFeatureGrid({
 }) {
   return /* @__PURE__ */ jsxs(BrutalSection, { color, className, children: [
     /* @__PURE__ */ jsxs("div", { className: "mb-12 max-w-2xl", children: [
-      badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 text-muted-foreground", children: badge }),
+      badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 text-brand", children: badge }),
       /* @__PURE__ */ jsx("h2", { className: "brutal-h2 mb-4", children: headline }),
       description && /* @__PURE__ */ jsx("p", { className: "brutal-body text-muted-foreground", children: description })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: cn("grid gap-6", colMap[columns]), children: features.map((feature) => /* @__PURE__ */ jsxs(Card, { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "grid gap-6",
+          variant === "bento" ? "sm:grid-cols-2 lg:grid-cols-3" : colMap[columns]
+        ),
+        children: features.map((feature, i) => /* @__PURE__ */ jsx(
+          FeatureCard,
+          {
+            feature,
+            variant,
+            index: i
+          },
+          feature.title
+        ))
+      }
+    )
+  ] });
+}
+function FeatureCard({
+  feature,
+  variant,
+  index
+}) {
+  const isBentoFeatured = variant === "bento" && feature.featured;
+  if (variant === "icon-left") {
+    return /* @__PURE__ */ jsxs("div", { className: "flex gap-4 border-brutal border-foreground border-l-4 border-l-brand bg-background p-5 shadow-brutal transition-all duration-150 hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg", children: [
+      feature.icon && /* @__PURE__ */ jsx("div", { className: "flex size-12 shrink-0 items-center justify-center border-brutal border-foreground bg-brand-muted text-2xl shadow-brutal-sm", children: feature.icon }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        feature.stat && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-1 text-brand", children: feature.stat }),
+        /* @__PURE__ */ jsx("h3", { className: "brutal-h4 mb-1", children: feature.title }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: feature.description })
+      ] })
+    ] });
+  }
+  if (variant === "numbered") {
+    return /* @__PURE__ */ jsxs(Card, { children: [
       /* @__PURE__ */ jsxs(CardHeader, { children: [
-        feature.icon && /* @__PURE__ */ jsx("div", { className: "mb-2 inline-flex size-12 items-center justify-center border-brutal border-foreground bg-brand-muted text-2xl shadow-brutal-sm", children: feature.icon }),
+        /* @__PURE__ */ jsx("span", { className: "brutal-display mb-2 block text-brand opacity-20", children: String(index + 1).padStart(2, "0") }),
+        feature.stat && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-1 text-brand", children: feature.stat }),
         /* @__PURE__ */ jsx(CardTitle, { children: feature.title })
       ] }),
       /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(CardDescription, { children: feature.description }) })
-    ] }, feature.title)) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      className: cn(
+        isBentoFeatured && "sm:col-span-2 bg-brand-muted"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs(CardHeader, { children: [
+          feature.icon && /* @__PURE__ */ jsx("div", { className: "mb-2 inline-flex size-12 items-center justify-center border-brutal border-foreground border-b-brand bg-brand-muted text-2xl shadow-brutal-sm", children: feature.icon }),
+          feature.stat && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-1 text-brand", children: feature.stat }),
+          /* @__PURE__ */ jsx(CardTitle, { children: feature.title })
+        ] }),
+        /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(CardDescription, { children: feature.description }) })
+      ]
+    }
+  );
+}
+function StarRating({ rating }) {
+  return /* @__PURE__ */ jsx("div", { className: "flex gap-0.5", children: Array.from({ length: 5 }, (_, i) => /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "text-sm",
+        i < rating ? "text-amber-500" : "text-foreground/20"
+      ),
+      children: "\u2605"
+    },
+    i
+  )) });
+}
+function TestimonialCard({
+  t,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "relative break-inside-avoid border-brutal border-foreground bg-background p-5 text-foreground shadow-brutal transition-all duration-150 hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute top-3 right-4 select-none font-serif text-5xl leading-none text-foreground/[0.06]", children: "\u201C" }),
+        t.rating && /* @__PURE__ */ jsx("div", { className: "mb-3", children: /* @__PURE__ */ jsx(StarRating, { rating: t.rating }) }),
+        /* @__PURE__ */ jsx("p", { className: "relative mb-4 text-sm leading-relaxed", children: t.text }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          t.avatar ? /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: t.avatar,
+              alt: t.name,
+              className: "size-9 border-2 object-cover",
+              style: { borderColor: "hsl(var(--brand))" }
+            }
+          ) : /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "flex size-9 items-center justify-center border-2 font-bold text-brand-foreground",
+              style: {
+                borderColor: "hsl(var(--brand))",
+                backgroundColor: "hsl(var(--brand))"
+              },
+              children: t.name[0]
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: t.name }),
+            (t.role || t.company) && /* @__PURE__ */ jsxs("p", { className: "truncate text-xs text-muted-foreground", children: [
+              t.role,
+              t.role && t.company && " \xB7 ",
+              t.company
+            ] }),
+            !t.role && !t.company && t.handle && /* @__PURE__ */ jsx("p", { className: "font-mono text-xs text-muted-foreground", children: t.handle })
+          ] }),
+          t.companyLogo && /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: t.companyLogo,
+              alt: t.company || "",
+              className: "h-5 object-contain opacity-60"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function MasonryLayout({ testimonials }) {
+  return /* @__PURE__ */ jsx("div", { className: "columns-1 gap-6 sm:columns-2 lg:columns-3", children: testimonials.map((t, i) => /* @__PURE__ */ jsx(TestimonialCard, { t, className: "mb-6" }, i)) });
+}
+function FeaturedGridLayout({
+  testimonials
+}) {
+  const featured = testimonials.find((t) => t.featured) || testimonials[0];
+  const rest = testimonials.filter((t) => t !== featured);
+  return /* @__PURE__ */ jsxs("div", { className: "grid gap-6 lg:grid-cols-2", children: [
+    featured && /* @__PURE__ */ jsx(
+      TestimonialCard,
+      {
+        t: featured,
+        className: "flex flex-col justify-between p-8 lg:row-span-2"
+      }
+    ),
+    rest.map((t, i) => /* @__PURE__ */ jsx(TestimonialCard, { t }, i))
+  ] });
+}
+function CarouselLayout({ testimonials }) {
+  return /* @__PURE__ */ jsx("div", { className: "-mx-6 flex snap-x snap-mandatory gap-6 overflow-x-auto px-6 pb-4", children: testimonials.map((t, i) => /* @__PURE__ */ jsx(
+    TestimonialCard,
+    {
+      t,
+      className: "w-80 flex-none snap-center"
+    },
+    i
+  )) });
+}
+function WallOfLoveLayout({ testimonials }) {
+  return /* @__PURE__ */ jsxs("div", { className: "relative max-h-[600px] overflow-hidden", children: [
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4", children: testimonials.map((t, i) => /* @__PURE__ */ jsx(TestimonialCard, { t }, i)) }),
+    /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-32 bg-gradient-to-t from-background to-transparent" })
   ] });
 }
 function BrutalTestimonials({
   badge,
   headline,
   testimonials,
-  color = "blue",
+  variant = "masonry",
+  color = "brand-muted",
+  pattern,
   className
 }) {
-  return /* @__PURE__ */ jsxs(BrutalSection, { color, className, children: [
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, pattern, className, children: [
     (headline || badge) && /* @__PURE__ */ jsxs("div", { className: "mb-12 text-center", children: [
       badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 opacity-70", children: badge }),
       headline && /* @__PURE__ */ jsx("h2", { className: "brutal-h2", children: headline })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "columns-1 gap-6 sm:columns-2 lg:columns-3", children: testimonials.map((t, i) => /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "mb-6 break-inside-avoid border-brutal border-foreground bg-background p-5 text-foreground shadow-brutal transition-all duration-150 hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg"
-        ),
-        children: [
-          /* @__PURE__ */ jsx("p", { className: "mb-4 text-sm leading-relaxed", children: t.text }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-            t.avatar ? /* @__PURE__ */ jsx(
-              "img",
-              {
-                src: t.avatar,
-                alt: t.name,
-                className: "size-9 border-brutal border-foreground object-cover"
-              }
-            ) : /* @__PURE__ */ jsx("div", { className: "flex size-9 items-center justify-center border-brutal border-foreground bg-brand font-bold text-brand-foreground", children: t.name[0] }),
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: t.name }),
-              t.handle && /* @__PURE__ */ jsx("p", { className: "font-mono text-xs text-muted-foreground", children: t.handle })
-            ] })
-          ] })
-        ]
-      },
-      i
-    )) })
+    variant === "masonry" && /* @__PURE__ */ jsx(MasonryLayout, { testimonials }),
+    variant === "featured-grid" && /* @__PURE__ */ jsx(FeaturedGridLayout, { testimonials }),
+    variant === "carousel" && /* @__PURE__ */ jsx(CarouselLayout, { testimonials }),
+    variant === "wall-of-love" && /* @__PURE__ */ jsx(WallOfLoveLayout, { testimonials })
   ] });
 }
 function BrutalIntegrationGrid({
@@ -3074,63 +3325,180 @@ function BrutalIntegrationGrid({
     }) })
   ] });
 }
-function BrutalCTA({
-  headline,
-  description,
+function CTAButtons({
   ctaText,
   ctaHref = "#",
   ctaVariant = "cta",
   secondaryText,
-  secondaryHref,
-  color = "black",
-  className
+  secondaryHref
 }) {
-  return /* @__PURE__ */ jsx(BrutalSection, { color, className, children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-2xl text-center", children: [
-    /* @__PURE__ */ jsx("h2", { className: "brutal-h1 mb-6", children: headline }),
-    description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-8 opacity-80", children: description }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-center gap-4", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:flex-wrap sm:items-center sm:justify-center", children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: ctaVariant,
+        size: "xl",
+        className: "w-full sm:w-auto",
+        render: /* @__PURE__ */ jsx("a", { href: ctaHref }),
+        children: ctaText
+      }
+    ),
+    secondaryText && /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "outline",
+        size: "xl",
+        className: "w-full sm:w-auto",
+        render: /* @__PURE__ */ jsx("a", { href: secondaryHref || "#" }),
+        children: secondaryText
+      }
+    )
+  ] });
+}
+function CenteredCTA(props) {
+  return /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-2xl text-center", children: [
+    /* @__PURE__ */ jsx("h2", { className: "brutal-h1 mb-6", children: props.headline }),
+    props.description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-4 opacity-80", children: props.description }),
+    props.stats && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-8 opacity-60", children: props.stats }),
+    /* @__PURE__ */ jsx(
+      CTAButtons,
+      {
+        ctaText: props.ctaText,
+        ctaHref: props.ctaHref,
+        ctaVariant: props.ctaVariant,
+        secondaryText: props.secondaryText,
+        secondaryHref: props.secondaryHref
+      }
+    )
+  ] });
+}
+function SplitCTA(props) {
+  return /* @__PURE__ */ jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h2", { className: "brutal-h1 mb-6", children: props.headline }),
+      props.description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-4 opacity-80", children: props.description }),
+      props.stats && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-8 opacity-60", children: props.stats }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:flex-wrap", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: props.ctaVariant || "cta",
+            size: "xl",
+            className: "w-full sm:w-auto",
+            render: /* @__PURE__ */ jsx("a", { href: props.ctaHref || "#" }),
+            children: props.ctaText
+          }
+        ),
+        props.secondaryText && /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            size: "xl",
+            className: "w-full sm:w-auto",
+            render: /* @__PURE__ */ jsx("a", { href: props.secondaryHref || "#" }),
+            children: props.secondaryText
+          }
+        )
+      ] })
+    ] }),
+    props.visual && /* @__PURE__ */ jsx("div", { children: props.visual })
+  ] });
+}
+function WithVisualCTA(props) {
+  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+    props.visual && /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center opacity-10", children: props.visual }),
+    /* @__PURE__ */ jsxs("div", { className: "relative mx-auto max-w-2xl text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "brutal-h1 mb-6", children: props.headline }),
+      props.description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-4 opacity-80", children: props.description }),
+      props.stats && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-8 opacity-60", children: props.stats }),
       /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: ctaVariant,
-          size: "xl",
-          render: /* @__PURE__ */ jsx("a", { href: ctaHref }),
-          children: ctaText
-        }
-      ),
-      secondaryText && /* @__PURE__ */ jsx(
-        Button,
+        CTAButtons,
         {
-          variant: "outline",
-          size: "lg",
-          render: /* @__PURE__ */ jsx("a", { href: secondaryHref || "#" }),
-          children: secondaryText
+          ctaText: props.ctaText,
+          ctaHref: props.ctaHref,
+          ctaVariant: props.ctaVariant,
+          secondaryText: props.secondaryText,
+          secondaryHref: props.secondaryHref
         }
       )
     ] })
+  ] });
+}
+function FloatingCardCTA(props) {
+  return /* @__PURE__ */ jsx("div", { className: "relative z-10 -mt-16", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-2xl border-brutal border-foreground bg-background p-8 text-center text-foreground shadow-brutal-lg", children: [
+    /* @__PURE__ */ jsx("h2", { className: "brutal-h1 mb-6", children: props.headline }),
+    props.description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-4 opacity-80", children: props.description }),
+    props.stats && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-8 opacity-60", children: props.stats }),
+    /* @__PURE__ */ jsx(
+      CTAButtons,
+      {
+        ctaText: props.ctaText,
+        ctaHref: props.ctaHref,
+        ctaVariant: props.ctaVariant,
+        secondaryText: props.secondaryText,
+        secondaryHref: props.secondaryHref
+      }
+    )
   ] }) });
 }
+function BrutalCTA({
+  variant = "centered",
+  color = "black",
+  className,
+  pattern,
+  ...props
+}) {
+  if (variant === "floating-card") {
+    return /* @__PURE__ */ jsx("div", { className: cn("brutal-container px-6", className), children: /* @__PURE__ */ jsx(FloatingCardCTA, { ...props, variant, color }) });
+  }
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, pattern, className, children: [
+    variant === "centered" && /* @__PURE__ */ jsx(CenteredCTA, { ...props, variant, color }),
+    variant === "split" && /* @__PURE__ */ jsx(SplitCTA, { ...props, variant, color }),
+    variant === "with-visual" && /* @__PURE__ */ jsx(WithVisualCTA, { ...props, variant, color })
+  ] });
+}
 function BrutalNav({
   logo,
   links,
   ctaText = "Sign In",
   ctaHref = "/admin",
+  variant = "solid",
   className
 }) {
-  return /* @__PURE__ */ jsx(
-    "header",
+  const [mobileOpen, setMobileOpen] = useState(false);
+  const [isScrolled, setIsScrolled] = useState(false);
+  useEffect(() => {
+    if (variant !== "transparent") return;
+    const onScroll = () => setIsScrolled(window.scrollY > 20);
+    onScroll();
+    window.addEventListener("scroll", onScroll, { passive: true });
+    return () => window.removeEventListener("scroll", onScroll);
+  }, [variant]);
+  const variantStyles = {
+    solid: "sticky top-0 z-50 w-full border-b-brutal border-foreground bg-brand",
+    transparent: cn(
+      "fixed top-0 left-0 right-0 z-50 w-full transition-all duration-200",
+      isScrolled ? "bg-background/80 text-foreground backdrop-blur-md border-b border-foreground/10" : "bg-transparent text-white"
+    ),
+    "floating-pill": "fixed top-0 left-0 right-0 z-50 mx-4 mt-4 rounded-full border-brutal border-foreground bg-background shadow-brutal"
+  };
+  return /* @__PURE__ */ jsx("header", { className: cn(variantStyles[variant], className), children: /* @__PURE__ */ jsxs(
+    "div",
     {
       className: cn(
-        "sticky top-0 z-50 w-full border-b-brutal border-foreground bg-brand",
-        className
+        "flex h-14 items-center justify-between px-6",
+        variant === "floating-pill" ? "mx-auto max-w-7xl" : "brutal-container"
       ),
-      children: /* @__PURE__ */ jsxs("div", { className: "brutal-container flex h-14 items-center justify-between px-6", children: [
+      children: [
         /* @__PURE__ */ jsx("a", { href: "/", className: "flex items-center gap-2 text-lg font-black", children: logo }),
         /* @__PURE__ */ jsx("nav", { className: "hidden items-center gap-1 md:flex", children: links.map((link) => /* @__PURE__ */ jsxs(
           "a",
           {
             href: link.href,
-            className: "relative px-3 py-1.5 text-sm font-bold transition-colors hover:opacity-70",
+            className: cn(
+              "relative rounded-md px-3 py-1.5 text-sm font-bold transition-colors hover:opacity-70",
+              link.active && "bg-foreground/10"
+            ),
             children: [
               link.label,
               link.badge && /* @__PURE__ */ jsx("span", { className: "absolute -top-1 -right-1 border border-foreground bg-background px-1 font-mono text-[9px] font-bold uppercase text-foreground", children: link.badge })
@@ -3138,10 +3506,157 @@ function BrutalNav({
           },
           link.href
         )) }),
-        /* @__PURE__ */ jsx(Button, { variant: "nav", size: "sm", render: /* @__PURE__ */ jsx("a", { href: ctaHref }), children: ctaText })
-      ] })
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "nav",
+              size: "sm",
+              render: /* @__PURE__ */ jsx("a", { href: ctaHref }),
+              className: "hidden md:inline-flex",
+              children: ctaText
+            }
+          ),
+          /* @__PURE__ */ jsxs(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: [
+            /* @__PURE__ */ jsxs(
+              SheetTrigger,
+              {
+                render: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon-sm", className: "md:hidden" }),
+                children: [
+                  /* @__PURE__ */ jsx(Menu$1, { className: "size-5" }),
+                  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Menu" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(SheetContent, { side: "right", showCloseButton: true, children: [
+              /* @__PURE__ */ jsx(SheetTitle, { children: "Navigation" }),
+              /* @__PURE__ */ jsxs("nav", { className: "flex flex-col gap-1 px-2 pt-4", children: [
+                links.map((link) => /* @__PURE__ */ jsxs(
+                  "a",
+                  {
+                    href: link.href,
+                    onClick: () => setMobileOpen(false),
+                    className: cn(
+                      "flex items-center gap-2 rounded-md px-3 py-2.5 text-sm font-bold transition-colors hover:bg-foreground/5",
+                      link.active && "bg-foreground/10"
+                    ),
+                    children: [
+                      link.label,
+                      link.badge && /* @__PURE__ */ jsx("span", { className: "border border-foreground bg-background px-1 font-mono text-[9px] font-bold uppercase text-foreground", children: link.badge })
+                    ]
+                  },
+                  link.href
+                )),
+                /* @__PURE__ */ jsx("div", { className: "mt-4 border-t border-foreground/10 pt-4", children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "default",
+                    size: "default",
+                    render: /* @__PURE__ */ jsx("a", { href: ctaHref }),
+                    className: "w-full",
+                    children: ctaText
+                  }
+                ) })
+              ] })
+            ] })
+          ] })
+        ] })
+      ]
     }
-  );
+  ) });
+}
+function SocialsRow({
+  socials
+}) {
+  const items = [
+    { key: "twitter", label: "Twitter", url: socials.twitter },
+    { key: "github", label: "GitHub", url: socials.github },
+    { key: "linkedin", label: "LinkedIn", url: socials.linkedin },
+    { key: "discord", label: "Discord", url: socials.discord }
+  ].filter((s) => s.url);
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-4", children: items.map((s) => /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: s.url,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "text-sm font-bold transition-colors hover:text-muted-foreground",
+      children: s.label
+    },
+    s.key
+  )) });
+}
+function NewsletterSection({
+  newsletter
+}) {
+  return /* @__PURE__ */ jsx("div", { className: "mb-10 border-b-brutal border-foreground pb-10", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-lg text-center", children: [
+    /* @__PURE__ */ jsx("h3", { className: "brutal-h4 mb-2", children: newsletter.headline || "Stay in the loop" }),
+    newsletter.description && /* @__PURE__ */ jsx("p", { className: "brutal-caption mb-4", children: newsletter.description }),
+    /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit: (e) => e.preventDefault(),
+        className: "flex gap-2",
+        children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              type: "email",
+              placeholder: newsletter.placeholder || "you@email.com",
+              className: "flex-1"
+            }
+          ),
+          /* @__PURE__ */ jsx(Button, { variant: "default", size: "default", type: "submit", children: newsletter.buttonText || "Subscribe" })
+        ]
+      }
+    )
+  ] }) });
+}
+function MegaContent({
+  logo,
+  tagline,
+  columns,
+  socials
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "mb-10 flex flex-col gap-8 sm:flex-row sm:items-start sm:justify-between", children: [
+    /* @__PURE__ */ jsxs("div", { className: "max-w-xs", children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-2 text-xl font-black", children: logo }),
+      tagline && /* @__PURE__ */ jsx("p", { className: "mb-4 text-sm text-muted-foreground", children: tagline }),
+      socials && /* @__PURE__ */ jsx(SocialsRow, { socials })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-8 sm:grid-cols-3 md:gap-12", children: columns.map((col) => /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h3", { className: "brutal-label mb-3 text-muted-foreground", children: col.title }),
+      /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", children: col.links.map((link) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: link.href,
+          className: "text-sm font-medium transition-colors hover:text-muted-foreground",
+          children: link.label
+        }
+      ) }, link.href)) })
+    ] }, col.title)) })
+  ] });
+}
+function MinimalContent({
+  logo,
+  columns,
+  socials
+}) {
+  const allLinks = columns.flatMap((col) => col.links);
+  return /* @__PURE__ */ jsxs("div", { className: "mb-6 flex flex-col items-center gap-4 sm:flex-row sm:justify-between", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-xl font-black", children: logo }),
+    /* @__PURE__ */ jsx("nav", { className: "flex flex-wrap items-center justify-center gap-x-6 gap-y-2", children: allLinks.map((link) => /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: link.href,
+        className: "text-sm font-medium transition-colors hover:text-muted-foreground",
+        children: link.label
+      },
+      link.href
+    )) }),
+    socials && /* @__PURE__ */ jsx(SocialsRow, { socials })
+  ] });
 }
 function BrutalFooter({
   logo,
@@ -3149,33 +3664,30 @@ function BrutalFooter({
   columns,
   bottomLeft,
   bottomRight,
+  variant = "mega",
+  socials,
+  newsletter,
   className
 }) {
   return /* @__PURE__ */ jsx(
     "footer",
     {
       className: cn(
-        "w-full border-t-brutal border-foreground bg-background px-6 py-12 text-foreground",
+        "w-full border-t-4 bg-background px-6 py-12 text-foreground",
         className
       ),
+      style: { borderTopColor: "hsl(var(--brand))" },
       children: /* @__PURE__ */ jsxs("div", { className: "brutal-container", children: [
-        /* @__PURE__ */ jsxs("div", { className: "mb-10 flex flex-col gap-8 sm:flex-row sm:items-start sm:justify-between", children: [
-          /* @__PURE__ */ jsxs("div", { className: "max-w-xs", children: [
-            /* @__PURE__ */ jsx("div", { className: "mb-2 text-xl font-black", children: logo }),
-            tagline && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: tagline })
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-8 sm:grid-cols-3 md:gap-12", children: columns.map((col) => /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx("h3", { className: "brutal-label mb-3 text-muted-foreground", children: col.title }),
-            /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", children: col.links.map((link) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-              "a",
-              {
-                href: link.href,
-                className: "text-sm font-medium transition-colors hover:text-muted-foreground",
-                children: link.label
-              }
-            ) }, link.href)) })
-          ] }, col.title)) })
-        ] }),
+        variant === "newsletter" && newsletter && /* @__PURE__ */ jsx(NewsletterSection, { newsletter }),
+        variant === "minimal" ? /* @__PURE__ */ jsx(MinimalContent, { logo, columns, socials }) : /* @__PURE__ */ jsx(
+          MegaContent,
+          {
+            logo,
+            tagline,
+            columns,
+            socials
+          }
+        ),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-t-brutal border-foreground pt-6 font-mono text-xs uppercase tracking-widest text-muted-foreground", children: [
           /* @__PURE__ */ jsx("span", { children: bottomLeft || "Built with care" }),
           /* @__PURE__ */ jsx("span", { children: bottomRight || (/* @__PURE__ */ new Date()).getFullYear() })
@@ -3184,7 +3696,1234 @@ function BrutalFooter({
     }
   );
 }
+function PricingTable({
+  badge,
+  headline,
+  description,
+  tiers,
+  popularIndex,
+  billingToggle = true,
+  color = "white",
+  className
+}) {
+  const [annual, setAnnual] = useState(false);
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, className, children: [
+    (headline || badge) && /* @__PURE__ */ jsxs("div", { className: "mb-8 text-center", children: [
+      badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 text-muted-foreground", children: badge }),
+      headline && /* @__PURE__ */ jsx("h2", { className: "brutal-h2 mb-4", children: headline }),
+      description && /* @__PURE__ */ jsx("p", { className: "brutal-body mx-auto max-w-lg text-muted-foreground", children: description })
+    ] }),
+    billingToggle && /* @__PURE__ */ jsxs("div", { className: "mb-10 flex items-center justify-center gap-3", children: [
+      /* @__PURE__ */ jsx("span", { className: cn("text-sm font-bold", !annual && "text-brand"), children: "Monthly" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => setAnnual(!annual),
+          className: cn(
+            "relative h-8 w-14 border-brutal border-foreground transition-colors",
+            annual ? "bg-brand" : "bg-secondary"
+          ),
+          children: /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "absolute top-1 size-6 border border-foreground bg-background transition-transform",
+                annual ? "left-7" : "left-1"
+              )
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: cn("text-sm font-bold", annual && "text-brand"), children: "Annual" }),
+      annual && /* @__PURE__ */ jsx(Badge, { variant: "cta", children: "Save 20%" })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: cn(
+      "grid gap-6",
+      tiers.length === 2 && "mx-auto max-w-2xl sm:grid-cols-2",
+      tiers.length === 3 && "lg:grid-cols-3",
+      tiers.length >= 4 && "sm:grid-cols-2 lg:grid-cols-4"
+    ), children: tiers.map((tier, i) => {
+      const isPopular = i === popularIndex;
+      const price = annual ? tier.price.annual : tier.price.monthly;
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "relative flex flex-col border-brutal border-foreground bg-background p-6 shadow-brutal",
+            isPopular && "border-brand shadow-brutal-lg ring-2 ring-brand z-10 scale-105"
+          ),
+          children: [
+            isPopular && /* @__PURE__ */ jsx(Badge, { variant: "brand", className: "absolute -top-3 left-1/2 -translate-x-1/2", children: "Popular" }),
+            /* @__PURE__ */ jsx("h3", { className: "brutal-h4 mb-1", children: tier.name }),
+            tier.description && /* @__PURE__ */ jsx("p", { className: "mb-4 text-sm text-muted-foreground", children: tier.description }),
+            /* @__PURE__ */ jsxs("div", { className: "mb-6", children: [
+              /* @__PURE__ */ jsx("span", { className: "brutal-h1", children: typeof price === "number" ? `$${price}` : price }),
+              typeof price === "number" && /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "/mo" })
+            ] }),
+            /* @__PURE__ */ jsx("ul", { className: "mb-8 flex flex-1 flex-col gap-2", children: tier.features.map((feature) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2 text-sm", children: [
+              /* @__PURE__ */ jsx("span", { className: "mt-0.5 text-brand", children: "\u2713" }),
+              feature
+            ] }, feature)) }),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: tier.ctaVariant || (isPopular ? "cta" : "outline"),
+                size: "lg",
+                className: "w-full",
+                render: tier.ctaHref ? /* @__PURE__ */ jsx("a", { href: tier.ctaHref }) : void 0,
+                children: tier.ctaText
+              }
+            )
+          ]
+        },
+        tier.name
+      );
+    }) })
+  ] });
+}
+function LogoCloud({
+  title,
+  logos,
+  marquee = false,
+  color = "white",
+  className
+}) {
+  const logoElements = logos.map((logo) => {
+    const img = /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: logo.src,
+        alt: logo.alt,
+        className: "h-8 max-w-[120px] object-contain opacity-50 grayscale transition-all duration-200 hover:opacity-100 hover:grayscale-0"
+      },
+      logo.alt
+    );
+    return logo.href ? /* @__PURE__ */ jsx("a", { href: logo.href, className: "flex items-center px-6", children: img }, logo.alt) : /* @__PURE__ */ jsx("div", { className: "flex items-center px-6", children: img }, logo.alt);
+  });
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, padding: "sm", className, children: [
+    title && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-6 text-center text-muted-foreground", children: title }),
+    marquee ? /* @__PURE__ */ jsx("div", { className: "relative overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex animate-marquee", children: [
+      logoElements,
+      logoElements
+    ] }) }) : /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-center gap-8", children: logoElements })
+  ] });
+}
+function useCountUp(target, inView) {
+  const [count, setCount] = useState(0);
+  useEffect(() => {
+    if (!inView) return;
+    let frame;
+    const duration = 1500;
+    const start = performance.now();
+    function animate(now) {
+      const elapsed = now - start;
+      const progress = Math.min(elapsed / duration, 1);
+      const eased = 1 - Math.pow(1 - progress, 3);
+      setCount(Math.round(eased * target));
+      if (progress < 1) frame = requestAnimationFrame(animate);
+    }
+    frame = requestAnimationFrame(animate);
+    return () => cancelAnimationFrame(frame);
+  }, [target, inView]);
+  return count;
+}
+function StatItem({ stat, inView }) {
+  const count = useCountUp(stat.value, inView);
+  return /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+    /* @__PURE__ */ jsxs("p", { className: "brutal-display", children: [
+      stat.prefix,
+      count.toLocaleString(),
+      stat.suffix
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "brutal-label mt-2 text-muted-foreground", children: stat.label })
+  ] });
+}
+function StatsBar({ stats, color = "white", className }) {
+  const ref = useRef(null);
+  const [inView, setInView] = useState(false);
+  useEffect(() => {
+    if (!ref.current) return;
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        if (entry.isIntersecting) {
+          setInView(true);
+          observer.disconnect();
+        }
+      },
+      { threshold: 0.3 }
+    );
+    observer.observe(ref.current);
+    return () => observer.disconnect();
+  }, []);
+  return /* @__PURE__ */ jsx(BrutalSection, { color, padding: "sm", className, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "grid gap-8",
+        stats.length === 2 && "grid-cols-2",
+        stats.length === 3 && "grid-cols-3",
+        stats.length >= 4 && "grid-cols-2 sm:grid-cols-4"
+      ),
+      children: stats.map((stat) => /* @__PURE__ */ jsx(StatItem, { stat, inView }, stat.label))
+    }
+  ) });
+}
+function FAQ({
+  badge,
+  headline,
+  items,
+  color = "white",
+  className
+}) {
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, className, children: [
+    (headline || badge) && /* @__PURE__ */ jsxs("div", { className: "mb-10 mx-auto max-w-2xl", children: [
+      badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 text-brand", children: badge }),
+      headline && /* @__PURE__ */ jsx("h2", { className: "brutal-h2", children: headline })
+    ] }),
+    /* @__PURE__ */ jsx(Accordion, { className: "mx-auto max-w-2xl", children: items.map((item, i) => /* @__PURE__ */ jsxs(
+      AccordionItem,
+      {
+        value: `faq-${i}`,
+        className: cn(
+          "border-brutal border-foreground mb-3 px-5",
+          i % 2 === 0 ? "bg-background" : "bg-secondary"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(AccordionTrigger, { className: "brutal-h4 py-4 text-left", children: item.question }),
+          /* @__PURE__ */ jsx(AccordionContent, { className: "brutal-body pb-4 text-muted-foreground", children: item.answer })
+        ]
+      },
+      i
+    )) })
+  ] });
+}
+function Newsletter({
+  headline = "Stay in the loop",
+  description,
+  placeholder = "you@example.com",
+  buttonText = "Subscribe",
+  onSubmit,
+  color = "white",
+  className
+}) {
+  return /* @__PURE__ */ jsx(BrutalSection, { color, padding: "sm", className, children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-md border-brutal border-foreground bg-background p-8 text-foreground shadow-brutal-lg", children: [
+    /* @__PURE__ */ jsx("h3", { className: "brutal-h3 mb-2", children: headline }),
+    description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-6 text-muted-foreground", children: description }),
+    /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit: (e) => {
+          e.preventDefault();
+          const form = e.target;
+          const email = new FormData(form).get("email");
+          onSubmit?.(email);
+        },
+        className: "flex gap-3",
+        children: [
+          /* @__PURE__ */ jsx(Input, { type: "email", name: "email", placeholder, required: true, className: "flex-1" }),
+          /* @__PURE__ */ jsx(Button, { type: "submit", variant: "cta", children: buttonText })
+        ]
+      }
+    )
+  ] }) });
+}
+var AppShellContext = createContext({
+  collapsed: false,
+  setCollapsed: () => {
+  },
+  mobileOpen: false,
+  setMobileOpen: () => {
+  }
+});
+var useAppShell = () => useContext(AppShellContext);
+function AppShell({
+  sidebar,
+  header,
+  children,
+  defaultCollapsed = false,
+  className
+}) {
+  const [collapsed, setCollapsed] = useState(defaultCollapsed);
+  const [mobileOpen, setMobileOpen] = useState(false);
+  return /* @__PURE__ */ jsx(
+    AppShellContext.Provider,
+    {
+      value: { collapsed, setCollapsed, mobileOpen, setMobileOpen },
+      children: /* @__PURE__ */ jsxs("div", { className: cn("flex h-screen bg-background", className), children: [
+        /* @__PURE__ */ jsx(
+          "aside",
+          {
+            className: cn(
+              "hidden border-r-brutal border-foreground bg-background transition-all duration-200 md:block",
+              collapsed ? "w-16" : "w-64"
+            ),
+            children: sidebar
+          }
+        ),
+        /* @__PURE__ */ jsx(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: /* @__PURE__ */ jsxs(SheetContent, { side: "left", className: "w-64 p-0 md:hidden", children: [
+          /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Navigation" }),
+          sidebar
+        ] }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
+          header && /* @__PURE__ */ jsxs("header", { className: "flex h-14 items-center gap-4 border-b-brutal border-foreground px-6", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "sm",
+                className: "md:hidden",
+                onClick: () => setMobileOpen(true),
+                children: "\u2630"
+              }
+            ),
+            header
+          ] }),
+          /* @__PURE__ */ jsx("main", { className: "flex-1 overflow-auto p-6", children })
+        ] })
+      ] })
+    }
+  );
+}
+function Sidebar({
+  logo,
+  logoCollapsed,
+  groups,
+  footer,
+  className
+}) {
+  const { collapsed, setCollapsed } = useAppShell();
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-full flex-col", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex h-14 items-center justify-between border-b-brutal border-foreground px-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "font-black", children: collapsed ? logoCollapsed || logo : logo }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => setCollapsed(!collapsed),
+          className: "hidden text-xs text-muted-foreground hover:text-foreground md:block",
+          children: collapsed ? "\u2192" : "\u2190"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("nav", { className: "flex-1 overflow-auto p-2", children: groups.map((group, gi) => /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
+      group.title && !collapsed && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-2 px-2 text-muted-foreground", children: group.title }),
+      /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-0.5", children: group.links.map((link) => /* @__PURE__ */ jsxs(
+        "a",
+        {
+          href: link.href,
+          className: cn(
+            "flex items-center gap-3 rounded-sm px-3 py-2 text-sm font-medium transition-colors",
+            link.active ? "bg-brand text-brand-foreground" : "hover:bg-secondary",
+            collapsed && "justify-center"
+          ),
+          title: collapsed ? link.label : void 0,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "size-5 shrink-0", children: link.icon }),
+            !collapsed && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("span", { className: "flex-1", children: link.label }),
+              link.badge !== void 0 && /* @__PURE__ */ jsx("span", { className: "border border-foreground bg-brand-muted px-1.5 font-mono text-[10px] font-bold", children: link.badge })
+            ] })
+          ]
+        },
+        link.href
+      )) })
+    ] }, gi)) }),
+    footer && /* @__PURE__ */ jsx("div", { className: "border-t-brutal border-foreground p-3", children: footer })
+  ] });
+}
+function StatCard({
+  label,
+  value,
+  change,
+  changeLabel,
+  icon,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "border-brutal border-foreground bg-background p-5 shadow-brutal",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx("p", { className: "brutal-label text-muted-foreground", children: label }),
+          icon && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: icon })
+        ] }),
+        /* @__PURE__ */ jsx("p", { className: "brutal-h1 mb-1", children: value }),
+        change !== void 0 && /* @__PURE__ */ jsxs(
+          "p",
+          {
+            className: cn(
+              "flex items-center gap-1 font-mono text-xs font-bold",
+              change >= 0 ? "text-cta" : "text-destructive"
+            ),
+            children: [
+              /* @__PURE__ */ jsx("span", { children: change >= 0 ? "\u2191" : "\u2193" }),
+              /* @__PURE__ */ jsxs("span", { children: [
+                Math.abs(change),
+                "%"
+              ] }),
+              changeLabel && /* @__PURE__ */ jsx("span", { className: "font-normal text-muted-foreground", children: changeLabel })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+var viewLabels = {
+  table: "Table",
+  kanban: "Board",
+  grid: "Grid",
+  calendar: "Calendar",
+  list: "List"
+};
+function ViewSwitcher({
+  value,
+  onChange,
+  views = ["table", "kanban", "grid", "calendar", "list"],
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    ToggleGroup,
+    {
+      value: [value],
+      onValueChange: (vals) => {
+        if (vals.length > 0) {
+          onChange(vals[0]);
+        }
+      },
+      className,
+      children: views.map((view) => /* @__PURE__ */ jsx(ToggleGroupItem, { value: view, className: "brutal-label text-xs", children: viewLabels[view] }, view))
+    }
+  );
+}
+function SearchBar({
+  placeholder = "Search...",
+  shortcut = "\u2318K",
+  value,
+  onChange,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        type: "search",
+        placeholder,
+        value,
+        onChange: (e) => onChange?.(e.target.value),
+        className: "pr-12"
+      }
+    ),
+    shortcut && /* @__PURE__ */ jsx("span", { className: "absolute right-2 top-1/2 -translate-y-1/2 border border-foreground bg-secondary px-1.5 font-mono text-[10px] text-muted-foreground", children: shortcut })
+  ] });
+}
+function UserMenu({ name, email, avatar, items, onSignOut }) {
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxs(
+      DropdownMenuTrigger,
+      {
+        className: "inline-flex shrink-0 cursor-pointer items-center gap-2 rounded-lg px-3 py-1.5 text-sm font-medium outline-none hover:bg-secondary",
+        children: [
+          /* @__PURE__ */ jsxs(Avatar, { className: "size-7", children: [
+            avatar && /* @__PURE__ */ jsx(AvatarImage, { src: avatar, alt: name }),
+            /* @__PURE__ */ jsx(AvatarFallback, { children: name[0] })
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "hidden text-sm font-medium sm:inline", children: name })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-48", children: [
+      /* @__PURE__ */ jsxs(DropdownMenuLabel, { children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: name }),
+        email && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: email })
+      ] }),
+      /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+      items && /* @__PURE__ */ jsx(DropdownMenuGroup, { children: items.map((item) => /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: item.onClick, children: item.href ? /* @__PURE__ */ jsx("a", { href: item.href, children: item.label }) : item.label }, item.label)) }),
+      onSignOut && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+        /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: onSignOut, children: "Sign out" })
+      ] })
+    ] })
+  ] });
+}
+function EmptyState({
+  icon,
+  headline,
+  description,
+  ctaText,
+  ctaHref,
+  onAction,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col items-center justify-center py-16 text-center",
+        className
+      ),
+      children: [
+        icon && /* @__PURE__ */ jsx("div", { className: "mb-4 flex size-16 items-center justify-center border-brutal border-foreground bg-secondary text-3xl shadow-brutal-sm", children: icon }),
+        /* @__PURE__ */ jsx("h3", { className: "brutal-h3 mb-2", children: headline }),
+        description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-6 max-w-sm text-muted-foreground", children: description }),
+        ctaText && (ctaHref ? /* @__PURE__ */ jsx(Button, { variant: "cta", render: /* @__PURE__ */ jsx("a", { href: ctaHref }), children: ctaText }) : /* @__PURE__ */ jsx(Button, { variant: "cta", onClick: onAction, children: ctaText }))
+      ]
+    }
+  );
+}
+function formatDate(d) {
+  const date = typeof d === "string" ? new Date(d) : d;
+  return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+}
+function formatTime(d) {
+  const date = typeof d === "string" ? new Date(d) : d;
+  return date.toLocaleTimeString("en-US", {
+    hour: "numeric",
+    minute: "2-digit"
+  });
+}
+function ActivityFeed({
+  entries,
+  groupByDate = true,
+  className
+}) {
+  const grouped = groupByDate ? entries.reduce((acc, entry) => {
+    const key = formatDate(entry.timestamp);
+    (acc[key] ?? (acc[key] = [])).push(entry);
+    return acc;
+  }, {}) : { "": entries };
+  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-6", className), children: Object.entries(grouped).map(([date, items]) => /* @__PURE__ */ jsxs("div", { children: [
+    date && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-3 text-muted-foreground", children: date }),
+    /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-0 pl-6", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 left-2 top-2 w-px bg-foreground/10" }),
+      items.map((entry) => /* @__PURE__ */ jsxs("div", { className: "relative flex items-start gap-3 py-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "absolute left-[-18px] top-3 size-2 border border-foreground bg-brand" }),
+        /* @__PURE__ */ jsxs(Avatar, { className: "size-7 shrink-0", children: [
+          entry.avatar && /* @__PURE__ */ jsx(AvatarImage, { src: entry.avatar, alt: entry.name }),
+          /* @__PURE__ */ jsx(AvatarFallback, { className: "text-[10px]", children: entry.name[0] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxs("p", { className: "text-sm", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-bold", children: entry.name }),
+            " ",
+            entry.action
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: "font-mono text-xs text-muted-foreground", children: formatTime(entry.timestamp) }),
+          entry.metadata
+        ] })
+      ] }, entry.id))
+    ] })
+  ] }, date)) });
+}
+function FileUpload({
+  onFiles,
+  accept,
+  maxFiles = 10,
+  maxSize,
+  className
+}) {
+  const [isDragging, setIsDragging] = useState(false);
+  const [files, setFiles] = useState([]);
+  const handleFiles = useCallback(
+    (newFiles) => {
+      const arr = Array.from(newFiles).slice(0, maxFiles);
+      setFiles(arr);
+      onFiles(arr);
+    },
+    [maxFiles, onFiles]
+  );
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4", className), children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        onDragOver: (e) => {
+          e.preventDefault();
+          setIsDragging(true);
+        },
+        onDragLeave: () => setIsDragging(false),
+        onDrop: (e) => {
+          e.preventDefault();
+          setIsDragging(false);
+          handleFiles(e.dataTransfer.files);
+        },
+        className: cn(
+          "flex cursor-pointer flex-col items-center justify-center border-2 border-dashed border-foreground p-8 text-center transition-colors",
+          isDragging && "border-brand bg-brand-muted"
+        ),
+        onClick: () => {
+          const input = document.createElement("input");
+          input.type = "file";
+          input.multiple = maxFiles > 1;
+          if (accept) input.accept = accept;
+          input.onchange = (e) => {
+            const target = e.target;
+            if (target.files) handleFiles(target.files);
+          };
+          input.click();
+        },
+        children: [
+          /* @__PURE__ */ jsx("p", { className: "brutal-h4 mb-1", children: "Drop files here" }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "or click to browse" }),
+          maxSize && /* @__PURE__ */ jsxs("p", { className: "mt-2 font-mono text-xs text-muted-foreground", children: [
+            "Max ",
+            Math.round(maxSize / 1024 / 1024),
+            "MB"
+          ] })
+        ]
+      }
+    ),
+    files.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: files.map((file, i) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-center justify-between border border-foreground bg-secondary px-3 py-2 text-sm",
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate", children: file.name }),
+          /* @__PURE__ */ jsxs("span", { className: "font-mono text-xs text-muted-foreground", children: [
+            (file.size / 1024).toFixed(0),
+            "KB"
+          ] })
+        ]
+      },
+      i
+    )) })
+  ] });
+}
+function DataTable({
+  columns,
+  data,
+  searchColumn,
+  searchPlaceholder = "Search...",
+  pageSize = 10,
+  emptyMessage = "No data",
+  className
+}) {
+  const [sorting, setSorting] = useState([]);
+  const [globalFilter, setGlobalFilter] = useState("");
+  const table = useReactTable({
+    data,
+    columns,
+    state: { sorting, globalFilter },
+    onSortingChange: setSorting,
+    onGlobalFilterChange: setGlobalFilter,
+    getCoreRowModel: getCoreRowModel(),
+    getSortedRowModel: getSortedRowModel(),
+    getFilteredRowModel: getFilteredRowModel(),
+    getPaginationRowModel: getPaginationRowModel(),
+    initialState: { pagination: { pageSize } }
+  });
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4", className), children: [
+    searchColumn !== void 0 && /* @__PURE__ */ jsx(
+      Input,
+      {
+        placeholder: searchPlaceholder,
+        value: globalFilter,
+        onChange: (e) => setGlobalFilter(e.target.value),
+        className: "max-w-sm"
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "overflow-auto border-brutal border-foreground shadow-brutal", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
+      /* @__PURE__ */ jsx("thead", { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(
+        "tr",
+        {
+          className: "border-b-brutal border-foreground bg-secondary",
+          children: headerGroup.headers.map((header) => /* @__PURE__ */ jsxs(
+            "th",
+            {
+              className: cn(
+                "brutal-label px-4 py-3 text-left",
+                header.column.getCanSort() && "cursor-pointer select-none"
+              ),
+              onClick: header.column.getToggleSortingHandler(),
+              children: [
+                flexRender(
+                  header.column.columnDef.header,
+                  header.getContext()
+                ),
+                {
+                  asc: " \u2191",
+                  desc: " \u2193"
+                }[header.column.getIsSorted()] ?? ""
+              ]
+            },
+            header.id
+          ))
+        },
+        headerGroup.id
+      )) }),
+      /* @__PURE__ */ jsx("tbody", { children: table.getRowModel().rows.length === 0 ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
+        "td",
+        {
+          colSpan: columns.length,
+          className: "px-4 py-8 text-center text-muted-foreground",
+          children: emptyMessage
+        }
+      ) }) : table.getRowModel().rows.map((row, i) => /* @__PURE__ */ jsx(
+        "tr",
+        {
+          className: cn(
+            "border-b border-foreground/10 transition-colors hover:bg-brand-muted",
+            i % 2 === 1 && "bg-secondary/30"
+          ),
+          children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx("td", { className: "px-4 py-3", children: flexRender(
+            cell.column.columnDef.cell,
+            cell.getContext()
+          ) }, cell.id))
+        },
+        row.id
+      )) })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
+        "Page ",
+        table.getState().pagination.pageIndex + 1,
+        " of",
+        " ",
+        table.getPageCount()
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            onClick: () => table.previousPage(),
+            disabled: !table.getCanPreviousPage(),
+            children: "Previous"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            onClick: () => table.nextPage(),
+            disabled: !table.getCanNextPage(),
+            children: "Next"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function KanbanBoard({
+  columns,
+  renderCard,
+  onCardMove,
+  onCardAdd,
+  className
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("flex gap-4 overflow-x-auto pb-4", className), children: columns.map((column) => /* @__PURE__ */ jsx(
+    KanbanColumnComponent,
+    {
+      column,
+      renderCard,
+      onCardMove,
+      onCardAdd
+    },
+    column.id
+  )) });
+}
+function KanbanColumnComponent({
+  column,
+  renderCard,
+  onCardMove,
+  onCardAdd
+}) {
+  const ref = useRef(null);
+  const [isDragOver, setIsDragOver] = useState(false);
+  const [addText, setAddText] = useState("");
+  useEffect(() => {
+    if (!ref.current) return;
+    return dropTargetForElements({
+      element: ref.current,
+      getData: () => ({ columnId: column.id }),
+      onDragEnter: () => setIsDragOver(true),
+      onDragLeave: () => setIsDragOver(false),
+      onDrop: ({ source }) => {
+        setIsDragOver(false);
+        const data = source.data;
+        if (data.columnId !== column.id) {
+          onCardMove?.(
+            data.cardId,
+            data.columnId,
+            column.id,
+            column.cards.length
+          );
+        }
+      }
+    });
+  }, [column.id, column.cards.length, onCardMove]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex min-w-[280px] flex-col border-brutal border-foreground bg-secondary/30 p-3",
+        isDragOver && "ring-2 ring-brand"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "brutal-label mb-3 flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx("span", { children: column.title }),
+          /* @__PURE__ */ jsx("span", { className: "bg-foreground px-1.5 font-mono text-xs text-background", children: column.cards.length })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col gap-2", children: column.cards.map((card) => /* @__PURE__ */ jsx(
+          KanbanCard,
+          {
+            card,
+            columnId: column.id,
+            renderCard
+          },
+          card.id
+        )) }),
+        onCardAdd && /* @__PURE__ */ jsx(
+          "form",
+          {
+            className: "mt-3",
+            onSubmit: (e) => {
+              e.preventDefault();
+              if (addText.trim()) {
+                onCardAdd(column.id, addText.trim());
+                setAddText("");
+              }
+            },
+            children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                value: addText,
+                onChange: (e) => setAddText(e.target.value),
+                placeholder: "+ Add card...",
+                className: "text-sm"
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+function KanbanCard({
+  card,
+  columnId,
+  renderCard
+}) {
+  const ref = useRef(null);
+  const [isDragging, setIsDragging] = useState(false);
+  useEffect(() => {
+    if (!ref.current) return;
+    return draggable({
+      element: ref.current,
+      getInitialData: () => ({ cardId: card.id, columnId }),
+      onDragStart: () => setIsDragging(true),
+      onDrop: () => setIsDragging(false)
+    });
+  }, [card.id, columnId]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "cursor-grab border-brutal border-foreground bg-background p-3 shadow-brutal-sm transition-opacity active:cursor-grabbing",
+        isDragging && "opacity-50"
+      ),
+      children: renderCard(card)
+    }
+  );
+}
+function GridView({
+  children,
+  columns = 3,
+  gap = 6,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("grid", className),
+      style: {
+        gridTemplateColumns: `repeat(auto-fill, minmax(${Math.floor(100 / columns) - 2}%, 1fr))`,
+        gap: `${gap * 4}px`
+      },
+      children
+    }
+  );
+}
+var DAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+function getDaysInMonth(year, month) {
+  return new Date(year, month + 1, 0).getDate();
+}
+function getFirstDayOfMonth(year, month) {
+  return new Date(year, month, 1).getDay();
+}
+function CalendarView({
+  events = [],
+  onEventClick,
+  onDateClick,
+  className
+}) {
+  const [currentDate, setCurrentDate] = useState(/* @__PURE__ */ new Date());
+  const year = currentDate.getFullYear();
+  const month = currentDate.getMonth();
+  const daysInMonth = getDaysInMonth(year, month);
+  const firstDay = getFirstDayOfMonth(year, month);
+  const monthName = currentDate.toLocaleDateString("en-US", {
+    month: "long",
+    year: "numeric"
+  });
+  const cells = [];
+  for (let i = 0; i < firstDay; i++) cells.push(null);
+  for (let d = 1; d <= daysInMonth; d++) cells.push(d);
+  const getEventsForDay = (day) => events.filter((e) => {
+    const d = typeof e.date === "string" ? new Date(e.date) : e.date;
+    return d.getFullYear() === year && d.getMonth() === month && d.getDate() === day;
+  });
+  const today = /* @__PURE__ */ new Date();
+  const isToday = (day) => day === today.getDate() && month === today.getMonth() && year === today.getFullYear();
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          onClick: () => setCurrentDate(new Date(year, month - 1)),
+          children: "\u2190"
+        }
+      ),
+      /* @__PURE__ */ jsx("h3", { className: "brutal-h4", children: monthName }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          onClick: () => setCurrentDate(new Date(year, month + 1)),
+          children: "\u2192"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-7 border-brutal border-foreground", children: [
+      DAYS.map((day) => /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "brutal-label border-b-brutal border-foreground bg-secondary px-2 py-2 text-center text-xs",
+          children: day
+        },
+        day
+      )),
+      cells.map((day, i) => {
+        const dayEvents = day ? getEventsForDay(day) : [];
+        return /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "min-h-[80px] border-b border-r border-foreground/10 p-1",
+              day && onDateClick && "cursor-pointer hover:bg-secondary/50",
+              isToday(day ?? 0) && "bg-brand-muted"
+            ),
+            onClick: () => day && onDateClick?.(new Date(year, month, day)),
+            children: day && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "text-xs font-bold",
+                    isToday(day) && "text-brand"
+                  ),
+                  children: day
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "mt-1 flex flex-col gap-0.5", children: [
+                dayEvents.slice(0, 3).map((event) => /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      onEventClick?.(event);
+                    },
+                    className: "cursor-pointer truncate border border-foreground/20 bg-brand-muted px-1 text-[10px] font-medium hover:bg-brand",
+                    style: event.color ? { borderLeftColor: event.color, borderLeftWidth: 2 } : void 0,
+                    children: event.title
+                  },
+                  event.id
+                )),
+                dayEvents.length > 3 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+                  "+",
+                  dayEvents.length - 3
+                ] })
+              ] })
+            ] })
+          },
+          i
+        );
+      })
+    ] })
+  ] });
+}
+function ListView({
+  items,
+  onItemClick,
+  emptyMessage = "No items",
+  className
+}) {
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "py-8 text-center text-muted-foreground", children: emptyMessage });
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("border-brutal border-foreground shadow-brutal", className), children: items.map((item, i) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onClick: () => onItemClick?.(item),
+      className: cn(
+        "flex items-center gap-4 px-4 py-3 transition-colors",
+        onItemClick && "cursor-pointer",
+        "hover:bg-secondary/50",
+        i < items.length - 1 && "border-b border-foreground/10"
+      ),
+      children: [
+        item.avatar && /* @__PURE__ */ jsxs(Avatar, { className: "size-8", children: [
+          /* @__PURE__ */ jsx(AvatarImage, { src: item.avatar, alt: item.title }),
+          /* @__PURE__ */ jsx(AvatarFallback, { children: item.title[0] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: item.title }),
+          item.subtitle && /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-muted-foreground", children: item.subtitle })
+        ] }),
+        item.metadata && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", children: item.metadata }),
+        item.actions && /* @__PURE__ */ jsx("div", { children: item.actions })
+      ]
+    },
+    item.id
+  )) });
+}
+function SaaSLaunchTemplate({
+  brand,
+  logo,
+  nav,
+  hero,
+  logos,
+  features,
+  stats,
+  testimonials,
+  pricing,
+  faq,
+  cta,
+  footer
+}) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(BrutalNav, { logo, links: nav.links, ctaText: nav.ctaText, ctaHref: nav.ctaHref, variant: "solid" }),
+    /* @__PURE__ */ jsx(
+      BrutalHero,
+      {
+        variant: "split",
+        badge: hero.badge,
+        headline: hero.headline,
+        description: hero.description,
+        ctaText: hero.ctaText,
+        ctaHref: hero.ctaHref,
+        secondaryText: hero.secondaryText,
+        secondaryHref: hero.secondaryHref,
+        visual: hero.visual,
+        proof: hero.proof,
+        color: "brand",
+        pattern: "noise"
+      }
+    ),
+    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand))", to: "hsl(var(--background))", variant: "wave" }),
+    logos && logos.length > 0 && /* @__PURE__ */ jsx(LogoCloud, { logos, marquee: true, title: "Trusted by teams everywhere" }),
+    /* @__PURE__ */ jsx(
+      BrutalFeatureGrid,
+      {
+        variant: "bento",
+        badge: features.badge,
+        headline: features.headline,
+        description: features.description,
+        features: features.items,
+        color: "white"
+      }
+    ),
+    stats && stats.length > 0 && /* @__PURE__ */ jsx(StatsBar, { stats, color: "brand" }),
+    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand))", to: "hsl(var(--brand-muted))", variant: "torn-paper" }),
+    /* @__PURE__ */ jsx(
+      BrutalTestimonials,
+      {
+        variant: "wall-of-love",
+        badge: testimonials.badge,
+        headline: testimonials.headline,
+        testimonials: testimonials.items,
+        color: "brand-muted"
+      }
+    ),
+    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand-muted))", to: "hsl(var(--background))", variant: "wave" }),
+    pricing && /* @__PURE__ */ jsx(
+      PricingTable,
+      {
+        badge: pricing.badge,
+        headline: pricing.headline,
+        description: pricing.description,
+        tiers: pricing.tiers,
+        popularIndex: pricing.popularIndex,
+        color: "white"
+      }
+    ),
+    faq && faq.length > 0 && /* @__PURE__ */ jsx(FAQ, { badge: "FAQ", headline: "Common Questions", items: faq, color: "white" }),
+    /* @__PURE__ */ jsx(
+      BrutalCTA,
+      {
+        variant: "with-visual",
+        headline: cta.headline,
+        description: cta.description,
+        ctaText: cta.ctaText,
+        ctaHref: cta.ctaHref,
+        secondaryText: cta.secondaryText,
+        secondaryHref: cta.secondaryHref,
+        color: "black",
+        pattern: "gradient-mesh"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      BrutalFooter,
+      {
+        variant: "mega",
+        logo,
+        tagline: footer.tagline,
+        columns: footer.columns,
+        socials: footer.socials
+      }
+    )
+  ] });
+}
+function StudioTemplate({
+  logo,
+  nav,
+  hero,
+  features,
+  testimonials,
+  newsletter,
+  cta,
+  footer
+}) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(BrutalNav, { logo, links: nav.links, ctaText: nav.ctaText, ctaHref: nav.ctaHref, variant: "floating-pill" }),
+    /* @__PURE__ */ jsx(
+      BrutalHero,
+      {
+        variant: "asymmetric",
+        badge: hero.badge,
+        headline: hero.headline,
+        description: hero.description,
+        ctaText: hero.ctaText,
+        ctaHref: hero.ctaHref,
+        visual: hero.visual,
+        proof: hero.proof,
+        color: "brand",
+        pattern: "grain"
+      }
+    ),
+    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand))", to: "hsl(var(--background))", variant: "brush-stroke" }),
+    /* @__PURE__ */ jsx(
+      BrutalFeatureGrid,
+      {
+        variant: "numbered",
+        badge: features.badge,
+        headline: features.headline,
+        description: features.description,
+        features: features.items,
+        color: "white"
+      }
+    ),
+    testimonials && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--background))", to: "hsl(var(--brand-muted))", variant: "diagonal" }),
+      /* @__PURE__ */ jsx(
+        BrutalTestimonials,
+        {
+          variant: "featured-grid",
+          badge: testimonials.badge,
+          headline: testimonials.headline,
+          testimonials: testimonials.items,
+          color: "brand-muted"
+        }
+      ),
+      /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand-muted))", to: "hsl(var(--background))", variant: "diagonal", flip: true })
+    ] }),
+    newsletter && /* @__PURE__ */ jsx(
+      Newsletter,
+      {
+        headline: newsletter.headline,
+        description: newsletter.description,
+        onSubmit: newsletter.onSubmit
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      BrutalCTA,
+      {
+        variant: "floating-card",
+        headline: cta.headline,
+        description: cta.description,
+        ctaText: cta.ctaText,
+        ctaHref: cta.ctaHref,
+        color: "brand"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      BrutalFooter,
+      {
+        variant: "minimal",
+        logo,
+        tagline: footer.tagline,
+        columns: footer.columns
+      }
+    )
+  ] });
+}
+function DashboardTemplate({
+  logo,
+  logoCollapsed,
+  sidebarGroups,
+  user,
+  userMenuItems,
+  onSignOut,
+  stats,
+  views,
+  children,
+  sidebarFooter
+}) {
+  const [view, setView] = useState("table");
+  return /* @__PURE__ */ jsxs(
+    AppShell,
+    {
+      sidebar: /* @__PURE__ */ jsx(
+        Sidebar,
+        {
+          logo,
+          logoCollapsed,
+          groups: sidebarGroups,
+          footer: sidebarFooter
+        }
+      ),
+      header: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(SearchBar, { className: "flex-1 max-w-sm" }),
+        /* @__PURE__ */ jsx("div", { className: "ml-auto", children: /* @__PURE__ */ jsx(
+          UserMenu,
+          {
+            name: user.name,
+            email: user.email,
+            avatar: user.avatar,
+            items: userMenuItems,
+            onSignOut
+          }
+        ) })
+      ] }),
+      children: [
+        stats && stats.length > 0 && /* @__PURE__ */ jsx("div", { className: "mb-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: stats.map((stat) => /* @__PURE__ */ jsx(StatCard, { ...stat }, stat.label)) }),
+        views && views.length > 1 && /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsx(ViewSwitcher, { value: view, onChange: setView, views }) }),
+        children
+      ]
+    }
+  );
+}
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BrutalCTA, BrutalFeatureGrid, BrutalFooter, BrutalHero, BrutalIntegrationGrid, BrutalNav, BrutalSection, BrutalTestimonials, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupTextarea, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPositioner, NavigationMenuTrigger, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, WaveDivider, badgeVariants, buttonVariants, cn, navigationMenuTriggerStyle, tabsListVariants, toggleVariants };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityFeed, Alert, AlertDescription, AlertTitle, AppShell, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BrutalCTA, BrutalFeatureGrid, BrutalFooter, BrutalHero, BrutalIntegrationGrid, BrutalNav, BrutalSection, BrutalTestimonials, Button, CalendarView, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DashboardTemplate, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FAQ, FileUpload, GridView, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupTextarea, KanbanBoard, Label, ListView, LogoCloud, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPositioner, NavigationMenuTrigger, Newsletter, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, PricingTable, Progress, RadioGroup, RadioGroupItem, SaaSLaunchTemplate, ScrollArea, ScrollBar, SearchBar, SectionDivider, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, Skeleton, Slider, StatCard, StatsBar, StudioTemplate, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UserMenu, ViewSwitcher, SectionDivider as WaveDivider, badgeVariants, buttonVariants, cn, defaultTransition, fadeIn, fadeInUp, navigationMenuTriggerStyle, scaleIn, slideInLeft, slideInRight, springTransition, staggerContainer, tabsListVariants, toggleVariants, useAppShell };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map