@enumura/chatbot-flow-editor/dist/assets/AddNodeDialog-D0zwubgf.js

Visual chatbot flow editor - Development tool for creating conversational flows

import { j as jsxRuntimeExports } from "./index-BV-DVq2p.js";
import { useState, useEffect } from "react";
import { S as SimpleDialog } from "./Dialog-C2qkkdLN.js";
const AddNodeDialog = ({
  open,
  onClose,
  initialTitle = "",
  onAddNode
}) => {
  const [nodeTitle, setNodeTitle] = useState(initialTitle);
  useEffect(() => {
    if (open) {
      setNodeTitle(initialTitle);
    }
  }, [open, initialTitle]);
  const handleSubmit = () => {
    if (nodeTitle.trim()) {
      onAddNode(nodeTitle);
      setNodeTitle("");
    }
  };
  const handleKeyDown = (e) => {
    if (e.key === "Enter") {
      handleSubmit();
    }
  };
  return /* @__PURE__ */ jsxRuntimeExports.jsx(
    SimpleDialog,
    {
      open,
      onClose,
      title: "Add New Node",
      footer: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(
          "button",
          {
            className: "px-3 py-1 border rounded-md",
            onClick: onClose,
            children: "Cancel"
          }
        ),
        /* @__PURE__ */ jsxRuntimeExports.jsx(
          "button",
          {
            className: "px-3 py-1 bg-blue-600 text-white rounded-md",
            onClick: handleSubmit,
            children: "Add"
          }
        )
      ] }),
      children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "text-sm font-medium", children: "Display Text" }),
        /* @__PURE__ */ jsxRuntimeExports.jsx(
          "input",
          {
            className: "w-full px-3 py-2 border rounded-md",
            value: nodeTitle,
            onChange: (e) => setNodeTitle(e.target.value),
            onKeyDown: handleKeyDown,
            placeholder: "Enter text to display in chat",
            autoFocus: true
          }
        )
      ] }) })
    }
  );
};
export {
  AddNodeDialog as default
};