import { cn } from "./index3.js";
import { Button } from "./index6.js";
import { Input } from "./index29.js";
import { cva } from "class-variance-authority";
import { Mail } from "lucide-react";
import * as React from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
//#region src/components/organisms/content/InlineCTA/InlineCTA.tsx
var inlineCTAVariants = cva("relative bg-background overflow-hidden shadow-xs", {
	variants: { variant: {
		bordered: "border border-border rounded-xl",
		"full-width": "border-y border-border"
	} },
	defaultVariants: { variant: "bordered" }
});
function InlineCTAActions({ title, description, primaryLabel = "Changelog", onPrimaryClick, secondaryLabel = "Dismiss", onSecondaryClick, stackedActions = false, variant, className, ...props }) {
	return /* @__PURE__ */ jsxs("section", {
		"data-slot": "inline-cta",
		"aria-label": typeof title === "string" ? title : "Call to action",
		className: cn(inlineCTAVariants({ variant }), "flex flex-col gap-5 p-6", className),
		...props,
		children: [/* @__PURE__ */ jsxs("div", {
			className: "flex flex-col gap-0.5",
			children: [/* @__PURE__ */ jsx("h3", {
				className: "text-lg font-semibold leading-7 text-foreground",
				children: title
			}), description && /* @__PURE__ */ jsx("p", {
				className: "text-sm leading-5 text-muted-foreground",
				children: description
			})]
		}), /* @__PURE__ */ jsx("div", {
			className: cn("flex gap-3", stackedActions ? "flex-col w-full" : "flex-row items-center"),
			children: stackedActions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
				appearance: "gradient",
				variant: "primary",
				size: "md",
				onClick: onPrimaryClick,
				className: "w-full",
				children: primaryLabel
			}), secondaryLabel && /* @__PURE__ */ jsx(Button, {
				appearance: "outline",
				variant: "secondary",
				size: "md",
				onClick: onSecondaryClick,
				className: "w-full",
				children: secondaryLabel
			})] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [secondaryLabel && /* @__PURE__ */ jsx(Button, {
				appearance: "outline",
				variant: "secondary",
				size: "md",
				onClick: onSecondaryClick,
				children: secondaryLabel
			}), /* @__PURE__ */ jsx(Button, {
				appearance: "gradient",
				variant: "primary",
				size: "md",
				onClick: onPrimaryClick,
				children: primaryLabel
			})] })
		})]
	});
}
function InlineCTAEmail({ title, description, inputLabel = "Subscribe to updates", inputPlaceholder = "you@humain.ai", submitLabel = "Subscribe", onSubmit, stackedLayout = false, defaultValue = "", loading = false, variant, className, ...props }) {
	const [email, setEmail] = React.useState(defaultValue);
	const handleSubmit = (e) => {
		e.preventDefault();
		onSubmit?.(email);
	};
	return /* @__PURE__ */ jsxs("section", {
		"data-slot": "inline-cta",
		"aria-label": typeof title === "string" ? title : "Subscribe",
		className: cn(inlineCTAVariants({ variant }), "flex flex-col gap-5 p-6", className),
		...props,
		children: [/* @__PURE__ */ jsxs("div", {
			className: "flex flex-col gap-0.5",
			children: [/* @__PURE__ */ jsx("h3", {
				className: "text-lg font-semibold leading-7 text-foreground",
				children: title
			}), description && /* @__PURE__ */ jsx("p", {
				className: "text-sm leading-5 text-muted-foreground",
				children: description
			})]
		}), /* @__PURE__ */ jsxs("form", {
			onSubmit: handleSubmit,
			className: cn("flex gap-4", stackedLayout ? "flex-col w-full" : "flex-row items-end max-w-md"),
			children: [/* @__PURE__ */ jsx("div", {
				className: cn(stackedLayout ? "w-full" : "flex-1"),
				children: /* @__PURE__ */ jsx(Input, {
					type: "email",
					label: inputLabel,
					placeholder: inputPlaceholder,
					value: email,
					onChange: (e) => setEmail(e.target.value),
					startIcon: /* @__PURE__ */ jsx(Mail, {}),
					required: true
				})
			}), /* @__PURE__ */ jsx(Button, {
				type: "submit",
				appearance: "gradient",
				variant: "primary",
				size: "lg",
				loading,
				className: cn(stackedLayout && "w-full"),
				children: submitLabel
			})]
		})]
	});
}
function InlineCTAImage({ title, description, imageSrc, imageAlt = "Featured image", showPlayButton = false, onPlayClick, primaryLabel = "Changelog", onPrimaryClick, secondaryLabel = "Dismiss", onSecondaryClick, stackedActions = false, variant, className, ...props }) {
	return /* @__PURE__ */ jsxs("section", {
		"data-slot": "inline-cta",
		"aria-label": typeof title === "string" ? title : "Call to action",
		className: cn(inlineCTAVariants({ variant }), "flex flex-col", className),
		...props,
		children: [/* @__PURE__ */ jsxs("div", {
			className: "relative aspect-video w-full overflow-hidden",
			children: [
				/* @__PURE__ */ jsx("img", {
					src: imageSrc,
					alt: imageAlt,
					loading: "lazy",
					className: "absolute inset-0 size-full object-cover"
				}),
				/* @__PURE__ */ jsx("div", { className: "absolute inset-0 border border-border rounded-t-xl" }),
				showPlayButton && /* @__PURE__ */ jsx("button", {
					type: "button",
					onClick: onPlayClick,
					className: "absolute bottom-3 start-3 size-11 rounded-full bg-card/80 supports-backdrop-filter:backdrop-blur-sm flex items-center justify-center hover:bg-background transition-colors",
					"aria-label": "Play video",
					children: /* @__PURE__ */ jsx("svg", {
						className: "size-4 ms-0.5 text-foreground",
						fill: "currentColor",
						viewBox: "0 0 16 16",
						children: /* @__PURE__ */ jsx("path", { d: "M4 3.5v9l8-4.5-8-4.5z" })
					})
				})
			]
		}), /* @__PURE__ */ jsxs("div", {
			className: "flex flex-col gap-5 p-4 border-x border-b border-border rounded-b-xl",
			children: [/* @__PURE__ */ jsxs("div", {
				className: "flex flex-col gap-0.5",
				children: [/* @__PURE__ */ jsx("h3", {
					className: "text-lg font-semibold leading-7 text-foreground",
					children: title
				}), description && /* @__PURE__ */ jsx("p", {
					className: "text-sm leading-5 text-muted-foreground",
					children: description
				})]
			}), /* @__PURE__ */ jsx("div", {
				className: cn("flex gap-3", stackedActions ? "flex-col w-full" : "flex-row items-center"),
				children: stackedActions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
					appearance: "gradient",
					variant: "primary",
					size: "md",
					onClick: onPrimaryClick,
					className: "w-full",
					children: primaryLabel
				}), secondaryLabel && /* @__PURE__ */ jsx(Button, {
					appearance: "outline",
					variant: "secondary",
					size: "md",
					onClick: onSecondaryClick,
					className: "w-full",
					children: secondaryLabel
				})] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [secondaryLabel && /* @__PURE__ */ jsx(Button, {
					appearance: "outline",
					variant: "secondary",
					size: "md",
					onClick: onSecondaryClick,
					children: secondaryLabel
				}), /* @__PURE__ */ jsx(Button, {
					appearance: "gradient",
					variant: "primary",
					size: "md",
					onClick: onPrimaryClick,
					children: primaryLabel
				})] })
			})]
		})]
	});
}
function InlineCTA(props) {
	switch (props.type) {
		case "actions": return /* @__PURE__ */ jsx(InlineCTAActions, { ...props });
		case "email": return /* @__PURE__ */ jsx(InlineCTAEmail, { ...props });
		case "image": return /* @__PURE__ */ jsx(InlineCTAImage, { ...props });
		default: return null;
	}
}
InlineCTA.displayName = "InlineCTA";
//#endregion
export { InlineCTA, inlineCTAVariants };

//# sourceMappingURL=index453.js.map