import { cn } from "../../utils/cn.mjs";
import { Accordion } from "../Accordion/Accordion.mjs";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/components/DictionaryEditor/ItemLayout.tsx
const ItemLayout = ({ level, title, description, children, rightParam, isSelected,...props }) => /* @__PURE__ */ jsx("div", {
	className: cn("rounded-md p-2 transition", "hover:bg-card/30 [&:has(.section:hover)]:bg-transparent", level === 2 && "hover:bg-card/30", level >= 3 && "", isSelected === true && "bg-card/40"),
	...props,
	children: /* @__PURE__ */ jsx(Accordion, {
		isOpen: isSelected,
		label: title,
		header: /* @__PURE__ */ jsxs("div", {
			className: "flex w-full",
			children: [/* @__PURE__ */ jsxs("div", {
				className: "flex w-full items-center justify-between",
				children: [/* @__PURE__ */ jsx("span", {
					className: cn(level === 0 && "text-2xl", level === 1 && "text-xl", level === 2 && "text-lg", level >= 3 && "text-base"),
					children: title
				}), rightParam && /* @__PURE__ */ jsx("div", {
					className: "flex w-auto items-center justify-between p-3",
					children: rightParam
				})]
			}), description && /* @__PURE__ */ jsx("p", {
				className: "pl-3 text-card text-sm",
				children: description
			})]
		}),
		children
	})
});

//#endregion
export { ItemLayout };
//# sourceMappingURL=ItemLayout.mjs.map