"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require$$0 = require("react/jsx-runtime");
const designSystem = require("@choiceform/design-system");
const iconsReact = require("@choiceform/icons-react");
const React = require("react");
const index = require("../../../../../i18n/index.cjs");
const tv = require("../tv.cjs");
const QueueItem = React.memo(function QueueItem2(props) {
  const {
    message,
    isDragging = false,
    isBeingDragged = false,
    onDragStart,
    onRemove,
    onJumpQueue
  } = props;
  const itemRef = React.useRef(null);
  const tv$1 = tv.queueItemVariants({
    isBeingDragged,
    isDragging
  });
  const jumpQueue = index.t("prompt-input", "jump-queue");
  const remove = index.t("prompt-input", "remove-from-queue");
  const handleMouseDown = (e) => {
    onDragStart(e);
  };
  return /* @__PURE__ */ require$$0.jsxs(
    "div",
    {
      ref: itemRef,
      className: designSystem.tcx(tv$1.root()),
      children: [
        /* @__PURE__ */ require$$0.jsxs(
          "div",
          {
            className: tv$1.dragContext(),
            onMouseDown: handleMouseDown,
            children: [
              /* @__PURE__ */ require$$0.jsx("div", { className: tv$1.icon(), children: /* @__PURE__ */ require$$0.jsx("div", { className: tv$1.queueIcon() }) }),
              /* @__PURE__ */ require$$0.jsx("p", { className: tv$1.text(), children: message.content })
            ]
          }
        ),
        /* @__PURE__ */ require$$0.jsxs("div", { className: tv$1.actions(), children: [
          /* @__PURE__ */ require$$0.jsx(
            designSystem.IconButton,
            {
              variant: "ghost",
              onClick: onRemove,
              tooltip: {
                content: remove
              },
              children: /* @__PURE__ */ require$$0.jsx(iconsReact.BinSmall, {})
            }
          ),
          onJumpQueue && /* @__PURE__ */ require$$0.jsx(
            designSystem.IconButton,
            {
              variant: "ghost",
              onClick: onJumpQueue,
              tooltip: {
                content: jumpQueue
              },
              children: /* @__PURE__ */ require$$0.jsx(iconsReact.Forward, {})
            }
          )
        ] })
      ]
    }
  );
});
exports.QueueItem = QueueItem;
//# sourceMappingURL=queue-item.cjs.map
