import type { ReactNode } from "react"

import { cn } from "../../lib/utils"

/** Apply to the hub content wrapper when showing results (list surface under composer). */
export const DEDICATED_SEARCH_RESULTS_OUTER_CONTENT_CLASSNAME =
  "border-t border-border/40 bg-gradient-to-b from-muted/25 via-background to-background"

export interface DedicatedSearchResultsHeaderChromeProps {
  children: ReactNode
  className?: string
}

/**
 * Muted strip wrapping page chrome + composer on the results branch (below site header).
 */
export function DedicatedSearchResultsHeaderChrome({ children, className }: DedicatedSearchResultsHeaderChromeProps) {
  return <div className={cn("border-b border-border/50 bg-muted/15", className)}>{children}</div>
}