"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var widget_prompt_input_area_exports = {};
__export(widget_prompt_input_area_exports, {
  WidgetPromptInputArea: () => WidgetPromptInputArea
});
module.exports = __toCommonJS(widget_prompt_input_area_exports);
var import_design_system = require("@wix/design-system");
var import_wix_ui_icons_common = require("@wix/wix-ui-icons-common");
var import_classnames = __toESM(require("classnames"));
var import_react = __toESM(require("react"));
var import_ricos_context = require("./../../ricos-context/index.js");
var import_attachment_bar = require("./attachment-bar/attachment-bar.js");
var import_prompt_input_area_common = require("./prompt-input-area-common.js");
var import_widget_prompt_input_area_scss = __toESM(require("./widget-prompt-input-area-scss.js"));
const SparklesFilledWithGradient = (props) => /* @__PURE__ */ import_react.default.createElement(
  "svg",
  {
    width: "18",
    height: "18",
    viewBox: "0 0 18 18",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg",
    ...props
  },
  /* @__PURE__ */ import_react.default.createElement(
    "path",
    {
      d: "M14.5 0C14.7383 0 14.9435 0.16823 14.9903 0.40194L15.0981 0.94078C15.296 1.93043 16.0696 2.70401 17.0592 2.90194L17.5981 3.00971C17.8318 3.05645 18 3.26166 18 3.5C18 3.73834 17.8318 3.94355 17.5981 3.99029L17.0592 4.09806C16.0696 4.29599 15.296 5.06957 15.0981 6.05922L14.9903 6.59806C14.9435 6.83177 14.7383 7 14.5 7C14.2617 7 14.0565 6.83177 14.0097 6.59806L13.9019 6.05922C13.704 5.06957 12.9304 4.29599 11.9408 4.09806L11.4019 3.99029C11.1682 3.94355 11 3.73834 11 3.5C11 3.26166 11.1682 3.05645 11.4019 3.00971L11.9408 2.90194C12.9304 2.70401 13.704 1.93043 13.9019 0.94078L14.0097 0.40194C14.0565 0.16823 14.2617 0 14.5 0Z",
      fill: "url(#paint0_linear_1021_1278)"
    }
  ),
  /* @__PURE__ */ import_react.default.createElement(
    "path",
    {
      d: "M7.5 3C7.7255 3 7.9231 3.15091 7.9824 3.36844L8.4299 5.00939C9.0355 7.2298 10.7702 8.9645 12.9906 9.5701L14.6316 10.0176C14.8491 10.0769 15 10.2745 15 10.5C15 10.7255 14.8491 10.9231 14.6316 10.9824L12.9906 11.4299C10.7702 12.0355 9.0355 13.7702 8.4299 15.9906L7.9824 17.6316C7.9231 17.8491 7.7255 18 7.5 18C7.2745 18 7.0769 17.8491 7.0176 17.6316L6.57009 15.9906C5.96451 13.7702 4.22985 12.0355 2.00939 11.4299L0.36844 10.9824C0.15091 10.9231 0 10.7255 0 10.5C0 10.2745 0.15091 10.0769 0.36844 10.0176L2.00939 9.5701C4.22985 8.9645 5.96451 7.2298 6.57009 5.00939L7.0176 3.36844C7.0769 3.15091 7.2745 3 7.5 3Z",
      fill: "url(#paint1_linear_1021_1278)"
    }
  ),
  /* @__PURE__ */ import_react.default.createElement("defs", null, /* @__PURE__ */ import_react.default.createElement(
    "linearGradient",
    {
      id: "paint0_linear_1021_1278",
      x1: "4.00042e-08",
      y1: "16.25",
      x2: "20.608",
      y2: "13.647",
      gradientUnits: "userSpaceOnUse"
    },
    /* @__PURE__ */ import_react.default.createElement("stop", { stopColor: "#0021FF" }),
    /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.65", stopColor: "#116DFF" }),
    /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.96", stopColor: "#5FF2AE" })
  ), /* @__PURE__ */ import_react.default.createElement(
    "linearGradient",
    {
      id: "paint1_linear_1021_1278",
      x1: "4.00042e-08",
      y1: "16.25",
      x2: "20.608",
      y2: "13.647",
      gradientUnits: "userSpaceOnUse"
    },
    /* @__PURE__ */ import_react.default.createElement("stop", { stopColor: "#0021FF" }),
    /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.65", stopColor: "#116DFF" }),
    /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.96", stopColor: "#5FF2AE" })
  ))
);
const WidgetPromptInputArea = import_react.default.forwardRef(
  ({
    busy,
    readonly,
    placeholder,
    maxLength,
    onChange,
    onSubmit,
    onRemoveAttachment,
    hasSelectedNode,
    value,
    busyValue,
    onCancel,
    onClose,
    dataHook,
    minHeight,
    attachments = [],
    className,
    style,
    presetBarComponent,
    actionBarComponent,
    fileUploadFn
  }, ref) => {
    const { t } = (0, import_react.useContext)(import_ricos_context.RicosContext);
    const inputRef = import_react.default.useRef(null);
    const { focus } = (0, import_prompt_input_area_common.useFocusCallback)(inputRef);
    import_react.default.useImperativeHandle(ref, () => ({ focus }), [focus]);
    const showPresetBar = Boolean(presetBarComponent);
    const allowFileUpload = Boolean(fileUploadFn);
    const showAttachments = allowFileUpload && attachments.length > 0;
    const { hiddenInputRef } = (0, import_prompt_input_area_common.useAutoHeight)({
      inputRef,
      value,
      forceMultiline: false,
      minHeight,
      baseLineHeight: 18
    });
    const [hasError, setHasError] = import_react.default.useState(false);
    import_react.default.useEffect(() => {
      if (value) {
        setHasError(false);
      }
    }, [value]);
    const handleSubmit = import_react.default.useCallback(() => {
      if (!value.trim()) {
        setHasError(true);
        return;
      }
      setHasError(false);
      onSubmit();
    }, [value, onSubmit]);
    const { onKeyDown } = (0, import_prompt_input_area_common.useKeyboardHandler)({
      busy,
      onEsc: () => {
        onCancel?.();
        onClose?.();
      },
      onEnter: handleSubmit
    });
    const displayedValue = busy ? busyValue ?? t("AIPlugin_Input_Loading_Text") : value;
    const displayedPlaceholder = t(placeholder ?? "AIPlugin_Input_Placeholder_Text");
    return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(import_widget_prompt_input_area_scss.default.root, className), style }, /* @__PURE__ */ import_react.default.createElement(import_design_system.Box, { verticalAlign: "middle", align: "space-between", marginBlockEnd: "6px" }, /* @__PURE__ */ import_react.default.createElement(import_design_system.Box, { verticalAlign: "middle", align: "space-between", gap: 1 }, /* @__PURE__ */ import_react.default.createElement(SparklesFilledWithGradient, { style: { marginInlineEnd: "3px" } }), /* @__PURE__ */ import_react.default.createElement(import_design_system.Heading, { size: "medium" }, hasSelectedNode ? t("AIWidget_PromptInput_Title_Refine") : t("AIWidget_PromptInput_Title_Create")), /* @__PURE__ */ import_react.default.createElement(import_design_system.InfoIcon, { content: t("AIWidget_PromptInput_Disclaimer") })), onClose && /* @__PURE__ */ import_react.default.createElement(import_design_system.CloseButton, { skin: "dark", size: "large", onClick: onClose })), presetBarComponent, /* @__PURE__ */ import_react.default.createElement(
      import_design_system.FormField,
      {
        status: hasError ? "error" : void 0,
        statusMessage: hasError ? t("AIWidget_PromptInput_Error_EmptyPrompt") : void 0
      },
      /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          className: (0, import_classnames.default)(import_widget_prompt_input_area_scss.default.inputContainer, { [import_widget_prompt_input_area_scss.default.error]: hasError }),
          onClick: (e) => {
            if (e.target instanceof Element && e.target.closest("button,input,textarea")) {
              return;
            }
            inputRef.current?.focus();
          }
        },
        showAttachments && /* @__PURE__ */ import_react.default.createElement("div", { className: import_widget_prompt_input_area_scss.default.topBar }, showAttachments ? /* @__PURE__ */ import_react.default.createElement(
          import_attachment_bar.AttachmentBar,
          {
            attachments,
            onRemove: (id) => onRemoveAttachment?.(id)
          }
        ) : null),
        /* @__PURE__ */ import_react.default.createElement("div", { className: import_widget_prompt_input_area_scss.default.stack }, /* @__PURE__ */ import_react.default.createElement(
          "textarea",
          {
            ref: hiddenInputRef,
            className: (0, import_classnames.default)(import_widget_prompt_input_area_scss.default.textInput, import_widget_prompt_input_area_scss.default.hiddenInput, {
              [import_widget_prompt_input_area_scss.default.allowFileUpload]: allowFileUpload
            }),
            value: displayedValue,
            readOnly: true,
            ...{ inert: "" }
          }
        ), /* @__PURE__ */ import_react.default.createElement(
          "textarea",
          {
            ref: inputRef,
            "data-hook": dataHook,
            name: displayedPlaceholder,
            className: (0, import_classnames.default)(import_widget_prompt_input_area_scss.default.textInput, {
              [import_widget_prompt_input_area_scss.default.hasTopBar]: showPresetBar || showAttachments,
              [import_widget_prompt_input_area_scss.default.allowFileUpload]: allowFileUpload,
              [import_widget_prompt_input_area_scss.default.disabled]: busy
            }),
            placeholder: displayedPlaceholder,
            value: displayedValue,
            onChange: (e) => {
              if (hasError && e.target.value) {
                setHasError(false);
              }
              onChange?.(e.target.value);
            },
            maxLength,
            readOnly: readonly,
            disabled: busy,
            onKeyDown
          }
        )),
        /* @__PURE__ */ import_react.default.createElement(
          "div",
          {
            className: (0, import_classnames.default)(import_widget_prompt_input_area_scss.default.actionsContainer, {
              [import_widget_prompt_input_area_scss.default.allowFileUpload]: allowFileUpload
            })
          },
          (fileUploadFn || actionBarComponent) && /* @__PURE__ */ import_react.default.createElement(import_design_system.Box, { gap: "6px", verticalAlign: "middle", align: "space-between" }, fileUploadFn && /* @__PURE__ */ import_react.default.createElement(
            import_design_system.IconButton,
            {
              onClick: fileUploadFn,
              priority: "secondary",
              size: "small",
              disabled: busy
            },
            /* @__PURE__ */ import_react.default.createElement(import_wix_ui_icons_common.Add, null)
          ), actionBarComponent),
          /* @__PURE__ */ import_react.default.createElement(import_design_system.Box, { marginInlineStart: "auto", gap: "12px", verticalAlign: "middle" }, busy ? /* @__PURE__ */ import_react.default.createElement(import_design_system.IconButton, { size: "small", onClick: onCancel, priority: "secondary" }, /* @__PURE__ */ import_react.default.createElement(import_wix_ui_icons_common.Stop, null)) : /* @__PURE__ */ import_react.default.createElement(import_design_system.Button, { size: "small", skin: "ai", onClick: handleSubmit, disabled: readonly }, hasSelectedNode ? t("AIWidget_PromptInput_Button_Regenerate") : t("AIWidget_PromptInput_Button_Generate")))
        )
      )
    ));
  }
);
WidgetPromptInputArea.displayName = "WidgetPromptInputArea";
//# sourceMappingURL=widget-prompt-input-area.js.map
