"use client";

// src/components/ui/banner.tsx
import * as React2 from "react";
import { cva as cva2 } from "class-variance-authority";

// src/lib/utils.ts
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
function cn(...inputs) {
  return twMerge(clsx(inputs));
}

// src/components/ui/button.tsx
import * as React from "react";
import { cva } from "class-variance-authority";
import { Slot } from "radix-ui";
import { jsx } from "react/jsx-runtime";
var buttonVariants = cva(
  "group/button inline-flex shrink-0 cursor-pointer items-center justify-center rounded-md border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
  {
    variants: {
      variant: {
        default: "bg-primary text-primary-foreground hover:bg-primary/80",
        outline: "border-input bg-background hover:bg-interactive-hover hover:text-interactive-hover-foreground aria-expanded:bg-interactive-hover aria-expanded:text-interactive-hover-foreground dark:bg-input/15 dark:hover:bg-input/25",
        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
        ghost: "hover:bg-interactive-hover hover:text-interactive-hover-foreground aria-expanded:bg-interactive-hover aria-expanded:text-interactive-hover-foreground dark:hover:bg-interactive-hover-subtle",
        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
        link: "text-primary underline-offset-4 hover:underline"
      },
      size: {
        default: "h-9 gap-1.5 px-3 has-data-[icon=inline-end]:pe-2.5 has-data-[icon=inline-start]:ps-2.5",
        xs: "h-6 gap-1 px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_svg:not([class*='size-'])]:size-3",
        sm: "h-8 gap-1 px-3 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pe-2 has-data-[icon=inline-start]:ps-2 [&_svg:not([class*='size-'])]:size-3.5",
        lg: "h-10 gap-1.5 px-4 has-data-[icon=inline-end]:pe-3.5 has-data-[icon=inline-start]:ps-3.5",
        icon: "size-9",
        "icon-xs": "size-6 in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
        "icon-sm": "size-8 in-data-[slot=button-group]:rounded-lg",
        "icon-lg": "size-10"
      }
    },
    defaultVariants: {
      variant: "default",
      size: "default"
    }
  }
);
var Button = React.forwardRef(({ className, variant = "default", size = "default", asChild = false, ...props }, ref) => {
  const Comp = asChild ? Slot.Root : "button";
  return /* @__PURE__ */ jsx(
    Comp,
    {
      ref,
      "data-slot": "button",
      "data-variant": variant,
      "data-size": size,
      className: cn(buttonVariants({ variant, size }), className),
      ...props
    }
  );
});
Button.displayName = "Button";

// src/components/ui/tooltip.tsx
import { Tooltip as TooltipPrimitive } from "radix-ui";
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
function Tooltip({
  ...props
}) {
  return /* @__PURE__ */ jsx2(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
}
function TooltipTrigger({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx2(
    TooltipPrimitive.Trigger,
    {
      "data-slot": "tooltip-trigger",
      suppressHydrationWarning: true,
      className: cn("cursor-pointer", className),
      ...props
    }
  );
}
function TooltipContent({
  className,
  sideOffset = 0,
  children,
  ...props
}) {
  return /* @__PURE__ */ jsx2(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
    TooltipPrimitive.Content,
    {
      "data-slot": "tooltip-content",
      sideOffset,
      className: cn(
        "z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pe-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-end-2 data-[side=right]:slide-in-from-start-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
        className
      ),
      ...props,
      children: [
        children,
        /* @__PURE__ */ jsx2(TooltipPrimitive.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" })
      ]
    }
  ) });
}

// src/components/ui/tip.tsx
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
function Tip({ label, children, side = "top" }) {
  return /* @__PURE__ */ jsxs2(Tooltip, { children: [
    /* @__PURE__ */ jsx3(TooltipTrigger, { asChild: true, children }),
    /* @__PURE__ */ jsx3(TooltipContent, { side, className: "flex flex-wrap items-center gap-1.5", children: label })
  ] });
}

// src/components/ui/banner.tsx
import { Fragment, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
var VARIANT_CONFIG = {
  info: {
    icon: "fa-circle-info",
    prefix: "fa-light",
    role: "status",
    live: "polite"
  },
  warning: {
    icon: "fa-triangle-exclamation",
    prefix: "fa-light",
    role: "alert",
    live: "assertive"
  },
  error: {
    icon: "fa-circle-exclamation",
    prefix: "fa-light",
    role: "alert",
    live: "assertive"
  },
  success: {
    icon: "fa-circle-check",
    prefix: "fa-light",
    role: "status",
    live: "polite"
  },
  promo: {
    icon: "fa-star-christmas text-brand",
    prefix: "fa-duotone fa-solid",
    role: "status",
    live: "polite"
  }
};
var systemBannerActionClassName = cn(
  "inline-flex shrink-0 items-center gap-1 text-inherit text-xs font-semibold",
  "underline underline-offset-2 hover:no-underline",
  "rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/50"
);
var systemBannerVariants = cva2(
  // No `overflow-hidden` on root — it clips promo `boxShadow` (glow). Clip `decorativeOverlay` in a nested layer instead.
  "relative isolate flex rounded-lg border text-sm transition-all",
  {
    variants: {
      variant: {
        /* Prominent defaults — darker shells + light foreground copy for ≥4.5:1 on the fill. */
        info: "bg-blue-900 text-blue-50 border-blue-950/35 dark:bg-blue-950 dark:text-blue-50 dark:border-blue-900/60",
        warning: "bg-amber-900 text-amber-50 border-amber-950/35 dark:bg-amber-950 dark:text-amber-50 dark:border-amber-900/60",
        error: "bg-red-900 text-red-50 border-red-950/35 dark:bg-red-950 dark:text-red-50 dark:border-red-900/60",
        success: "bg-emerald-900 text-emerald-50 border-emerald-950/35 dark:bg-emerald-950 dark:text-emerald-50 dark:border-emerald-900/60",
        promo: "bg-gradient-to-r from-brand/14 via-brand/8 to-brand/5 text-foreground border-brand/22 dark:from-brand/20 dark:via-brand/12 dark:to-brand/7 dark:border-brand/26"
      },
      /** Emphasis — "prominent" uses dark solid fills; "subtle" uses soft tinted bg. */
      emphasis: {
        prominent: "",
        subtle: ""
      },
      /** Action placement: "inline" puts the action to the right; "bottom" puts it below the text */
      actionPosition: {
        // flex-wrap so the action button drops to a second line at 200%+ zoom instead of overflowing
        inline: "flex-wrap items-center gap-3 px-4 py-2.5",
        bottom: "flex-col gap-2 px-4 py-3"
      }
    },
    compoundVariants: [
      { emphasis: "subtle", variant: "info", class: "bg-blue-500/5 text-blue-800 border-blue-500/30 dark:bg-blue-500/10 dark:text-blue-200 dark:border-blue-500/20" },
      { emphasis: "subtle", variant: "warning", class: "bg-amber-500/5 text-amber-800 border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-200 dark:border-amber-500/20" },
      { emphasis: "subtle", variant: "error", class: "bg-red-500/5 text-red-800 border-red-500/30 dark:bg-red-500/10 dark:text-red-200 dark:border-red-500/20" },
      { emphasis: "subtle", variant: "success", class: "bg-emerald-500/5 text-emerald-800 border-emerald-500/30 dark:bg-emerald-500/10 dark:text-emerald-200 dark:border-emerald-500/20" },
      { emphasis: "subtle", variant: "promo", class: "bg-brand/5 text-foreground border-brand/30 dark:bg-brand/10 dark:border-brand/20" }
    ],
    defaultVariants: { variant: "info", emphasis: "prominent", actionPosition: "inline" }
  }
);
function SystemBanner({
  children,
  title,
  variant = "info",
  emphasis = "prominent",
  dismissible = true,
  onDismiss,
  action,
  actionPosition = "inline",
  icon,
  decorativeOverlay,
  className,
  style,
  ...props
}) {
  const [dismissed, setDismissed] = React2.useState(false);
  const config = VARIANT_CONFIG[variant ?? "info"];
  function handleDismiss() {
    setDismissed(true);
    onDismiss?.();
  }
  if (dismissed) return null;
  const actionEl = action && (action.href ? /* @__PURE__ */ jsxs3(
    "a",
    {
      href: action.href,
      className: systemBannerActionClassName,
      suppressHydrationWarning: true,
      children: [
        action.label,
        /* @__PURE__ */ jsx4("i", { className: "fa-light fa-arrow-right text-xs", "aria-hidden": "true" })
      ]
    }
  ) : /* @__PURE__ */ jsxs3("button", { type: "button", onClick: action.onClick, className: systemBannerActionClassName, children: [
    action.label,
    /* @__PURE__ */ jsx4("i", { className: "fa-light fa-arrow-right text-xs", "aria-hidden": "true" })
  ] }));
  const promoOuterShadow = emphasis === "subtle" ? "0 10px 36px -6px oklch(from var(--brand-color) l c h / 0.2), 0 2px 12px -4px oklch(from var(--brand-color) l c h / 0.12)" : "0 14px 48px -8px oklch(from var(--brand-color) l c h / 0.26), 0 4px 18px -4px oklch(from var(--brand-color) l c h / 0.16)";
  return /* @__PURE__ */ jsxs3(
    "div",
    {
      role: config.role,
      "aria-live": config.live,
      className: cn(systemBannerVariants({ variant, emphasis, actionPosition }), className),
      style: {
        ...variant === "promo" ? { boxShadow: promoOuterShadow } : null,
        ...style
      },
      suppressHydrationWarning: true,
      ...props,
      children: [
        decorativeOverlay ? /* @__PURE__ */ jsx4(
          "div",
          {
            className: "pointer-events-none absolute inset-0 z-0 overflow-hidden rounded-lg",
            "aria-hidden": true,
            children: decorativeOverlay
          }
        ) : null,
        /* @__PURE__ */ jsx4(
          "i",
          {
            className: cn(
              config.prefix,
              icon ?? config.icon,
              "relative z-[1] shrink-0 text-[14px]",
              actionPosition === "bottom" ? "mt-0.5" : ""
            ),
            "aria-hidden": "true"
          }
        ),
        actionPosition === "inline" ? /* @__PURE__ */ jsxs3(Fragment, { children: [
          /* @__PURE__ */ jsxs3("div", { className: "relative z-[1] min-w-0 flex-1", children: [
            title && /* @__PURE__ */ jsx4("span", { className: "font-semibold me-1.5", children: title }),
            /* @__PURE__ */ jsx4("span", { className: "opacity-90", children })
          ] }),
          actionEl ? /* @__PURE__ */ jsx4("span", { className: "relative z-[1] inline-flex shrink-0", children: actionEl }) : null
        ] }) : /* @__PURE__ */ jsxs3("div", { className: "relative z-[1] min-w-0 flex-1", children: [
          title && /* @__PURE__ */ jsx4("p", { className: "font-semibold leading-tight mb-0.5", children: title }),
          /* @__PURE__ */ jsx4("p", { className: "opacity-90 leading-relaxed", children }),
          actionEl && /* @__PURE__ */ jsx4("div", { className: "mt-1.5", children: actionEl })
        ] }),
        dismissible && /* @__PURE__ */ jsx4(Tip, { label: "Dismiss", side: "bottom", children: /* @__PURE__ */ jsx4(
          "button",
          {
            type: "button",
            "aria-label": "Dismiss banner",
            onClick: handleDismiss,
            className: cn(
              "relative z-[2] inline-flex size-5 shrink-0 items-center justify-center rounded transition-colors",
              actionPosition === "bottom" ? "absolute top-2.5 right-2.5" : "",
              "hover:bg-current/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
            ),
            children: /* @__PURE__ */ jsx4("i", { className: "fa-light fa-xmark text-xs", "aria-hidden": "true" })
          }
        ) })
      ]
    }
  );
}
var localBannerVariants = cva2(
  "flex items-start gap-3 rounded-lg border px-4 py-3 text-sm transition-all",
  {
    variants: {
      variant: {
        info: "border-blue-500/30 bg-blue-500/5 text-blue-800 dark:bg-blue-500/10 dark:text-blue-200 dark:border-blue-500/20",
        warning: "border-amber-500/30 bg-amber-500/5 text-amber-800 dark:bg-amber-500/10 dark:text-amber-200 dark:border-amber-500/20",
        error: "border-red-500/30 bg-red-500/5 text-red-800 dark:bg-red-500/10 dark:text-red-200 dark:border-red-500/20",
        success: "border-emerald-500/30 bg-emerald-500/5 text-emerald-800 dark:bg-emerald-500/10 dark:text-emerald-200 dark:border-emerald-500/20",
        promo: "border-brand/30 bg-brand/5 text-foreground dark:bg-brand/10 dark:border-brand/20"
      }
    },
    defaultVariants: { variant: "info" }
  }
);
function LocalBanner({
  children,
  title,
  variant = "info",
  dismissible = false,
  onDismiss,
  action,
  retry,
  icon,
  className,
  ...props
}) {
  const [dismissed, setDismissed] = React2.useState(false);
  const config = VARIANT_CONFIG[variant ?? "info"];
  function handleDismiss() {
    setDismissed(true);
    onDismiss?.();
  }
  if (dismissed) return null;
  return /* @__PURE__ */ jsxs3(
    "div",
    {
      role: config.role,
      "aria-live": config.live,
      className: cn(localBannerVariants({ variant }), className),
      ...props,
      children: [
        /* @__PURE__ */ jsx4(
          "i",
          {
            className: cn(config.prefix, icon ?? config.icon, "text-[15px] shrink-0 mt-0.5"),
            "aria-hidden": "true"
          }
        ),
        /* @__PURE__ */ jsxs3("div", { className: "flex-1 min-w-0", children: [
          title && /* @__PURE__ */ jsx4("p", { className: "font-semibold leading-tight mb-0.5", children: title }),
          /* @__PURE__ */ jsx4("div", { className: "text-sm leading-relaxed opacity-90", children }),
          (action || retry) && /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2 mt-2.5", children: [
            retry && /* @__PURE__ */ jsxs3(Button, { size: "xs", variant: "outline", onClick: retry.onClick, children: [
              /* @__PURE__ */ jsx4("i", { className: "fa-light fa-arrow-rotate-right text-xs", "aria-hidden": "true" }),
              retry.label ?? "Retry"
            ] }),
            action && (action.href ? /* @__PURE__ */ jsxs3("a", { href: action.href, className: "inline-flex items-center gap-1 text-xs font-semibold underline underline-offset-2 hover:no-underline", children: [
              action.label,
              " ",
              /* @__PURE__ */ jsx4("i", { className: "fa-light fa-arrow-right text-xs", "aria-hidden": "true" })
            ] }) : /* @__PURE__ */ jsx4(Button, { size: "xs", variant: "outline", onClick: action.onClick, children: action.label }))
          ] })
        ] }),
        dismissible && /* @__PURE__ */ jsx4(Tip, { label: "Dismiss", side: "left", children: /* @__PURE__ */ jsx4(
          "button",
          {
            type: "button",
            "aria-label": "Dismiss",
            onClick: handleDismiss,
            className: cn(
              "inline-flex items-center justify-center size-5 rounded transition-colors shrink-0",
              "hover:bg-current/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
            ),
            children: /* @__PURE__ */ jsx4("i", { className: "fa-light fa-xmark text-xs", "aria-hidden": "true" })
          }
        ) })
      ]
    }
  );
}
export {
  LocalBanner,
  SystemBanner
};
//# sourceMappingURL=banner.js.map