/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
"use client";
import { cx } from "../../../styles/styler.js";
import { Pressable } from "../../client/Pressable.js";
import { Icon } from "../../Icon.js";
import { Text } from "../../Text.js";
import { HStack } from "../../HStack.js";
import { VStack } from "../../VStack.js";
import { SpringMotionConfig } from "../../client/SpringMotionConfig.js";
import { ChevronRight } from "@yahoo/uds-icons";
import { jsx, jsxs } from "react/jsx-runtime";
import { AnimatePresence, m } from "motion/react";
//#region src/components/experimental/client/Accordion.tsx
function Accordion({ label, children, onClick, open, spacingHorizontal = "4", spacingVertical = "4", _content, className, textProps, endAction = null, ...props }) {
	return /* @__PURE__ */ jsxs(SpringMotionConfig, {
		layoutVariant: "smooth",
		layoutSpeed: "3",
		children: [/* @__PURE__ */ jsx(Pressable, {
			asChild: true,
			display: "flex",
			flexDirection: "row",
			alignItems: "center",
			justifyContent: "space-between",
			spacingVertical,
			spacingHorizontal,
			borderRadius: "md",
			onClick,
			className: cx("hover:bg-secondary/80", "w-full", className),
			...props,
			children: /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Text, {
				variant: "title4",
				color: "primary",
				...textProps || {},
				children: label
			}), /* @__PURE__ */ jsx(HStack, {
				display: "flex",
				alignItems: "center",
				justifyContent: "space-between",
				columnGap: "2.5",
				children: /* @__PURE__ */ jsxs(AnimatePresence, {
					initial: false,
					children: [endAction && /* @__PURE__ */ jsx(m.div, {
						onClick: (e) => e.stopPropagation(),
						children: endAction
					}), /* @__PURE__ */ jsx(m.div, {
						initial: "collapsed",
						animate: open ? "open" : "collapsed",
						exit: "collapsed",
						variants: {
							open: { rotate: 90 },
							collapsed: { rotate: 0 }
						},
						"data-testid": "chevron-motion",
						children: /* @__PURE__ */ jsx(Icon, {
							name: ChevronRight,
							variant: "fill",
							size: "sm",
							color: "primary"
						})
					}, "chevron")]
				})
			})] })
		}), /* @__PURE__ */ jsx(AnimatePresence, {
			initial: false,
			children: /* @__PURE__ */ jsx(m.div, {
				initial: "collapsed",
				animate: open ? "open" : "collapsed",
				exit: "collapsed",
				variants: {
					open: { height: "auto" },
					collapsed: {
						height: 0,
						overflow: "hidden"
					}
				},
				children: /* @__PURE__ */ jsx(VStack, {
					spacingHorizontal,
					..._content,
					children
				})
			}, "content")
		})]
	});
}
Accordion.displayName = "Accordion";
//#endregion
export { Accordion };
