import _extends from "@babel/runtime/helpers/esm/extends";
import React, { forwardRef, useCallback, useRef } from "react";
import { StyledDiv, StyledInput, StyledSpan } from "./Styles";
import { useForkRef } from "../../utils";
export const EditableContent = /*#__PURE__*/forwardRef((_ref, ref) => {
  let {
    className,
    variant = "Body 2",
    weight,
    disabled = false,
    inputProps,
    wrapRef,
    children,
    invalid,
    ...props
  } = _ref;
  const intInputRef = useRef(null);
  const handleRef = useForkRef(ref, intInputRef);
  const handleBlur = useCallback(evt => {
    if (intInputRef != null && intInputRef.current) {
      intInputRef.current.scrollLeft = 0;
    }
    typeof (inputProps == null ? void 0 : inputProps.onBlur) === "function" && (inputProps == null ? void 0 : inputProps.onBlur(evt));
  }, [inputProps]);
  return /*#__PURE__*/React.createElement(StyledDiv, _extends({
    className: className,
    ref: wrapRef
  }, props), /*#__PURE__*/React.createElement(StyledSpan, {
    variant: variant,
    forwardedAs: "span",
    weight: weight,
    $disabled: disabled,
    className: "presentation"
  }, children ? children : inputProps == null ? void 0 : inputProps.value), /*#__PURE__*/React.createElement(StyledInput, _extends({}, inputProps, {
    ref: handleRef,
    forwardedAs: "input",
    variant: variant,
    weight: weight,
    value: inputProps == null ? void 0 : inputProps.value,
    onBlur: handleBlur,
    disabled: disabled,
    "data-form-type": "other",
    invalid: invalid
  })));
});
EditableContent.displayName = "EditableContent";
//# sourceMappingURL=EditableContent.js.map