@janus-idp/shared-react/dist/components/common/StatusIconAndText.esm.js

Shared code for utils, types, and React components for the Janus frontend plugins.

import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Typography from '@mui/material/Typography';
import cx from 'classnames';
import { CamelCaseWrap } from './CamelCaseWrap.esm.js';

const DASH = "-";
const useStyles = makeStyles({
  iconAndText: {
    alignItems: "baseline",
    display: "flex",
    fontWeight: 400,
    fontSize: "14px"
  },
  flexChild: {
    flex: " 0 0 auto",
    position: "relative",
    top: "0.125em"
  }
});
const StatusIconAndText = ({
  icon,
  title,
  spin,
  iconOnly,
  className,
  dataTestId
}) => {
  const styles = useStyles();
  if (!title) {
    return /* @__PURE__ */ React.createElement(React.Fragment, null, DASH);
  }
  if (iconOnly) {
    return /* @__PURE__ */ React.createElement(React.Fragment, null, React.cloneElement(icon, {
      "data-testid": dataTestId ?? `icon-only-${title}`,
      className: icon.props.className
    }));
  }
  return /* @__PURE__ */ React.createElement(
    Typography,
    {
      className: cx(styles.iconAndText, className),
      "data-testid": dataTestId ?? `icon-with-title-${title}`,
      title
    },
    React.cloneElement(icon, {
      className: cx(
        spin && "fa-spin",
        icon.props.className,
        styles.flexChild
      )
    }),
    /* @__PURE__ */ React.createElement(CamelCaseWrap, { value: title, dataTest: "status-text" })
  );
};

export { StatusIconAndText, StatusIconAndText as default };
//# sourceMappingURL=StatusIconAndText.esm.js.map