"use client";

// src/components/ui/avatar.tsx
import { Check, Plus } from "lucide-react";
import { Avatar as AvatarPrimitive } from "radix-ui";
import { cva } 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/avatar.tsx
import { jsx, jsxs } from "react/jsx-runtime";
var avatarRootVariants = cva(
  "group/avatar relative flex shrink-0 overflow-hidden select-none",
  {
    variants: {
      size: {
        sm: "size-6",
        default: "size-8",
        lg: "size-10"
      },
      shape: {
        circle: "rounded-full",
        square: "rounded-none",
        "rounded-sm": "rounded-sm",
        "rounded-md": "rounded-md",
        "rounded-lg": "rounded-lg",
        "rounded-xl": "rounded-xl"
      },
      variant: {
        default: "",
        ring: "ring-2 ring-ring",
        "ring-offset": "ring-2 ring-ring ring-offset-2 ring-offset-background",
        group: "ring-2 ring-background"
      }
    },
    defaultVariants: {
      size: "default",
      shape: "circle",
      variant: "default"
    }
  }
);
var AVATAR_INSET_AFTER = {
  circle: "after:rounded-full",
  square: "after:rounded-none",
  "rounded-sm": "after:rounded-sm",
  "rounded-md": "after:rounded-md",
  "rounded-lg": "after:rounded-lg",
  "rounded-xl": "after:rounded-xl"
};
var avatarImageShape = cn(
  "aspect-square size-full object-cover",
  "group-data-[shape=circle]/avatar:rounded-full",
  "group-data-[shape=square]/avatar:rounded-none",
  "group-data-[shape=rounded-sm]/avatar:rounded-sm",
  "group-data-[shape=rounded-md]/avatar:rounded-md",
  "group-data-[shape=rounded-lg]/avatar:rounded-lg",
  "group-data-[shape=rounded-xl]/avatar:rounded-xl"
);
var avatarFallbackShape = cn(
  "flex size-full items-center justify-center bg-muted text-sm text-muted-foreground",
  "group-data-[shape=circle]/avatar:rounded-full",
  "group-data-[shape=square]/avatar:rounded-none",
  "group-data-[shape=rounded-sm]/avatar:rounded-sm",
  "group-data-[shape=rounded-md]/avatar:rounded-md",
  "group-data-[shape=rounded-lg]/avatar:rounded-lg",
  "group-data-[shape=rounded-xl]/avatar:rounded-xl",
  "group-data-[size=sm]/avatar:text-xs"
);
function Avatar({
  className,
  size = "default",
  shape = "circle",
  variant = "default",
  insetBorder = false,
  ...props
}) {
  const shapeKey = shape ?? "circle";
  const insetClass = insetBorder && cn(
    "after:pointer-events-none after:absolute after:inset-0 after:border after:border-border after:mix-blend-darken dark:after:mix-blend-lighten",
    AVATAR_INSET_AFTER[shapeKey]
  );
  return /* @__PURE__ */ jsx(
    AvatarPrimitive.Root,
    {
      "data-slot": "avatar",
      "data-size": size,
      "data-shape": shape,
      className: cn(avatarRootVariants({ size, shape, variant }), insetClass, className),
      ...props
    }
  );
}
function AvatarImage({
  className,
  referrerPolicy = "no-referrer",
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AvatarPrimitive.Image,
    {
      "data-slot": "avatar-image",
      referrerPolicy,
      className: cn(avatarImageShape, className),
      ...props
    }
  );
}
function AvatarFallback({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AvatarPrimitive.Fallback,
    {
      "data-slot": "avatar-fallback",
      className: cn(avatarFallbackShape, className),
      ...props
    }
  );
}

// src/components/ui/button.tsx
import * as React from "react";
import { cva as cva2 } from "class-variance-authority";
import { Slot } from "radix-ui";
import { jsx as jsx2 } from "react/jsx-runtime";
var buttonVariants = cva2(
  "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__ */ jsx2(
    Comp,
    {
      ref,
      "data-slot": "button",
      "data-variant": variant,
      "data-size": size,
      className: cn(buttonVariants({ variant, size }), className),
      ...props
    }
  );
});
Button.displayName = "Button";

// src/components/ui/separator.tsx
import { Separator as SeparatorPrimitive } from "radix-ui";
import { jsx as jsx3 } from "react/jsx-runtime";
function Separator({
  className,
  orientation = "horizontal",
  decorative = true,
  ...props
}) {
  return /* @__PURE__ */ jsx3(
    SeparatorPrimitive.Root,
    {
      "data-slot": "separator",
      decorative,
      orientation,
      className: cn(
        "shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch",
        className
      ),
      ...props
    }
  );
}

// src/components/ui/tooltip.tsx
import { Tooltip as TooltipPrimitive } from "radix-ui";
import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
function Tooltip({
  ...props
}) {
  return /* @__PURE__ */ jsx4(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
}
function TooltipTrigger({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx4(
    TooltipPrimitive.Trigger,
    {
      "data-slot": "tooltip-trigger",
      suppressHydrationWarning: true,
      className: cn("cursor-pointer", className),
      ...props
    }
  );
}
function TooltipContent({
  className,
  sideOffset = 0,
  children,
  ...props
}) {
  return /* @__PURE__ */ jsx4(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
    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__ */ jsx4(TooltipPrimitive.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" })
      ]
    }
  ) });
}

// src/components/ui/page-header.tsx
import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
function PageHeaderCollaborationAccess({
  people,
  limit,
  onOpenCollaborators,
  addCollaboratorLabel
}) {
  if (people.length === 0) {
    return /* @__PURE__ */ jsx5(
      "div",
      {
        role: "group",
        "aria-label": "People with access",
        className: "flex shrink-0 items-center",
        children: /* @__PURE__ */ jsxs3(
          Button,
          {
            type: "button",
            variant: "outline",
            size: "lg",
            onClick: onOpenCollaborators,
            disabled: !onOpenCollaborators,
            children: [
              /* @__PURE__ */ jsx5("i", { className: "fa-light fa-user-plus", "aria-hidden": "true" }),
              addCollaboratorLabel
            ]
          }
        )
      }
    );
  }
  const visible = people.slice(0, limit);
  const overflow = Math.max(0, people.length - visible.length);
  const names = people.map((p) => p.name).join(", ");
  return /* @__PURE__ */ jsx5(
    "div",
    {
      role: "group",
      "aria-label": names ? `People with access: ${names}` : "People with access",
      className: "flex shrink-0 items-center gap-2 sm:gap-2.5",
      children: /* @__PURE__ */ jsxs3("div", { className: "flex shrink-0 items-center gap-1.5", children: [
        visible.map((c) => /* @__PURE__ */ jsxs3(Tooltip, { children: [
          /* @__PURE__ */ jsx5(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx5(
            "button",
            {
              type: "button",
              className: "relative shrink-0 rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
              "aria-label": `Open collaborators \u2014 ${c.name}`,
              onClick: onOpenCollaborators,
              disabled: !onOpenCollaborators,
              children: /* @__PURE__ */ jsxs3(Avatar, { size: "sm", shape: "circle", className: "pointer-events-none", children: [
                c.imageUrl ? /* @__PURE__ */ jsx5(AvatarImage, { src: c.imageUrl, alt: "", referrerPolicy: "no-referrer" }) : null,
                /* @__PURE__ */ jsx5(AvatarFallback, { className: "text-xs font-semibold", children: (c.initials ?? c.name.slice(0, 2)).toUpperCase() })
              ] })
            }
          ) }),
          /* @__PURE__ */ jsx5(TooltipContent, { side: "bottom", children: c.name })
        ] }, c.id)),
        overflow > 0 && /* @__PURE__ */ jsxs3(
          "button",
          {
            type: "button",
            className: "flex size-6 shrink-0 items-center justify-center rounded-full bg-muted text-[11px] font-semibold tabular-nums text-muted-foreground ring-1 ring-border/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
            "aria-label": `Open collaborators \u2014 ${overflow} more people with access`,
            onClick: onOpenCollaborators,
            disabled: !onOpenCollaborators,
            children: [
              "+",
              overflow
            ]
          }
        )
      ] })
    }
  );
}
function PageHeader({
  title,
  subtitle,
  variant = "default",
  accessInfo,
  collaborators,
  collaboratorDisplayLimit = 3,
  onCollaboratorsOpen,
  addCollaboratorLabel = "Add collaborator",
  actions,
  className,
  showTitleBlock = true
}) {
  const isCollaboration = variant === "collaboration";
  const showAccess = Boolean(isCollaboration && accessInfo);
  const showCollaborationAccess = isCollaboration;
  const showActionsColumn = Boolean(actions) || showCollaborationAccess;
  const showCollaboratorActionsSeparator = showCollaborationAccess && Boolean(actions);
  return /* @__PURE__ */ jsxs3(
    "div",
    {
      className: cn(
        "flex flex-col gap-1 px-4 pt-2 pb-4 lg:px-6",
        "sm:flex-row sm:items-end sm:gap-4",
        showTitleBlock ? "sm:justify-between" : "sm:justify-end",
        className
      ),
      children: [
        /* @__PURE__ */ jsxs3("div", { className: cn("flex min-w-0 flex-col gap-0.5", !showTitleBlock && "sr-only"), children: [
          /* @__PURE__ */ jsx5(
            "h1",
            {
              className: "text-2xl font-semibold tracking-tight leading-tight text-foreground",
              style: { fontFamily: "var(--font-heading)" },
              suppressHydrationWarning: true,
              children: title
            }
          ),
          showAccess && /* @__PURE__ */ jsx5("div", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 text-xs leading-snug text-muted-foreground", children: accessInfo }),
          subtitle && /* @__PURE__ */ jsx5("p", { className: "text-sm text-muted-foreground leading-none", children: subtitle })
        ] }),
        showActionsColumn && /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap items-center gap-2 sm:gap-3 shrink-0 sm:ms-auto sm:justify-end", children: [
          showCollaborationAccess ? /* @__PURE__ */ jsx5(
            PageHeaderCollaborationAccess,
            {
              people: collaborators ?? [],
              limit: collaboratorDisplayLimit,
              onOpenCollaborators: onCollaboratorsOpen,
              addCollaboratorLabel
            }
          ) : null,
          showCollaboratorActionsSeparator ? /* @__PURE__ */ jsx5(
            Separator,
            {
              orientation: "vertical",
              decorative: true,
              className: "h-8 shrink-0"
            }
          ) : null,
          actions
        ] })
      ]
    }
  );
}
export {
  PageHeader
};
//# sourceMappingURL=page-header.js.map