"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import * as AccordionPrimitive from "@radix-ui/react-accordion";
import { ChevronDown, Minus, Plus } from "lucide-react";
import { cva } from "class-variance-authority";
import { cn } from "@open-mercato/shared/lib/utils";
const accordionItemVariants = cva(
  // `--accordion-indent` defaults to the container padding (14px). The
  // `has-[…trigger-left-icon]` Tailwind v4 variant promotes it to 44px
  // (icon 20 + gap 10 + container padding 14) whenever an `AccordionTrigger`
  // declares a `leftIcon`, so `AccordionContent` aligns with the title text
  // — matches Figma 210:4064 (Active state) without React state or hydration
  // flash.
  "overflow-hidden rounded-[10px] transition-colors [--accordion-indent:14px] has-[[data-slot=accordion-trigger-left-icon]]:[--accordion-indent:44px]",
  {
    variants: {
      variant: {
        // Figma 210:4021 (Default), 210:4048 (Hover), 210:4064 (Active):
        // closed = white card + soft border + x-small shadow,
        // hover (closed) = weak-50 bg, no border, no shadow,
        // open = weak-50 bg, no border, no shadow.
        card: "border border-border bg-card shadow-xs data-[state=open]:border-transparent data-[state=open]:bg-muted data-[state=open]:shadow-none data-[state=closed]:hover:border-transparent data-[state=closed]:hover:bg-muted data-[state=closed]:hover:shadow-none",
        // For embedded use cases (e.g. FAQ block on a coloured surface or
        // borderless nav-style list where the surrounding container owns
        // the visual chrome).
        borderless: "border-transparent bg-transparent shadow-none"
      }
    },
    defaultVariants: { variant: "card" }
  }
);
const Accordion = AccordionPrimitive.Root;
const AccordionItem = React.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx(
  AccordionPrimitive.Item,
  {
    ref,
    "data-slot": "accordion-item",
    className: cn(accordionItemVariants({ variant }), className),
    ...props
  }
));
AccordionItem.displayName = "AccordionItem";
const AccordionHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  AccordionPrimitive.Header,
  {
    ref,
    "data-slot": "accordion-header",
    className: cn("flex", className),
    ...props
  }
));
AccordionHeader.displayName = "AccordionHeader";
const AccordionTrigger = React.forwardRef(
  ({
    className,
    leftIcon,
    triggerIcon = "plus-minus",
    iconPosition = "end",
    indicator,
    headerClassName,
    children,
    ...props
  }, ref) => {
    const indicatorNode = indicator !== void 0 ? indicator : triggerIcon === "chevron" ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-5 transition-transform duration-200 group-data-[state=open]/accordion-trigger:rotate-180", "aria-hidden": "true" }) : triggerIcon === "plus-minus" ? /* @__PURE__ */ jsxs(Fragment, { children: [
      /* @__PURE__ */ jsx(Plus, { className: "size-5 group-data-[state=open]/accordion-trigger:hidden", "aria-hidden": "true" }),
      /* @__PURE__ */ jsx(Minus, { className: "hidden size-5 group-data-[state=open]/accordion-trigger:block", "aria-hidden": "true" })
    ] }) : null;
    const renderLeftIcon = Boolean(leftIcon) && iconPosition === "end";
    return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: cn("flex", headerClassName), "data-slot": "accordion-header", children: /* @__PURE__ */ jsxs(
      AccordionPrimitive.Trigger,
      {
        ref,
        "data-slot": "accordion-trigger",
        className: cn(
          "group/accordion-trigger flex w-full items-start gap-2.5 p-3.5 text-left text-sm font-medium leading-5 tracking-tight text-foreground transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50",
          className
        ),
        ...props,
        children: [
          iconPosition === "start" && indicatorNode ? /* @__PURE__ */ jsx(
            "span",
            {
              className: "inline-flex size-5 shrink-0 items-center justify-center text-foreground",
              "data-slot": "accordion-trigger-indicator",
              "aria-hidden": "true",
              children: indicatorNode
            }
          ) : null,
          renderLeftIcon ? /* @__PURE__ */ jsx(
            "span",
            {
              className: "inline-flex size-5 shrink-0 items-center justify-center text-muted-foreground [&>svg]:size-5",
              "data-slot": "accordion-trigger-left-icon",
              "aria-hidden": "true",
              children: leftIcon
            }
          ) : null,
          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 self-center", "data-slot": "accordion-trigger-label", children }),
          iconPosition === "end" && indicatorNode ? /* @__PURE__ */ jsx(
            "span",
            {
              className: "inline-flex size-5 shrink-0 items-center justify-center text-foreground",
              "data-slot": "accordion-trigger-indicator",
              "aria-hidden": "true",
              children: indicatorNode
            }
          ) : null
        ]
      }
    ) });
  }
);
AccordionTrigger.displayName = "AccordionTrigger";
const AccordionContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
  AccordionPrimitive.Content,
  {
    ref,
    "data-slot": "accordion-content",
    className: cn(
      "overflow-hidden text-sm leading-5 text-muted-foreground data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
      className
    ),
    ...props,
    children: /* @__PURE__ */ jsx("div", { className: "pb-3.5 pt-0 pl-[var(--accordion-indent)] pr-[var(--accordion-indent)]", children })
  }
));
AccordionContent.displayName = "AccordionContent";
export {
  Accordion,
  AccordionContent,
  AccordionHeader,
  AccordionItem,
  AccordionTrigger,
  accordionItemVariants
};
//# sourceMappingURL=accordion.js.map
