content: import React from 'react';
  import type { Node } from 'react';
  import PropTypes from 'prop-types';
  import classNames from 'classnames';
  // import Typography from '../Typography';
  
  
  
  
  export type Props = {
    /**
     * Useful to extend the style applied to components.
     */
    classes?: Object,
    /**
     * @ignore
     */
    className?: string,
    /**
     * If `true`, the children won't be wrapped by a typography component.
     * For instance, that can be useful to can render an h4 instead of a
     */
    disableTypography?: boolean,
    /**
     * If `true`, the children will be indented.
     * This should be used if there is no left avatar or left icon.
     */
    inset?: boolean,
    primary?: Node,
    secondary?: Node,
  };
  
  function ListItemText(props: Props, context) {
    const {
      classes,
      className: classNameProp,
      disableTypography,
      primary,
      secondary,
      inset,
      ...other
    } = props;
    const { dense } = context;
    const className = classNames(
      'list-item--text',
      {
        ['list-item--dense']: dense,
        ['list-item--inset']: inset,
      },
      classNameProp,
    );
  
    return (
      <div className={className} {...other}>
        {primary &&
          (disableTypography ? (
            primary
          ) : (
            <div>
              {primary}
            </div>
          ))}
        {secondary &&
          (disableTypography ? (
            secondary
          ) : (
            <div
              color="secondary"
              type="body1"
              className={classNames('list-item--text', { ['list-item--dense']: dense })}
            >
              {secondary}
            </div>
          ))}
      </div>
    );
  }
  
  ListItemText.defaultProps = {
    disableTypography: false,
    primary: false,
    secondary: false,
    inset: false,
  };
  
  ListItemText.contextTypes = {
    dense: PropTypes.bool,
  };
  
  export default ListItemText;
  