import React from "react";
import { makeStyles } from "@mui/styles";
import PropTypes from "prop-types";
import useTranslation from "../../utils/useTranslation";
const useStyles = makeStyles({
  root: {
    display: "flex",
    alignItems: "center",
    fontSize: "0.8em",
    margin: "3px 0"
  },
  shortName: {
    display: "inline-block",
    flex: "0 0 40px",
    minWidth: "40px",
    marginRight: 5
  }
});
const propTypes = {
  shortName: PropTypes.string.isRequired,
  longName: PropTypes.string.isRequired
};
function OperatorShortAndLongName(_ref) {
  let {
    shortName,
    longName
  } = _ref;
  const {
    t
  } = useTranslation();
  const classes = useStyles();
  return /*#__PURE__*/React.createElement("div", {
    className: classes.root
  }, /*#__PURE__*/React.createElement("span", {
    className: classes.shortName
  }, shortName), /*#__PURE__*/React.createElement("span", null, " ", t(longName)));
}
OperatorShortAndLongName.propTypes = propTypes;
export default /*#__PURE__*/React.memo(OperatorShortAndLongName);
//# sourceMappingURL=OperatorShortAndLongName.js.map