@burdenoff/website-sdk 2026.828.4 → 2026.828.5

package/dist/components/explore-cta.js

@@ -51,11 +51,12 @@ function ExploreCta({
     onNavigate(href);
   };
   const classes = {
-    // `shrink-0` matters: this sits in a host header's flex row, and without it the
-    // surrounding nav gets squeezed and its links wrap onto two lines. The label is hidden
-    // below 2xl for the same reason — most product headers are already close to full at
-    // 1440px, and a 90px pill there pushes them over.
-    header: "inline-flex shrink-0 items-center gap-1.5 rounded-full bg-gradient-to-r from-primary to-primary/70 px-2.5 py-1.5 text-sm font-medium text-primary-foreground shadow-sm transition-opacity hover:opacity-90 2xl:px-3.5",
+    // A quiet icon control, deliberately NOT a second gradient pill: a header should carry one
+    // primary CTA ("Get started"), and a competing coloured button next to it reads as clutter.
+    // This matches the theme toggle's visual weight, so the row scans as [utilities] [CTA].
+    // The prominent, labelled entry point to /explore is the floating bubble, which is visible
+    // on every page without scrolling. `shrink-0` keeps it from squeezing the nav.
+    header: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
     mobile: "inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
     floating: "fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90"
   };
@@ -83,7 +84,7 @@ function ExploreCta({
           {
             className: cn(
               "shrink-0",
-              variant === "floating" ? "h-4 w-4" : "h-3.5 w-3.5"
+              variant === "floating" ? "h-4 w-4" : variant === "header" ? "h-5 w-5" : "h-3.5 w-3.5"
             ),
             "aria-hidden": "true"
           }
@@ -93,7 +94,8 @@ function ExploreCta({
           {
             className: cn(
               variant === "floating" && "hidden sm:inline",
-              variant === "header" && "hidden 2xl:inline"
+              // Never labelled in the header — see the class comment above.
+              variant === "header" && "hidden"
             ),
             children: label
           }

package/dist/components/explore-cta.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/cn.ts","../../src/components/explore-cta.tsx"],"names":["twMerge","clsx","useState","useEffect","jsxs","jsx","Sparkles"],"mappings":"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","file":"explore-cta.js","sourcesContent":["/**\n * Utility function to merge Tailwind CSS classes\n * Combines clsx and tailwind-merge for optimal class handling\n */\n\nimport { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge multiple class names intelligently\n * - Handles conditional classes via clsx\n * - Deduplicates and resolves Tailwind conflicts via tailwind-merge\n *\n * @example\n * ```ts\n * cn('px-4 py-2', 'bg-blue-500', { 'text-white': isActive })\n * // => 'px-4 py-2 bg-blue-500 text-white' (if isActive is true)\n * ```\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * ExploreCta — the entry point to `/explore` from a site's navigation.\n *\n * Three shapes of the same link, so a product site can place it once in the\n * desktop header, once in the mobile menu, and optionally as a floating bubble\n * on content pages, without any of them re-implementing the styling:\n *\n * - `header`   — a gradient sparkle pill for the desktop nav.\n * - `mobile`   — a compact full-width row for a mobile menu list.\n * - `floating` — a fixed bottom-right bubble; hides itself on `/explore`\n *                so it never covers the page it links to.\n *\n * Import from the package ROOT (`@burdenoff/website-sdk`) for consistency with\n * `ExplorePage`, which must be root-imported because of tsup's\n * `splitting: false`. This component holds no context of its own, so a\n * sub-path import also works — but keeping both on the root import is one less\n * footgun for the 38 sites that ship them together.\n *\n * @example\n * ```tsx\n * import { ExploreCta } from '@burdenoff/website-sdk'\n *\n * <ExploreCta variant=\"header\" onNavigate={(href) => navigate(href)} />\n * <ExploreCta variant=\"floating\" currentPath={location.pathname} />\n * ```\n */\n\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\nimport { Sparkles } from \"lucide-react\";\n\nimport { cn } from \"../utils/cn\";\n\nexport interface ExploreCtaProps {\n  /** Which of the three presentations to render. */\n  variant: \"header\" | \"mobile\" | \"floating\";\n  /** Target route. Default `/explore`. */\n  href?: string;\n  /** Visible label / accessible name. Default `Ask AI`. */\n  label?: string;\n  /** Extra classes for the rendered element. */\n  className?: string;\n  /** SPA navigation. When omitted the component renders a plain `<a href>`. */\n  onNavigate?: (href: string) => void;\n  /** Extra click handler (analytics, closing a mobile menu, …). */\n  onClick?: () => void;\n  /**\n   * Current route, when the host knows it (`useLocation().pathname`).\n   * Used to mark the link as `aria-current=\"page\"` and to hide the floating\n   * bubble on the Explore page itself. Falls back to `window.location.pathname`,\n   * which cannot observe SPA `pushState` navigations on its own.\n   */\n  currentPath?: string;\n}\n\n/**\n * Resolve the active path without breaking SSR/prerender: the first render\n * always returns `null` (matching the server output), and the real value lands\n * in an effect. `popstate` covers back/forward; hosts that navigate with\n * `pushState` should pass `currentPath` from their router.\n */\nfunction useCurrentPath(explicit?: string): string | null {\n  const [path, setPath] = useState<string | null>(explicit ?? null);\n\n  useEffect(() => {\n    if (explicit !== undefined) {\n      setPath(explicit);\n      return;\n    }\n    if (typeof window === \"undefined\") return;\n    const read = () => setPath(window.location.pathname);\n    read();\n    window.addEventListener(\"popstate\", read);\n    return () => window.removeEventListener(\"popstate\", read);\n  }, [explicit]);\n\n  return path;\n}\n\n/** `/explore` and `/explore/` are the same page. */\nfunction samePath(a: string | null, b: string): boolean {\n  if (!a) return false;\n  const norm = (v: string) => (v.length > 1 ? v.replace(/\\/+$/, \"\") : v);\n  return norm(a) === norm(b);\n}\n\nexport function ExploreCta({\n  variant,\n  href = \"/explore\",\n  label = \"Ask AI\",\n  className,\n  onNavigate,\n  onClick,\n  currentPath,\n}: ExploreCtaProps) {\n  const path = useCurrentPath(currentPath);\n  const isActive = samePath(path, href);\n\n  // The floating bubble exists to get visitors TO /explore. On /explore it is\n  // pure obstruction, so it removes itself.\n  if (variant === \"floating\" && isActive) return null;\n\n  const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n    onClick?.();\n    if (!onNavigate) return;\n    // Let the browser handle modified clicks (new tab, download, …).\n    if (\n      event.defaultPrevented ||\n      event.metaKey ||\n      event.ctrlKey ||\n      event.shiftKey ||\n      event.altKey ||\n      event.button !== 0\n    ) {\n      return;\n    }\n    event.preventDefault();\n    onNavigate(href);\n  };\n\n  const classes: Record<ExploreCtaProps[\"variant\"], string> = {\n    // `shrink-0` matters: this sits in a host header's flex row, and without it the\n    // surrounding nav gets squeezed and its links wrap onto two lines. The label is hidden\n    // below 2xl for the same reason — most product headers are already close to full at\n    // 1440px, and a 90px pill there pushes them over.\n    header:\n      \"inline-flex shrink-0 items-center gap-1.5 rounded-full bg-gradient-to-r from-primary to-primary/70 px-2.5 py-1.5 text-sm font-medium text-primary-foreground shadow-sm transition-opacity hover:opacity-90 2xl:px-3.5\",\n    mobile:\n      \"inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground\",\n    floating:\n      \"fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90\",\n  };\n\n  const hooks: Record<ExploreCtaProps[\"variant\"], string> = {\n    header: \"cta-header\",\n    mobile: \"cta-mobile\",\n    floating: \"cta-floating\",\n  };\n\n  return (\n    <a\n      data-boff-explore={hooks[variant]}\n      href={href}\n      onClick={handleClick}\n      aria-label={label}\n      aria-current={isActive ? \"page\" : undefined}\n      className={cn(\n        classes[variant],\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        className,\n      )}\n    >\n      <Sparkles\n        className={cn(\n          \"shrink-0\",\n          variant === \"floating\" ? \"h-4 w-4\" : \"h-3.5 w-3.5\",\n        )}\n        aria-hidden=\"true\"\n      />\n      {/* The icon alone carries the affordance where space is tight; `aria-label` carries\n          the accessible name at every width, so hiding the text costs nothing to a\n          screen reader. Floating shows its label from `sm` up, header from `2xl`. */}\n      <span\n        className={cn(\n          variant === \"floating\" && \"hidden sm:inline\",\n          variant === \"header\" && \"hidden 2xl:inline\",\n        )}\n      >\n        {label}\n      </span>\n    </a>\n  );\n}\n"]}
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/components/explore-cta.tsx"],"names":["twMerge","clsx","useState","useEffect","jsxs","jsx","Sparkles"],"mappings":"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","file":"explore-cta.js","sourcesContent":["/**\n * Utility function to merge Tailwind CSS classes\n * Combines clsx and tailwind-merge for optimal class handling\n */\n\nimport { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge multiple class names intelligently\n * - Handles conditional classes via clsx\n * - Deduplicates and resolves Tailwind conflicts via tailwind-merge\n *\n * @example\n * ```ts\n * cn('px-4 py-2', 'bg-blue-500', { 'text-white': isActive })\n * // => 'px-4 py-2 bg-blue-500 text-white' (if isActive is true)\n * ```\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * ExploreCta — the entry point to `/explore` from a site's navigation.\n *\n * Three shapes of the same link, so a product site can place it once in the\n * desktop header, once in the mobile menu, and optionally as a floating bubble\n * on content pages, without any of them re-implementing the styling:\n *\n * - `header`   — a gradient sparkle pill for the desktop nav.\n * - `mobile`   — a compact full-width row for a mobile menu list.\n * - `floating` — a fixed bottom-right bubble; hides itself on `/explore`\n *                so it never covers the page it links to.\n *\n * Import from the package ROOT (`@burdenoff/website-sdk`) for consistency with\n * `ExplorePage`, which must be root-imported because of tsup's\n * `splitting: false`. This component holds no context of its own, so a\n * sub-path import also works — but keeping both on the root import is one less\n * footgun for the 38 sites that ship them together.\n *\n * @example\n * ```tsx\n * import { ExploreCta } from '@burdenoff/website-sdk'\n *\n * <ExploreCta variant=\"header\" onNavigate={(href) => navigate(href)} />\n * <ExploreCta variant=\"floating\" currentPath={location.pathname} />\n * ```\n */\n\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\nimport { Sparkles } from \"lucide-react\";\n\nimport { cn } from \"../utils/cn\";\n\nexport interface ExploreCtaProps {\n  /** Which of the three presentations to render. */\n  variant: \"header\" | \"mobile\" | \"floating\";\n  /** Target route. Default `/explore`. */\n  href?: string;\n  /** Visible label / accessible name. Default `Ask AI`. */\n  label?: string;\n  /** Extra classes for the rendered element. */\n  className?: string;\n  /** SPA navigation. When omitted the component renders a plain `<a href>`. */\n  onNavigate?: (href: string) => void;\n  /** Extra click handler (analytics, closing a mobile menu, …). */\n  onClick?: () => void;\n  /**\n   * Current route, when the host knows it (`useLocation().pathname`).\n   * Used to mark the link as `aria-current=\"page\"` and to hide the floating\n   * bubble on the Explore page itself. Falls back to `window.location.pathname`,\n   * which cannot observe SPA `pushState` navigations on its own.\n   */\n  currentPath?: string;\n}\n\n/**\n * Resolve the active path without breaking SSR/prerender: the first render\n * always returns `null` (matching the server output), and the real value lands\n * in an effect. `popstate` covers back/forward; hosts that navigate with\n * `pushState` should pass `currentPath` from their router.\n */\nfunction useCurrentPath(explicit?: string): string | null {\n  const [path, setPath] = useState<string | null>(explicit ?? null);\n\n  useEffect(() => {\n    if (explicit !== undefined) {\n      setPath(explicit);\n      return;\n    }\n    if (typeof window === \"undefined\") return;\n    const read = () => setPath(window.location.pathname);\n    read();\n    window.addEventListener(\"popstate\", read);\n    return () => window.removeEventListener(\"popstate\", read);\n  }, [explicit]);\n\n  return path;\n}\n\n/** `/explore` and `/explore/` are the same page. */\nfunction samePath(a: string | null, b: string): boolean {\n  if (!a) return false;\n  const norm = (v: string) => (v.length > 1 ? v.replace(/\\/+$/, \"\") : v);\n  return norm(a) === norm(b);\n}\n\nexport function ExploreCta({\n  variant,\n  href = \"/explore\",\n  label = \"Ask AI\",\n  className,\n  onNavigate,\n  onClick,\n  currentPath,\n}: ExploreCtaProps) {\n  const path = useCurrentPath(currentPath);\n  const isActive = samePath(path, href);\n\n  // The floating bubble exists to get visitors TO /explore. On /explore it is\n  // pure obstruction, so it removes itself.\n  if (variant === \"floating\" && isActive) return null;\n\n  const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n    onClick?.();\n    if (!onNavigate) return;\n    // Let the browser handle modified clicks (new tab, download, …).\n    if (\n      event.defaultPrevented ||\n      event.metaKey ||\n      event.ctrlKey ||\n      event.shiftKey ||\n      event.altKey ||\n      event.button !== 0\n    ) {\n      return;\n    }\n    event.preventDefault();\n    onNavigate(href);\n  };\n\n  const classes: Record<ExploreCtaProps[\"variant\"], string> = {\n    // A quiet icon control, deliberately NOT a second gradient pill: a header should carry one\n    // primary CTA (\"Get started\"), and a competing coloured button next to it reads as clutter.\n    // This matches the theme toggle's visual weight, so the row scans as [utilities] [CTA].\n    // The prominent, labelled entry point to /explore is the floating bubble, which is visible\n    // on every page without scrolling. `shrink-0` keeps it from squeezing the nav.\n    header:\n      \"inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground\",\n    mobile:\n      \"inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground\",\n    floating:\n      \"fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90\",\n  };\n\n  const hooks: Record<ExploreCtaProps[\"variant\"], string> = {\n    header: \"cta-header\",\n    mobile: \"cta-mobile\",\n    floating: \"cta-floating\",\n  };\n\n  return (\n    <a\n      data-boff-explore={hooks[variant]}\n      href={href}\n      onClick={handleClick}\n      aria-label={label}\n      aria-current={isActive ? \"page\" : undefined}\n      className={cn(\n        classes[variant],\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        className,\n      )}\n    >\n      <Sparkles\n        className={cn(\n          \"shrink-0\",\n          variant === \"floating\"\n            ? \"h-4 w-4\"\n            : variant === \"header\"\n              ? \"h-5 w-5\"\n              : \"h-3.5 w-3.5\",\n        )}\n        aria-hidden=\"true\"\n      />\n      {/* The icon alone carries the affordance where space is tight; `aria-label` carries\n          the accessible name at every width, so hiding the text costs nothing to a\n          screen reader. Floating shows its label from `sm` up, header from `2xl`. */}\n      <span\n        className={cn(\n          variant === \"floating\" && \"hidden sm:inline\",\n          // Never labelled in the header — see the class comment above.\n          variant === \"header\" && \"hidden\",\n        )}\n      >\n        {label}\n      </span>\n    </a>\n  );\n}\n"]}

package/dist/components/explore-cta.mjs

@@ -49,11 +49,12 @@ function ExploreCta({
     onNavigate(href);
   };
   const classes = {
-    // `shrink-0` matters: this sits in a host header's flex row, and without it the
-    // surrounding nav gets squeezed and its links wrap onto two lines. The label is hidden
-    // below 2xl for the same reason — most product headers are already close to full at
-    // 1440px, and a 90px pill there pushes them over.
-    header: "inline-flex shrink-0 items-center gap-1.5 rounded-full bg-gradient-to-r from-primary to-primary/70 px-2.5 py-1.5 text-sm font-medium text-primary-foreground shadow-sm transition-opacity hover:opacity-90 2xl:px-3.5",
+    // A quiet icon control, deliberately NOT a second gradient pill: a header should carry one
+    // primary CTA ("Get started"), and a competing coloured button next to it reads as clutter.
+    // This matches the theme toggle's visual weight, so the row scans as [utilities] [CTA].
+    // The prominent, labelled entry point to /explore is the floating bubble, which is visible
+    // on every page without scrolling. `shrink-0` keeps it from squeezing the nav.
+    header: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
     mobile: "inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
     floating: "fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90"
   };
@@ -81,7 +82,7 @@ function ExploreCta({
           {
             className: cn(
               "shrink-0",
-              variant === "floating" ? "h-4 w-4" : "h-3.5 w-3.5"
+              variant === "floating" ? "h-4 w-4" : variant === "header" ? "h-5 w-5" : "h-3.5 w-3.5"
             ),
             "aria-hidden": "true"
           }
@@ -91,7 +92,8 @@ function ExploreCta({
           {
             className: cn(
               variant === "floating" && "hidden sm:inline",
-              variant === "header" && "hidden 2xl:inline"
+              // Never labelled in the header — see the class comment above.
+              variant === "header" && "hidden"
             ),
             children: label
           }

package/dist/components/explore-cta.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/cn.ts","../../src/components/explore-cta.tsx"],"names":[],"mappings":"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","file":"explore-cta.mjs","sourcesContent":["/**\n * Utility function to merge Tailwind CSS classes\n * Combines clsx and tailwind-merge for optimal class handling\n */\n\nimport { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge multiple class names intelligently\n * - Handles conditional classes via clsx\n * - Deduplicates and resolves Tailwind conflicts via tailwind-merge\n *\n * @example\n * ```ts\n * cn('px-4 py-2', 'bg-blue-500', { 'text-white': isActive })\n * // => 'px-4 py-2 bg-blue-500 text-white' (if isActive is true)\n * ```\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * ExploreCta — the entry point to `/explore` from a site's navigation.\n *\n * Three shapes of the same link, so a product site can place it once in the\n * desktop header, once in the mobile menu, and optionally as a floating bubble\n * on content pages, without any of them re-implementing the styling:\n *\n * - `header`   — a gradient sparkle pill for the desktop nav.\n * - `mobile`   — a compact full-width row for a mobile menu list.\n * - `floating` — a fixed bottom-right bubble; hides itself on `/explore`\n *                so it never covers the page it links to.\n *\n * Import from the package ROOT (`@burdenoff/website-sdk`) for consistency with\n * `ExplorePage`, which must be root-imported because of tsup's\n * `splitting: false`. This component holds no context of its own, so a\n * sub-path import also works — but keeping both on the root import is one less\n * footgun for the 38 sites that ship them together.\n *\n * @example\n * ```tsx\n * import { ExploreCta } from '@burdenoff/website-sdk'\n *\n * <ExploreCta variant=\"header\" onNavigate={(href) => navigate(href)} />\n * <ExploreCta variant=\"floating\" currentPath={location.pathname} />\n * ```\n */\n\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\nimport { Sparkles } from \"lucide-react\";\n\nimport { cn } from \"../utils/cn\";\n\nexport interface ExploreCtaProps {\n  /** Which of the three presentations to render. */\n  variant: \"header\" | \"mobile\" | \"floating\";\n  /** Target route. Default `/explore`. */\n  href?: string;\n  /** Visible label / accessible name. Default `Ask AI`. */\n  label?: string;\n  /** Extra classes for the rendered element. */\n  className?: string;\n  /** SPA navigation. When omitted the component renders a plain `<a href>`. */\n  onNavigate?: (href: string) => void;\n  /** Extra click handler (analytics, closing a mobile menu, …). */\n  onClick?: () => void;\n  /**\n   * Current route, when the host knows it (`useLocation().pathname`).\n   * Used to mark the link as `aria-current=\"page\"` and to hide the floating\n   * bubble on the Explore page itself. Falls back to `window.location.pathname`,\n   * which cannot observe SPA `pushState` navigations on its own.\n   */\n  currentPath?: string;\n}\n\n/**\n * Resolve the active path without breaking SSR/prerender: the first render\n * always returns `null` (matching the server output), and the real value lands\n * in an effect. `popstate` covers back/forward; hosts that navigate with\n * `pushState` should pass `currentPath` from their router.\n */\nfunction useCurrentPath(explicit?: string): string | null {\n  const [path, setPath] = useState<string | null>(explicit ?? null);\n\n  useEffect(() => {\n    if (explicit !== undefined) {\n      setPath(explicit);\n      return;\n    }\n    if (typeof window === \"undefined\") return;\n    const read = () => setPath(window.location.pathname);\n    read();\n    window.addEventListener(\"popstate\", read);\n    return () => window.removeEventListener(\"popstate\", read);\n  }, [explicit]);\n\n  return path;\n}\n\n/** `/explore` and `/explore/` are the same page. */\nfunction samePath(a: string | null, b: string): boolean {\n  if (!a) return false;\n  const norm = (v: string) => (v.length > 1 ? v.replace(/\\/+$/, \"\") : v);\n  return norm(a) === norm(b);\n}\n\nexport function ExploreCta({\n  variant,\n  href = \"/explore\",\n  label = \"Ask AI\",\n  className,\n  onNavigate,\n  onClick,\n  currentPath,\n}: ExploreCtaProps) {\n  const path = useCurrentPath(currentPath);\n  const isActive = samePath(path, href);\n\n  // The floating bubble exists to get visitors TO /explore. On /explore it is\n  // pure obstruction, so it removes itself.\n  if (variant === \"floating\" && isActive) return null;\n\n  const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n    onClick?.();\n    if (!onNavigate) return;\n    // Let the browser handle modified clicks (new tab, download, …).\n    if (\n      event.defaultPrevented ||\n      event.metaKey ||\n      event.ctrlKey ||\n      event.shiftKey ||\n      event.altKey ||\n      event.button !== 0\n    ) {\n      return;\n    }\n    event.preventDefault();\n    onNavigate(href);\n  };\n\n  const classes: Record<ExploreCtaProps[\"variant\"], string> = {\n    // `shrink-0` matters: this sits in a host header's flex row, and without it the\n    // surrounding nav gets squeezed and its links wrap onto two lines. The label is hidden\n    // below 2xl for the same reason — most product headers are already close to full at\n    // 1440px, and a 90px pill there pushes them over.\n    header:\n      \"inline-flex shrink-0 items-center gap-1.5 rounded-full bg-gradient-to-r from-primary to-primary/70 px-2.5 py-1.5 text-sm font-medium text-primary-foreground shadow-sm transition-opacity hover:opacity-90 2xl:px-3.5\",\n    mobile:\n      \"inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground\",\n    floating:\n      \"fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90\",\n  };\n\n  const hooks: Record<ExploreCtaProps[\"variant\"], string> = {\n    header: \"cta-header\",\n    mobile: \"cta-mobile\",\n    floating: \"cta-floating\",\n  };\n\n  return (\n    <a\n      data-boff-explore={hooks[variant]}\n      href={href}\n      onClick={handleClick}\n      aria-label={label}\n      aria-current={isActive ? \"page\" : undefined}\n      className={cn(\n        classes[variant],\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        className,\n      )}\n    >\n      <Sparkles\n        className={cn(\n          \"shrink-0\",\n          variant === \"floating\" ? \"h-4 w-4\" : \"h-3.5 w-3.5\",\n        )}\n        aria-hidden=\"true\"\n      />\n      {/* The icon alone carries the affordance where space is tight; `aria-label` carries\n          the accessible name at every width, so hiding the text costs nothing to a\n          screen reader. Floating shows its label from `sm` up, header from `2xl`. */}\n      <span\n        className={cn(\n          variant === \"floating\" && \"hidden sm:inline\",\n          variant === \"header\" && \"hidden 2xl:inline\",\n        )}\n      >\n        {label}\n      </span>\n    </a>\n  );\n}\n"]}
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/components/explore-cta.tsx"],"names":[],"mappings":"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","file":"explore-cta.mjs","sourcesContent":["/**\n * Utility function to merge Tailwind CSS classes\n * Combines clsx and tailwind-merge for optimal class handling\n */\n\nimport { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge multiple class names intelligently\n * - Handles conditional classes via clsx\n * - Deduplicates and resolves Tailwind conflicts via tailwind-merge\n *\n * @example\n * ```ts\n * cn('px-4 py-2', 'bg-blue-500', { 'text-white': isActive })\n * // => 'px-4 py-2 bg-blue-500 text-white' (if isActive is true)\n * ```\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * ExploreCta — the entry point to `/explore` from a site's navigation.\n *\n * Three shapes of the same link, so a product site can place it once in the\n * desktop header, once in the mobile menu, and optionally as a floating bubble\n * on content pages, without any of them re-implementing the styling:\n *\n * - `header`   — a gradient sparkle pill for the desktop nav.\n * - `mobile`   — a compact full-width row for a mobile menu list.\n * - `floating` — a fixed bottom-right bubble; hides itself on `/explore`\n *                so it never covers the page it links to.\n *\n * Import from the package ROOT (`@burdenoff/website-sdk`) for consistency with\n * `ExplorePage`, which must be root-imported because of tsup's\n * `splitting: false`. This component holds no context of its own, so a\n * sub-path import also works — but keeping both on the root import is one less\n * footgun for the 38 sites that ship them together.\n *\n * @example\n * ```tsx\n * import { ExploreCta } from '@burdenoff/website-sdk'\n *\n * <ExploreCta variant=\"header\" onNavigate={(href) => navigate(href)} />\n * <ExploreCta variant=\"floating\" currentPath={location.pathname} />\n * ```\n */\n\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\nimport { Sparkles } from \"lucide-react\";\n\nimport { cn } from \"../utils/cn\";\n\nexport interface ExploreCtaProps {\n  /** Which of the three presentations to render. */\n  variant: \"header\" | \"mobile\" | \"floating\";\n  /** Target route. Default `/explore`. */\n  href?: string;\n  /** Visible label / accessible name. Default `Ask AI`. */\n  label?: string;\n  /** Extra classes for the rendered element. */\n  className?: string;\n  /** SPA navigation. When omitted the component renders a plain `<a href>`. */\n  onNavigate?: (href: string) => void;\n  /** Extra click handler (analytics, closing a mobile menu, …). */\n  onClick?: () => void;\n  /**\n   * Current route, when the host knows it (`useLocation().pathname`).\n   * Used to mark the link as `aria-current=\"page\"` and to hide the floating\n   * bubble on the Explore page itself. Falls back to `window.location.pathname`,\n   * which cannot observe SPA `pushState` navigations on its own.\n   */\n  currentPath?: string;\n}\n\n/**\n * Resolve the active path without breaking SSR/prerender: the first render\n * always returns `null` (matching the server output), and the real value lands\n * in an effect. `popstate` covers back/forward; hosts that navigate with\n * `pushState` should pass `currentPath` from their router.\n */\nfunction useCurrentPath(explicit?: string): string | null {\n  const [path, setPath] = useState<string | null>(explicit ?? null);\n\n  useEffect(() => {\n    if (explicit !== undefined) {\n      setPath(explicit);\n      return;\n    }\n    if (typeof window === \"undefined\") return;\n    const read = () => setPath(window.location.pathname);\n    read();\n    window.addEventListener(\"popstate\", read);\n    return () => window.removeEventListener(\"popstate\", read);\n  }, [explicit]);\n\n  return path;\n}\n\n/** `/explore` and `/explore/` are the same page. */\nfunction samePath(a: string | null, b: string): boolean {\n  if (!a) return false;\n  const norm = (v: string) => (v.length > 1 ? v.replace(/\\/+$/, \"\") : v);\n  return norm(a) === norm(b);\n}\n\nexport function ExploreCta({\n  variant,\n  href = \"/explore\",\n  label = \"Ask AI\",\n  className,\n  onNavigate,\n  onClick,\n  currentPath,\n}: ExploreCtaProps) {\n  const path = useCurrentPath(currentPath);\n  const isActive = samePath(path, href);\n\n  // The floating bubble exists to get visitors TO /explore. On /explore it is\n  // pure obstruction, so it removes itself.\n  if (variant === \"floating\" && isActive) return null;\n\n  const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n    onClick?.();\n    if (!onNavigate) return;\n    // Let the browser handle modified clicks (new tab, download, …).\n    if (\n      event.defaultPrevented ||\n      event.metaKey ||\n      event.ctrlKey ||\n      event.shiftKey ||\n      event.altKey ||\n      event.button !== 0\n    ) {\n      return;\n    }\n    event.preventDefault();\n    onNavigate(href);\n  };\n\n  const classes: Record<ExploreCtaProps[\"variant\"], string> = {\n    // A quiet icon control, deliberately NOT a second gradient pill: a header should carry one\n    // primary CTA (\"Get started\"), and a competing coloured button next to it reads as clutter.\n    // This matches the theme toggle's visual weight, so the row scans as [utilities] [CTA].\n    // The prominent, labelled entry point to /explore is the floating bubble, which is visible\n    // on every page without scrolling. `shrink-0` keeps it from squeezing the nav.\n    header:\n      \"inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground\",\n    mobile:\n      \"inline-flex w-full items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-sm font-medium text-card-foreground transition-colors hover:bg-accent hover:text-accent-foreground\",\n    floating:\n      \"fixed bottom-5 right-5 z-40 inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-primary to-primary/70 px-4 py-3 text-sm font-medium text-primary-foreground shadow-lg transition-opacity hover:opacity-90\",\n  };\n\n  const hooks: Record<ExploreCtaProps[\"variant\"], string> = {\n    header: \"cta-header\",\n    mobile: \"cta-mobile\",\n    floating: \"cta-floating\",\n  };\n\n  return (\n    <a\n      data-boff-explore={hooks[variant]}\n      href={href}\n      onClick={handleClick}\n      aria-label={label}\n      aria-current={isActive ? \"page\" : undefined}\n      className={cn(\n        classes[variant],\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        className,\n      )}\n    >\n      <Sparkles\n        className={cn(\n          \"shrink-0\",\n          variant === \"floating\"\n            ? \"h-4 w-4\"\n            : variant === \"header\"\n              ? \"h-5 w-5\"\n              : \"h-3.5 w-3.5\",\n        )}\n        aria-hidden=\"true\"\n      />\n      {/* The icon alone carries the affordance where space is tight; `aria-label` carries\n          the accessible name at every width, so hiding the text costs nothing to a\n          screen reader. Floating shows its label from `sm` up, header from `2xl`. */}\n      <span\n        className={cn(\n          variant === \"floating\" && \"hidden sm:inline\",\n          // Never labelled in the header — see the class comment above.\n          variant === \"header\" && \"hidden\",\n        )}\n      >\n        {label}\n      </span>\n    </a>\n  );\n}\n"]}