"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { Button } from "@open-mercato/ui/primitives/button";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { NODE_TYPE_ICONS, stepTypeToNodeType } from "../../lib/node-type-icons.js";
import { Circle, Pencil, Trash2, ArrowRight, Plus } from "lucide-react";
function MobileDefinitionDetail({
  values,
  onEditStep,
  onDeleteStep,
  onAddStep,
  onEditTransition,
  onDeleteTransition,
  onAddTransition
}) {
  const t = useT();
  const steps = values.steps || [];
  const transitions = values.transitions || [];
  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
    /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4", children: [
      /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
        /* @__PURE__ */ jsxs("h2", { className: "text-sm font-semibold", children: [
          t("workflows.form.stepsLabel", "Steps"),
          " (",
          steps.length,
          ")"
        ] }),
        /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", onClick: onAddStep, className: "h-8 text-xs", children: [
          /* @__PURE__ */ jsx(Plus, { className: "mr-1 h-3.5 w-3.5" }),
          t("workflows.mobile.addStep", "Add Step")
        ] })
      ] }),
      steps.length === 0 ? /* @__PURE__ */ jsx("p", { className: "py-4 text-center text-sm text-muted-foreground", children: t("workflows.mobile.noSteps", "No steps defined yet.") }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: steps.map((step, idx) => {
        const nodeType = stepTypeToNodeType(step.stepType || step.type || "");
        const Icon = NODE_TYPE_ICONS[nodeType] || Circle;
        return /* @__PURE__ */ jsxs(
          "div",
          {
            className: "flex items-center gap-3 rounded-lg border bg-background p-3",
            children: [
              /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
                /* @__PURE__ */ jsx("div", { className: "truncate text-sm font-medium", children: step.stepName || step.stepId }),
                /* @__PURE__ */ jsx("div", { className: "text-overline uppercase text-muted-foreground", children: step.stepType || step.type || "unknown" })
              ] }),
              /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 gap-1", children: [
                /* @__PURE__ */ jsx(
                  "button",
                  {
                    onClick: () => onEditStep(idx),
                    className: "rounded p-1.5 hover:bg-muted",
                    "aria-label": t("workflows.mobile.editStep"),
                    children: /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5 text-muted-foreground" })
                  }
                ),
                /* @__PURE__ */ jsx(
                  "button",
                  {
                    onClick: () => onDeleteStep(idx),
                    className: "rounded p-1.5 hover:bg-muted",
                    "aria-label": t("workflows.mobile.deleteStep"),
                    children: /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5 text-destructive" })
                  }
                )
              ] })
            ]
          },
          step.stepId || idx
        );
      }) })
    ] }),
    /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4", children: [
      /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
        /* @__PURE__ */ jsxs("h2", { className: "text-sm font-semibold", children: [
          t("workflows.form.transitionsLabel", "Transitions"),
          " (",
          transitions.length,
          ")"
        ] }),
        /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", onClick: onAddTransition, className: "h-8 text-xs", children: [
          /* @__PURE__ */ jsx(Plus, { className: "mr-1 h-3.5 w-3.5" }),
          t("workflows.mobile.addTransition", "Add Transition")
        ] })
      ] }),
      transitions.length === 0 ? /* @__PURE__ */ jsx("p", { className: "py-4 text-center text-sm text-muted-foreground", children: t("workflows.mobile.noTransitions", "No transitions defined yet.") }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: transitions.map((transition, idx) => /* @__PURE__ */ jsxs(
        "div",
        {
          className: "flex items-center gap-3 rounded-lg border bg-background p-3",
          children: [
            /* @__PURE__ */ jsx(ArrowRight, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
            /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-sm", children: [
                /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-xs", children: transition.fromStepId }),
                /* @__PURE__ */ jsx(ArrowRight, { className: "h-3 w-3 shrink-0 text-muted-foreground" }),
                /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-xs", children: transition.toStepId })
              ] }),
              /* @__PURE__ */ jsx("div", { className: "text-overline text-muted-foreground", children: transition.trigger || "auto" })
            ] }),
            /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 gap-1", children: [
              /* @__PURE__ */ jsx(
                "button",
                {
                  onClick: () => onEditTransition(idx),
                  className: "rounded p-1.5 hover:bg-muted",
                  "aria-label": t("workflows.mobile.editTransition"),
                  children: /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5 text-muted-foreground" })
                }
              ),
              /* @__PURE__ */ jsx(
                "button",
                {
                  onClick: () => onDeleteTransition(idx),
                  className: "rounded p-1.5 hover:bg-muted",
                  "aria-label": t("workflows.mobile.deleteTransition"),
                  children: /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5 text-destructive" })
                }
              )
            ] })
          ]
        },
        transition.transitionId || idx
      )) })
    ] })
  ] });
}
export {
  MobileDefinitionDetail
};
//# sourceMappingURL=MobileDefinitionDetail.js.map
