Playing with JSDoc-based TypeScript definitions in a preact component

index.js

const { h } = require('preact');
const Button = require('../Button');
const styles = require('./styles.css');

/**
 * CreditsNav
 *
 * @typedef Props
 * @property {string} creditsHTML
 * @property {boolean} isUnavailable
 * @property {function(any): void} navigate
 *
 * @param {Props} props
 * @return {object}
 */
const CreditsNav = ({ creditsHTML, isUnavailable, navigate }) => (
  <nav className={styles.root} aria-hidden={isUnavailable ? 'true' : 'false'}>
    <Button transparent tabindex={isUnavailable ? -1 : 0} onClick={() => navigate(creditsHTML)}>
      Credits
    </Button>
  </nav>
);

// Trying it out...
CreditsNav({ creditsHTML: 'd', isUnavailable: false, navigate: () => {} });

module.exports = CreditsNav;
module.exports.displayName = 'CreditsNav';