import { Box, Button, IconButton } from "@wix/design-system";
import { ArrowUp } from "@wix/wix-ui-icons-common";
import classNames from "classnames";
import React, { useContext } from "react";
import { RicosContext } from "./../../../ricos-context/index.js";
import {
  AI_MODAL_CANCEL_BUTTON,
  AI_MODAL_PROMPT_INPUT,
  AI_MODAL_SUBMIT_BUTTON
} from "../../data-hooks.js";
import { PromptInputArea } from "../../prompt-input-area/prompt-input-area.js";
import styles from "./textual-prompt-input-area-scss.js";
const TextualPromptInputArea = React.forwardRef(
  ({
    value,
    onChange,
    maxLength,
    onSubmit,
    handleTextAreaEnter,
    busy,
    onCancel,
    zIndex,
    placeholder,
    isSubmitButtonVisible
  }, ref) => {
    const { t } = useContext(RicosContext);
    const inputRef = React.useRef(null);
    React.useImperativeHandle(ref, () => {
      return {
        focus() {
          inputRef.current?.focus();
        }
      };
    }, []);
    React.useEffect(() => {
      setTimeout(() => {
        inputRef.current?.focus();
      }, 0);
    }, []);
    const isVisibleSubmit = isSubmitButtonVisible ? isSubmitButtonVisible() && !busy : !busy && value.length;
    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(
      PromptInputArea,
      {
        ref: inputRef,
        busy,
        placeholder: t(placeholder ?? "AIPlugin_Input_Placeholder_Text"),
        maxLength,
        onChange,
        value,
        busyValue: t("AIPlugin_Input_Loading_Text"),
        onCancel: () => onCancel(),
        onSubmit: () => {
          if (handleTextAreaEnter) {
            onSubmit(value);
          }
        },
        zIndex,
        dataHook: AI_MODAL_PROMPT_INPUT
      }
    ), /* @__PURE__ */ React.createElement(
      Box,
      {
        className: classNames(styles.buttonWrapper, {
          [styles.visibleSubmit]: isVisibleSubmit,
          [styles.visibleCancel]: busy
        })
      },
      /* @__PURE__ */ React.createElement(Box, { flexGrow: 1, marginLeft: "SP2", verticalAlign: "middle" }, /* @__PURE__ */ React.createElement(
        Button,
        {
          dataHook: AI_MODAL_CANCEL_BUTTON,
          disabled: !busy,
          className: styles.cancelButton,
          size: "small",
          priority: "secondary",
          onClick: onCancel
        },
        t("AIPlugin_Button_Stop_Text")
      ), /* @__PURE__ */ React.createElement(
        IconButton,
        {
          dataHook: AI_MODAL_SUBMIT_BUTTON,
          disabled: busy,
          className: styles.submitButton,
          size: "small",
          onClick: () => onSubmit(value),
          tabIndex: isVisibleSubmit ? 0 : -1
        },
        /* @__PURE__ */ React.createElement(ArrowUp, null)
      ))
    ));
  }
);
export {
  TextualPromptInputArea
};
//# sourceMappingURL=textual-prompt-input-area.js.map
