import { cn } from "./index3.js";
import { Avatar } from "./index15.js";
import { cva } from "class-variance-authority";
import * as React from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
import { mergeProps } from "@base-ui/react/merge-props";
import { useRender } from "@base-ui/react/use-render";
//#region src/components/molecules/data/Item/Item.tsx
var ItemGroupContext = React.createContext(false);
var itemVariants = cva("group/item flex items-center gap-4 rounded-xl motion-safe:transition-[background-color,transform] motion-safe:duration-150 hover:bg-accent/50 focus-visible:outline-2 focus-visible:outline-ring/50 focus-visible:outline-offset-2", {
	variants: {
		variant: {
			default: "",
			outline: "border border-border",
			muted: "bg-muted"
		},
		size: {
			default: "p-4",
			sm: "px-4 py-3"
		}
	},
	defaultVariants: {
		variant: "default",
		size: "default"
	}
});
var ItemRoot = React.forwardRef(({ title, description, leading, trailing, variant, size, className, render, ...props }, ref) => {
	const inGroup = React.useContext(ItemGroupContext);
	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
		leading && /* @__PURE__ */ jsx("div", {
			"data-slot": "item-leading",
			className: "shrink-0",
			children: leading
		}),
		/* @__PURE__ */ jsxs("div", {
			"data-slot": "item-content",
			className: "flex flex-1 flex-col gap-1 min-w-0",
			children: [/* @__PURE__ */ jsx("span", {
				className: "text-sm font-medium text-foreground",
				children: title
			}), description && size !== "sm" && /* @__PURE__ */ jsx("span", {
				className: "text-sm text-muted-foreground",
				children: description
			})]
		}),
		trailing && /* @__PURE__ */ jsx("div", {
			"data-slot": "item-trailing",
			className: "shrink-0 motion-safe:transition-transform motion-safe:duration-150 group-hover/item:translate-x-0.5",
			children: trailing
		})
	] });
	return useRender({
		defaultTagName: "div",
		render,
		ref,
		props: mergeProps({
			className: cn(itemVariants({
				variant,
				size
			}), className),
			children: content,
			role: inGroup ? "listitem" : void 0
		}, props),
		state: { slot: "item" }
	});
});
ItemRoot.displayName = "Item";
function ItemAvatar({ src, fallback, size = "md" }) {
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "item-avatar",
		children: /* @__PURE__ */ jsx(Avatar, {
			src,
			fallback,
			size
		})
	});
}
ItemAvatar.displayName = "Item.Avatar";
var iconColorMap = {
	default: "bg-muted text-muted-foreground",
	primary: "bg-primary/10 text-primary",
	success: "bg-success/10 text-success",
	warning: "bg-warning/10 text-warning",
	error: "bg-destructive/10 text-destructive"
};
function ItemIcon({ icon, color = "default" }) {
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "item-icon",
		"aria-hidden": "true",
		className: cn("flex items-center justify-center size-10 rounded-xl motion-safe:transition-transform motion-safe:duration-150 group-hover/item:scale-105", iconColorMap[color]),
		children: /* @__PURE__ */ jsx("div", {
			className: "[&>svg]:size-5",
			children: icon
		})
	});
}
ItemIcon.displayName = "Item.Icon";
function ItemImage({ src, alt }) {
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "item-image",
		className: "size-10 overflow-hidden rounded-lg shrink-0",
		children: /* @__PURE__ */ jsx("img", {
			src,
			alt,
			loading: "lazy",
			className: "size-full object-cover motion-safe:transition-transform motion-safe:duration-200 group-hover/item:scale-110"
		})
	});
}
ItemImage.displayName = "Item.Image";
var itemGroupVariants = cva("flex flex-col", {
	variants: {
		variant: {
			default: "",
			outline: "border border-border rounded-xl overflow-hidden"
		},
		divider: {
			none: "",
			line: "divide-y divide-border"
		}
	},
	defaultVariants: {
		variant: "default",
		divider: "none"
	}
});
var ItemGroup = React.forwardRef(({ children, variant, divider, className, ...props }, ref) => {
	return /* @__PURE__ */ jsx(ItemGroupContext.Provider, {
		value: true,
		children: /* @__PURE__ */ jsx("div", {
			ref,
			role: "list",
			"data-slot": "item-group",
			className: cn(itemGroupVariants({
				variant,
				divider
			}), className),
			...props,
			children
		})
	});
});
ItemGroup.displayName = "Item.Group";
var Item = Object.assign(ItemRoot, {
	Avatar: ItemAvatar,
	Icon: ItemIcon,
	Image: ItemImage,
	Group: ItemGroup
});
//#endregion
export { Item, itemVariants };

//# sourceMappingURL=index82.js.map