import {
  STEPS
} from "./chunk-YOTHQSXQ.mjs";

// tmp-babel/profiles/web/ProfileComponent/ReportButtonWithDialog/components/TextStep.js
import { useResponsive } from "@baseapp-frontend/design-system/hooks/web";
import { Button, Divider, TextField, Typography } from "@mui/material";
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
var TextStep = function TextStep2(_ref) {
  var reportText = _ref.reportText, setReportText = _ref.setReportText, setCurrentStep = _ref.setCurrentStep;
  var smDown = useResponsive("down", "sm");
  return /* @__PURE__ */ _jsxs(_Fragment, {
    children: [/* @__PURE__ */ _jsx(Typography, {
      variant: "h5",
      textAlign: smDown ? "center" : "left",
      children: "How would you describe the problem?"
    }), /* @__PURE__ */ _jsx(Typography, {
      variant: "body2",
      textAlign: smDown ? "center" : "left",
      children: "Use the text field below to explain what the problem you are reporting is."
    }), /* @__PURE__ */ _jsx(Divider, {
      sx: {
        marginX: "-32px"
      }
    }), /* @__PURE__ */ _jsx(TextField, {
      fullWidth: true,
      multiline: true,
      rows: 4,
      value: reportText,
      onChange: function onChange(e) {
        return setReportText(e.target.value);
      },
      placeholder: "I find the post to be offensive..."
    }), /* @__PURE__ */ _jsx(Button, {
      onClick: function onClick() {
        return setCurrentStep(STEPS.summary);
      },
      disabled: !reportText,
      children: "Confirm"
    })]
  });
};
var TextStep_default = TextStep;

export {
  TextStep_default
};
//# sourceMappingURL=chunk-5HOKXKK4.mjs.map