{"size": 758, "ext": "js", "max_stars_repo_path": "src/Usage/Usage.js", "max_stars_repo_name": "pnepe6/rsg-components", "max_stars_repo_stars_event_min_datetime": "2018-11-29T04:33:59.000Z", "max_stars_repo_stars_event_max_datetime": "2019-05-21T09:14:54.000Z", "max_issues_repo_path": "src/Usage/Usage.js", "max_issues_repo_name": "pnepe6/rsg-components", "max_issues_repo_issues_event_min_datetime": "2018-11-30T00:13:34.000Z", "max_issues_repo_issues_event_max_datetime": "2020-04-25T10:57:32.000Z", "max_forks_repo_path": "src/Usage/Usage.js", "max_forks_repo_name": "pnepe6/rsg-components", "max_forks_repo_forks_event_min_datetime": "2019-05-22T17:07:05.000Z", "max_forks_repo_forks_event_max_datetime": "2019-05-22T17:07:05.000Z"}
{"max_stars_count": 6, "max_issues_count": 92, "max_forks_count": 1, "avg_line_length": 24.4516129032, "max_line_length": 73, "alphanum_fraction": 0.6649076517}
import React from 'react';
import PropTypes from 'prop-types';
import isEmpty from 'lodash.isempty';

import Props from 'react-styleguidist/lib/client/rsg-components/Props';
import Methods from '../Methods';

export default function Usage({ props: { props, methods } }) {
  const propsNode = !isEmpty(props) && <Props props={props} />;
  const methodsNode = !isEmpty(methods) && <Methods methods={methods} />;

  if (!propsNode && !methodsNode) {
    return null;
  }

  return (
    <div className="rsg-usage">
      {propsNode}
      {methodsNode}
    </div>
  );
}

Usage.propTypes = {
  /** Properties to be rendered in properties table. Can be: */
  props: PropTypes.shape({
    props: PropTypes.array,
    methods: PropTypes.array,
  }).isRequired,
};
