import React, { useContext } from "react";
import { useConverters } from "./../../pm-converters/context.js";
import { TIPTAP_FIGURE_TYPE } from "./../../ricos-content/index.js";
import { RicosContext } from "./../../ricos-context/index.js";
import { getContainerClasses } from "../../_shared/figure/get-container-classes.js";
import { Giphy } from "../viewer/giphy.js";
const Gif = ({ node, editor }) => {
  const { isMobile } = useContext(RicosContext);
  const converters = useConverters();
  const figures = editor.$nodes(TIPTAP_FIGURE_TYPE);
  const selectedFigure = figures?.find((nodePos) => {
    return nodePos.node.firstChild?.attrs.id === node.attrs.id;
  })?.node;
  const ricosNode = converters.fromPmNode(selectedFigure?.toJSON());
  if (!selectedFigure || !ricosNode) {
    return null;
  }
  return /* @__PURE__ */ React.createElement(
    "div",
    {
      className: getContainerClasses(editor, node.attrs.id, isMobile),
      draggable: true,
      "data-drag-handle": true
    },
    /* @__PURE__ */ React.createElement(Giphy, { componentData: ricosNode.gifData, nodeId: node.attrs.id })
  );
};
export {
  Gif
};
//# sourceMappingURL=component.js.map
