import * as React from 'react'
import * as PropTypes from 'prop-types'
import styled from 'styled-components'

const Base = styled('span')({
  // TODO add styles
})

const propTypes = {
  /**
   * Name.
   */
  name: PropTypes.string.isRequired,
  // TODO add prop types
}

type Props = PropTypes.InferProps<typeof propTypes>

/**
 * {{description}}
 * @param {string} name - Name.
 * @param {object} etcProps - The rest of the props.
 * @returns {React.ReactElement} The component elements.
 */
const {{pascalCase name}}: React.FC<Props> = ({
  name,
  // TODO define more props
  ...etcProps
}) => {
  // TODO put something before render, e.g. hooks

  return (
    <Base
      {...etcProps}
    >
      {name}
    </Base>
  )
}

{{pascalCase name}}.propTypes = propTypes

export default {{pascalCase name}}