@snow-labs/brutal-ui 0.1.0 → 0.2.0

package/dist/components/brutal/cta-section.d.ts

@@ -1,4 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SectionColor, SectionPattern } from './section.js';
 
 interface BrutalCTAProps {
     headline: string;
@@ -8,9 +9,13 @@ interface BrutalCTAProps {
     ctaVariant?: "cta" | "brand" | "default" | "outline";
     secondaryText?: string;
     secondaryHref?: string;
-    color?: "black" | "brand" | "blue" | "white";
+    color?: SectionColor;
+    pattern?: SectionPattern;
     className?: string;
+    variant?: "centered" | "split" | "with-visual" | "floating-card";
+    visual?: React.ReactNode;
+    stats?: string;
 }
-declare function BrutalCTA({ headline, description, ctaText, ctaHref, ctaVariant, secondaryText, secondaryHref, color, className, }: BrutalCTAProps): react_jsx_runtime.JSX.Element;
+declare function BrutalCTA({ variant, color, className, pattern, ...props }: BrutalCTAProps): react_jsx_runtime.JSX.Element;
 
 export { BrutalCTA };

package/dist/components/brutal/cta-section.js

@@ -1,6 +1,255 @@
-export { BrutalCTA } from '../../chunk-LLMBKOKT.js';
-import '../../chunk-CY2FOBOD.js';
-import '../../chunk-BSVJVM2L.js';
-import '../../chunk-H6SOU4UG.js';
+"use client";
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { Button as Button$1 } from '@base-ui/react/button';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/lib/utils.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var buttonVariants = cva(
+  "group/button inline-flex shrink-0 items-center justify-center rounded-lg whitespace-nowrap font-bold transition-all duration-150 select-none outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        // Primary: Black bg, white text, offset shadow
+        default: "border-brutal border-foreground bg-primary text-primary-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm",
+        // CTA: Mint green bg — the Bannerbear signature
+        cta: "border-brutal border-foreground bg-cta text-cta-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm",
+        // Brand: Dynamic brand color bg
+        brand: "border-brutal border-foreground bg-brand text-brand-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm",
+        // Outline: White bg, black border, offset shadow
+        outline: "border-brutal border-foreground bg-background text-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm",
+        // Secondary: Light bg, border, smaller shadow
+        secondary: "border-brutal border-foreground bg-secondary text-secondary-foreground shadow-brutal-sm hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal active:translate-x-px active:translate-y-px active:shadow-none",
+        // Ghost: No border/shadow, subtle hover
+        ghost: "hover:bg-secondary hover:text-foreground",
+        // Link: Text only
+        link: "text-foreground underline-offset-4 hover:underline",
+        // Destructive
+        destructive: "border-brutal border-destructive bg-destructive text-destructive-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm",
+        // Nav: Thin border, no shadow (for nav Sign In buttons)
+        nav: "border border-foreground bg-background text-foreground hover:bg-foreground hover:text-background"
+      },
+      size: {
+        xs: "h-7 gap-1 px-2.5 text-xs",
+        sm: "h-8 gap-1.5 px-3 text-sm",
+        default: "h-10 gap-2 px-5 text-sm",
+        lg: "h-12 gap-2 px-7 text-base",
+        xl: "h-14 gap-2.5 px-9 text-lg",
+        icon: "size-10",
+        "icon-sm": "size-8",
+        "icon-lg": "size-12"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Button$1,
+    {
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+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"
+};
+var containerMap = {
+  sm: "brutal-container-sm",
+  default: "brutal-container",
+  lg: "brutal-container-lg"
+};
+var paddingMap = {
+  sm: "brutal-section-sm",
+  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",
+    {
+      id,
+      className: cn(
+        paddingMap[padding],
+        colorMap[color],
+        patternMap[resolvedPattern],
+        className
+      ),
+      children: /* @__PURE__ */ jsx("div", { className: containerMap[containerSize], children })
+    }
+  );
+}
+function CTAButtons({
+  ctaText,
+  ctaHref = "#",
+  ctaVariant = "cta",
+  secondaryText,
+  secondaryHref
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-center gap-4", children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: ctaVariant,
+        size: "xl",
+        render: /* @__PURE__ */ jsx("a", { href: ctaHref }),
+        children: ctaText
+      }
+    ),
+    secondaryText && /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "outline",
+        size: "lg",
+        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-wrap gap-4", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: props.ctaVariant || "cta",
+            size: "xl",
+            render: /* @__PURE__ */ jsx("a", { href: props.ctaHref || "#" }),
+            children: props.ctaText
+          }
+        ),
+        props.secondaryText && /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            size: "lg",
+            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(
+        CTAButtons,
+        {
+          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 })
+  ] });
+}
+
+export { BrutalCTA };
 //# sourceMappingURL=cta-section.js.map
 //# sourceMappingURL=cta-section.js.map

package/dist/components/brutal/cta-section.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"cta-section.js"}
+{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/button.tsx","../../../src/components/brutal/section.tsx","../../../src/components/brutal/cta-section.tsx"],"names":["ButtonPrimitive","jsx"],"mappings":"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","file":"cta-section.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center rounded-lg whitespace-nowrap font-bold transition-all duration-150 select-none outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        // Primary: Black bg, white text, offset shadow\n        default:\n          \"border-brutal border-foreground bg-primary text-primary-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // CTA: Mint green bg — the Bannerbear signature\n        cta: \"border-brutal border-foreground bg-cta text-cta-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Brand: Dynamic brand color bg\n        brand:\n          \"border-brutal border-foreground bg-brand text-brand-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Outline: White bg, black border, offset shadow\n        outline:\n          \"border-brutal border-foreground bg-background text-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Secondary: Light bg, border, smaller shadow\n        secondary:\n          \"border-brutal border-foreground bg-secondary text-secondary-foreground shadow-brutal-sm hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal active:translate-x-px active:translate-y-px active:shadow-none\",\n        // Ghost: No border/shadow, subtle hover\n        ghost: \"hover:bg-secondary hover:text-foreground\",\n        // Link: Text only\n        link: \"text-foreground underline-offset-4 hover:underline\",\n        // Destructive\n        destructive:\n          \"border-brutal border-destructive bg-destructive text-destructive-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Nav: Thin border, no shadow (for nav Sign In buttons)\n        nav: \"border border-foreground bg-background text-foreground hover:bg-foreground hover:text-background\",\n      },\n      size: {\n        xs: \"h-7 gap-1 px-2.5 text-xs\",\n        sm: \"h-8 gap-1.5 px-3 text-sm\",\n        default: \"h-10 gap-2 px-5 text-sm\",\n        lg: \"h-12 gap-2 px-7 text-base\",\n        xl: \"h-14 gap-2.5 px-9 text-lg\",\n        icon: \"size-10\",\n        \"icon-sm\": \"size-8\",\n        \"icon-lg\": \"size-12\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n);\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants };\n","import { cn } from \"../../lib/utils\";\n\nexport type SectionColor =\n  | \"white\"\n  | \"brand\"\n  | \"brand-muted\"\n  | \"blue\"\n  | \"gray\"\n  | \"cream\"\n  | \"black\"\n  | \"cta\";\n\nexport type SectionPattern =\n  | \"dots\"\n  | \"stripes\"\n  | \"noise\"\n  | \"grain\"\n  | \"crosshatch\"\n  | \"grid-dots\"\n  | \"gradient-mesh\"\n  | \"none\";\n\ninterface BrutalSectionProps {\n  children: React.ReactNode;\n  color?: SectionColor;\n  className?: string;\n  containerSize?: \"sm\" | \"default\" | \"lg\";\n  padding?: \"sm\" | \"default\" | \"lg\";\n  pattern?: SectionPattern;\n  /** @deprecated Use pattern=\"dots\" instead */\n  dots?: boolean;\n  /** @deprecated Use pattern=\"stripes\" instead */\n  stripes?: boolean;\n  id?: string;\n}\n\nconst colorMap: Record<SectionColor, string> = {\n  white: \"bg-background text-foreground\",\n  brand: \"bg-brand\",\n  \"brand-muted\": \"bg-brand-muted text-foreground\",\n  blue: \"bg-section-blue\",\n  gray: \"bg-section-gray text-foreground\",\n  cream: \"bg-section-cream text-foreground\",\n  black: \"bg-foreground text-background\",\n  cta: \"bg-cta\",\n};\n\nconst containerMap = {\n  sm: \"brutal-container-sm\",\n  default: \"brutal-container\",\n  lg: \"brutal-container-lg\",\n};\n\nconst paddingMap = {\n  sm: \"brutal-section-sm\",\n  default: \"brutal-section\",\n  lg: \"brutal-section py-28 sm:py-36 md:py-44\",\n};\n\nconst patternMap: Record<SectionPattern, string> = {\n  dots: \"brutal-dots\",\n  stripes: \"brutal-stripes\",\n  noise: \"brutal-noise\",\n  grain: \"brutal-grain\",\n  crosshatch: \"brutal-crosshatch\",\n  \"grid-dots\": \"brutal-grid-dots\",\n  \"gradient-mesh\": \"brutal-gradient-mesh\",\n  none: \"\",\n};\n\nexport function BrutalSection({\n  children,\n  color = \"white\",\n  className,\n  containerSize = \"default\",\n  padding = \"default\",\n  pattern,\n  dots = false,\n  stripes = false,\n  id,\n}: BrutalSectionProps) {\n  const resolvedPattern = pattern\n    ?? (dots ? \"dots\" : undefined)\n    ?? (stripes ? \"stripes\" : undefined)\n    ?? \"none\";\n\n  return (\n    <section\n      id={id}\n      className={cn(\n        paddingMap[padding],\n        colorMap[color],\n        patternMap[resolvedPattern],\n        className\n      )}\n    >\n      <div className={containerMap[containerSize]}>{children}</div>\n    </section>\n  );\n}\n","import { cn } from \"../../lib/utils\";\nimport { Button } from \"../ui/button\";\nimport { BrutalSection } from \"./section\";\nimport type { SectionColor, SectionPattern } from \"./section\";\n\ninterface BrutalCTAProps {\n  headline: string;\n  description?: string;\n  ctaText: string;\n  ctaHref?: string;\n  ctaVariant?: \"cta\" | \"brand\" | \"default\" | \"outline\";\n  secondaryText?: string;\n  secondaryHref?: string;\n  color?: SectionColor;\n  pattern?: SectionPattern;\n  className?: string;\n  variant?: \"centered\" | \"split\" | \"with-visual\" | \"floating-card\";\n  visual?: React.ReactNode;\n  stats?: string;\n}\n\nfunction CTAButtons({\n  ctaText,\n  ctaHref = \"#\",\n  ctaVariant = \"cta\",\n  secondaryText,\n  secondaryHref,\n}: Pick<\n  BrutalCTAProps,\n  \"ctaText\" | \"ctaHref\" | \"ctaVariant\" | \"secondaryText\" | \"secondaryHref\"\n>) {\n  return (\n    <div className=\"flex flex-wrap items-center justify-center gap-4\">\n      <Button\n        variant={ctaVariant}\n        size=\"xl\"\n        render={<a href={ctaHref} />}\n      >\n        {ctaText}\n      </Button>\n      {secondaryText && (\n        <Button\n          variant=\"outline\"\n          size=\"lg\"\n          render={<a href={secondaryHref || \"#\"} />}\n        >\n          {secondaryText}\n        </Button>\n      )}\n    </div>\n  );\n}\n\nfunction CenteredCTA(props: BrutalCTAProps) {\n  return (\n    <div className=\"mx-auto max-w-2xl text-center\">\n      <h2 className=\"brutal-h1 mb-6\">{props.headline}</h2>\n      {props.description && (\n        <p className=\"brutal-body mb-4 opacity-80\">{props.description}</p>\n      )}\n      {props.stats && (\n        <p className=\"brutal-label mb-8 opacity-60\">{props.stats}</p>\n      )}\n      <CTAButtons\n        ctaText={props.ctaText}\n        ctaHref={props.ctaHref}\n        ctaVariant={props.ctaVariant}\n        secondaryText={props.secondaryText}\n        secondaryHref={props.secondaryHref}\n      />\n    </div>\n  );\n}\n\nfunction SplitCTA(props: BrutalCTAProps) {\n  return (\n    <div className=\"grid items-center gap-12 lg:grid-cols-2\">\n      <div>\n        <h2 className=\"brutal-h1 mb-6\">{props.headline}</h2>\n        {props.description && (\n          <p className=\"brutal-body mb-4 opacity-80\">{props.description}</p>\n        )}\n        {props.stats && (\n          <p className=\"brutal-label mb-8 opacity-60\">{props.stats}</p>\n        )}\n        <div className=\"flex flex-wrap gap-4\">\n          <Button\n            variant={props.ctaVariant || \"cta\"}\n            size=\"xl\"\n            render={<a href={props.ctaHref || \"#\"} />}\n          >\n            {props.ctaText}\n          </Button>\n          {props.secondaryText && (\n            <Button\n              variant=\"outline\"\n              size=\"lg\"\n              render={<a href={props.secondaryHref || \"#\"} />}\n            >\n              {props.secondaryText}\n            </Button>\n          )}\n        </div>\n      </div>\n      {props.visual && <div>{props.visual}</div>}\n    </div>\n  );\n}\n\nfunction WithVisualCTA(props: BrutalCTAProps) {\n  return (\n    <div className=\"relative\">\n      {props.visual && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center opacity-10\">\n          {props.visual}\n        </div>\n      )}\n      <div className=\"relative mx-auto max-w-2xl text-center\">\n        <h2 className=\"brutal-h1 mb-6\">{props.headline}</h2>\n        {props.description && (\n          <p className=\"brutal-body mb-4 opacity-80\">{props.description}</p>\n        )}\n        {props.stats && (\n          <p className=\"brutal-label mb-8 opacity-60\">{props.stats}</p>\n        )}\n        <CTAButtons\n          ctaText={props.ctaText}\n          ctaHref={props.ctaHref}\n          ctaVariant={props.ctaVariant}\n          secondaryText={props.secondaryText}\n          secondaryHref={props.secondaryHref}\n        />\n      </div>\n    </div>\n  );\n}\n\nfunction FloatingCardCTA(props: BrutalCTAProps) {\n  return (\n    <div className=\"relative z-10 -mt-16\">\n      <div className=\"mx-auto max-w-2xl border-brutal border-foreground bg-background p-8 text-center text-foreground shadow-brutal-lg\">\n        <h2 className=\"brutal-h1 mb-6\">{props.headline}</h2>\n        {props.description && (\n          <p className=\"brutal-body mb-4 opacity-80\">{props.description}</p>\n        )}\n        {props.stats && (\n          <p className=\"brutal-label mb-8 opacity-60\">{props.stats}</p>\n        )}\n        <CTAButtons\n          ctaText={props.ctaText}\n          ctaHref={props.ctaHref}\n          ctaVariant={props.ctaVariant}\n          secondaryText={props.secondaryText}\n          secondaryHref={props.secondaryHref}\n        />\n      </div>\n    </div>\n  );\n}\n\nexport function BrutalCTA({\n  variant = \"centered\",\n  color = \"black\",\n  className,\n  pattern,\n  ...props\n}: BrutalCTAProps) {\n  // floating-card variant doesn't wrap in a section — it floats above the previous section\n  if (variant === \"floating-card\") {\n    return (\n      <div className={cn(\"brutal-container px-6\", className)}>\n        <FloatingCardCTA {...props} variant={variant} color={color} />\n      </div>\n    );\n  }\n\n  return (\n    <BrutalSection color={color} pattern={pattern} className={className}>\n      {variant === \"centered\" && <CenteredCTA {...props} variant={variant} color={color} />}\n      {variant === \"split\" && <SplitCTA {...props} variant={variant} color={color} />}\n      {variant === \"with-visual\" && <WithVisualCTA {...props} variant={variant} color={color} />}\n    </BrutalSection>\n  );\n}\n"]}

package/dist/components/brutal/faq.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface FAQItem {
+    question: string;
+    answer: string;
+}
+interface FAQProps {
+    badge?: string;
+    headline?: string;
+    items: FAQItem[];
+    color?: "white" | "gray" | "cream";
+    className?: string;
+}
+declare function FAQ({ badge, headline, items, color, className, }: FAQProps): react_jsx_runtime.JSX.Element;
+
+export { FAQ };

package/dist/components/brutal/faq.js

@@ -0,0 +1,166 @@
+"use client";
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { Accordion as Accordion$1 } from '@base-ui/react/accordion';
+import { ChevronDownIcon, ChevronUpIcon } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/lib/utils.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function Accordion({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Accordion$1.Root,
+    {
+      "data-slot": "accordion",
+      className: cn("flex w-full flex-col", className),
+      ...props
+    }
+  );
+}
+function AccordionItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Accordion$1.Item,
+    {
+      "data-slot": "accordion-item",
+      className: cn("border-brutal border-foreground rounded-lg mb-2 px-3", className),
+      ...props
+    }
+  );
+}
+function AccordionTrigger({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Accordion$1.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
+    Accordion$1.Trigger,
+    {
+      "data-slot": "accordion-trigger",
+      className: cn(
+        "group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-bold transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ChevronDownIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" }),
+        /* @__PURE__ */ jsx(ChevronUpIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" })
+      ]
+    }
+  ) });
+}
+function AccordionContent({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Accordion$1.Panel,
+    {
+      "data-slot": "accordion-content",
+      className: "overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up",
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4",
+            className
+          ),
+          children
+        }
+      )
+    }
+  );
+}
+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"
+};
+var containerMap = {
+  sm: "brutal-container-sm",
+  default: "brutal-container",
+  lg: "brutal-container-lg"
+};
+var paddingMap = {
+  sm: "brutal-section-sm",
+  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",
+    {
+      id,
+      className: cn(
+        paddingMap[padding],
+        colorMap[color],
+        patternMap[resolvedPattern],
+        className
+      ),
+      children: /* @__PURE__ */ jsx("div", { className: containerMap[containerSize], children })
+    }
+  );
+}
+function FAQ({
+  badge,
+  headline,
+  items,
+  color = "white",
+  className
+}) {
+  return /* @__PURE__ */ jsxs(BrutalSection, { color, className, children: [
+    (headline || badge) && /* @__PURE__ */ jsxs("div", { className: "mb-10 max-w-2xl", children: [
+      badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 text-muted-foreground", 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
+    )) })
+  ] });
+}
+
+export { FAQ };
+//# sourceMappingURL=faq.js.map
+//# sourceMappingURL=faq.js.map

package/dist/components/brutal/faq.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/accordion.tsx","../../../src/components/brutal/section.tsx","../../../src/components/brutal/faq.tsx"],"names":["AccordionPrimitive","jsx","jsxs"],"mappings":"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","file":"faq.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n","\"use client\"\n\nimport { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\"\n\nimport { cn } from \"../../lib/utils\"\nimport { ChevronDownIcon, ChevronUpIcon } from \"lucide-react\"\n\nfunction Accordion({ className, ...props }: AccordionPrimitive.Root.Props) {\n  return (\n    <AccordionPrimitive.Root\n      data-slot=\"accordion\"\n      className={cn(\"flex w-full flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionItem({ className, ...props }: AccordionPrimitive.Item.Props) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"border-brutal border-foreground rounded-lg mb-2 px-3\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Trigger.Props) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-bold transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden\" />\n        <ChevronUpIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Panel.Props) {\n  return (\n    <AccordionPrimitive.Panel\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up\"\n      {...props}\n    >\n      <div\n        className={cn(\n          \"h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4\",\n          className\n        )}\n      >\n        {children}\n      </div>\n    </AccordionPrimitive.Panel>\n  )\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n","import { cn } from \"../../lib/utils\";\n\nexport type SectionColor =\n  | \"white\"\n  | \"brand\"\n  | \"brand-muted\"\n  | \"blue\"\n  | \"gray\"\n  | \"cream\"\n  | \"black\"\n  | \"cta\";\n\nexport type SectionPattern =\n  | \"dots\"\n  | \"stripes\"\n  | \"noise\"\n  | \"grain\"\n  | \"crosshatch\"\n  | \"grid-dots\"\n  | \"gradient-mesh\"\n  | \"none\";\n\ninterface BrutalSectionProps {\n  children: React.ReactNode;\n  color?: SectionColor;\n  className?: string;\n  containerSize?: \"sm\" | \"default\" | \"lg\";\n  padding?: \"sm\" | \"default\" | \"lg\";\n  pattern?: SectionPattern;\n  /** @deprecated Use pattern=\"dots\" instead */\n  dots?: boolean;\n  /** @deprecated Use pattern=\"stripes\" instead */\n  stripes?: boolean;\n  id?: string;\n}\n\nconst colorMap: Record<SectionColor, string> = {\n  white: \"bg-background text-foreground\",\n  brand: \"bg-brand\",\n  \"brand-muted\": \"bg-brand-muted text-foreground\",\n  blue: \"bg-section-blue\",\n  gray: \"bg-section-gray text-foreground\",\n  cream: \"bg-section-cream text-foreground\",\n  black: \"bg-foreground text-background\",\n  cta: \"bg-cta\",\n};\n\nconst containerMap = {\n  sm: \"brutal-container-sm\",\n  default: \"brutal-container\",\n  lg: \"brutal-container-lg\",\n};\n\nconst paddingMap = {\n  sm: \"brutal-section-sm\",\n  default: \"brutal-section\",\n  lg: \"brutal-section py-28 sm:py-36 md:py-44\",\n};\n\nconst patternMap: Record<SectionPattern, string> = {\n  dots: \"brutal-dots\",\n  stripes: \"brutal-stripes\",\n  noise: \"brutal-noise\",\n  grain: \"brutal-grain\",\n  crosshatch: \"brutal-crosshatch\",\n  \"grid-dots\": \"brutal-grid-dots\",\n  \"gradient-mesh\": \"brutal-gradient-mesh\",\n  none: \"\",\n};\n\nexport function BrutalSection({\n  children,\n  color = \"white\",\n  className,\n  containerSize = \"default\",\n  padding = \"default\",\n  pattern,\n  dots = false,\n  stripes = false,\n  id,\n}: BrutalSectionProps) {\n  const resolvedPattern = pattern\n    ?? (dots ? \"dots\" : undefined)\n    ?? (stripes ? \"stripes\" : undefined)\n    ?? \"none\";\n\n  return (\n    <section\n      id={id}\n      className={cn(\n        paddingMap[padding],\n        colorMap[color],\n        patternMap[resolvedPattern],\n        className\n      )}\n    >\n      <div className={containerMap[containerSize]}>{children}</div>\n    </section>\n  );\n}\n","import { cn } from \"../../lib/utils\";\nimport { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from \"../ui/accordion\";\nimport { BrutalSection } from \"./section\";\n\ninterface FAQItem {\n  question: string;\n  answer: string;\n}\n\ninterface FAQProps {\n  badge?: string;\n  headline?: string;\n  items: FAQItem[];\n  color?: \"white\" | \"gray\" | \"cream\";\n  className?: string;\n}\n\nexport function FAQ({\n  badge,\n  headline,\n  items,\n  color = \"white\",\n  className,\n}: FAQProps) {\n  return (\n    <BrutalSection color={color} className={className}>\n      {(headline || badge) && (\n        <div className=\"mb-10 max-w-2xl\">\n          {badge && <p className=\"brutal-label mb-4 text-muted-foreground\">{badge}</p>}\n          {headline && <h2 className=\"brutal-h2\">{headline}</h2>}\n        </div>\n      )}\n      <Accordion className=\"mx-auto max-w-2xl\">\n        {items.map((item, i) => (\n          <AccordionItem\n            key={i}\n            value={`faq-${i}`}\n            className={cn(\n              \"border-brutal border-foreground mb-3 px-5\",\n              i % 2 === 0 ? \"bg-background\" : \"bg-secondary\",\n            )}\n          >\n            <AccordionTrigger className=\"brutal-h4 py-4 text-left\">\n              {item.question}\n            </AccordionTrigger>\n            <AccordionContent className=\"brutal-body pb-4 text-muted-foreground\">\n              {item.answer}\n            </AccordionContent>\n          </AccordionItem>\n        ))}\n      </Accordion>\n    </BrutalSection>\n  );\n}\n"]}

package/dist/components/brutal/feature-grid.d.ts

@@ -1,11 +1,15 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
+type FeatureGridVariant = "icon-top" | "icon-left" | "numbered" | "bento";
 interface Feature {
     icon?: React.ReactNode;
     title: string;
     description: string;
+    featured?: boolean;
+    stat?: string;
 }
 interface BrutalFeatureGridProps {
+    variant?: FeatureGridVariant;
     badge?: string;
     headline: string;
     description?: string;
@@ -14,6 +18,6 @@ interface BrutalFeatureGridProps {
     color?: "white" | "brand" | "brand-muted" | "gray" | "cream";
     className?: string;
 }
-declare function BrutalFeatureGrid({ badge, headline, description, features, columns, color, className, }: BrutalFeatureGridProps): react_jsx_runtime.JSX.Element;
+declare function BrutalFeatureGrid({ variant, badge, headline, description, features, columns, color, className, }: BrutalFeatureGridProps): react_jsx_runtime.JSX.Element;
 
 export { BrutalFeatureGrid };