import { Button as e } from "../../../../components/ui/button.js";
import { Select as t, SelectContent as n, SelectItem as r, SelectTrigger as i, SelectValue as a } from "../../../../components/ui/select.js";
import o from "./HeaderSection.js";
import { jsx as s, jsxs as c } from "react/jsx-runtime";
import { Loader2 as l, Play as u } from "lucide-react";
//#region src/features/workspaces/components/workflow-form/SelectionView.tsx
var d = ({ title: d, workflowTypes: f, formData: p, errors: m, isLoading: h, onInputChange: g, onNext: _ }) => {
	let v = f.find((e) => e.alias === p.alias);
	return /* @__PURE__ */ c("div", {
		className: "flex flex-col",
		children: [/* @__PURE__ */ s(o, {
			icon: /* @__PURE__ */ s(u, { className: "h-5 w-5" }),
			title: d,
			description: "Choose an automation type to get started"
		}), /* @__PURE__ */ c("div", {
			className: "mb-6 px-1",
			children: [/* @__PURE__ */ c("div", {
				className: "space-y-2",
				children: [
					/* @__PURE__ */ s("label", {
						htmlFor: "automation",
						className: "text-foreground block text-sm font-medium",
						children: "Automation Type"
					}),
					/* @__PURE__ */ c("div", {
						className: "flex gap-2",
						children: [/* @__PURE__ */ c(t, {
							value: p.alias,
							onValueChange: (e) => g("alias", e),
							disabled: h,
							children: [/* @__PURE__ */ s(i, {
								id: "automation",
								className: `flex-1 ${m.alias ? "border-red-500 focus:ring-red-500" : ""}`,
								children: /* @__PURE__ */ s(a, { placeholder: "Select an automation..." })
							}), /* @__PURE__ */ s(n, { children: f.map((e) => /* @__PURE__ */ s(r, {
								value: e.alias,
								children: e.title ?? e.alias
							}, e.alias)) })]
						}), /* @__PURE__ */ s(e, {
							variant: "default",
							disabled: h || !p.alias,
							onClick: _,
							className: "px-4",
							children: h ? /* @__PURE__ */ s(l, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ s(u, { className: "h-4 w-4" })
						})]
					}),
					m.alias && /* @__PURE__ */ s("p", {
						className: "mt-1 flex items-center gap-1 text-sm text-red-500",
						children: m.alias
					})
				]
			}), v && /* @__PURE__ */ c("div", {
				className: "bg-muted/50 border-border mt-4 rounded-lg border p-4",
				children: [/* @__PURE__ */ s("h3", {
					className: "text-foreground mb-1 text-sm font-medium",
					children: v.title || v.alias
				}), v.description && /* @__PURE__ */ s("p", {
					className: "text-muted-foreground text-sm leading-relaxed",
					children: v.description
				})]
			})]
		})]
	});
};
//#endregion
export { d as default };
