const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits

module.exports = RadioList

inherits(RadioList, Component)
function RadioList () {
  Component.call(this)
}

RadioList.prototype.render = function () {
  const props = this.props
  const activeClass = '.custom-radio-selected'
  const inactiveClass = '.custom-radio-inactive'
  const {
    labels,
    defaultFocus,
  } = props


  return (
    h('.flex-row', {
      style: {
        fontSize: '12px',
      },
    }, [
      h('.flex-column.custom-radios', {
        style: {
          marginRight: '5px',
        },
      },
        labels.map((lable, i) => {
          let isSelcted = (this.state !== null)
          isSelcted = isSelcted ? (this.state.selected === lable) : (defaultFocus === lable)
          return h(isSelcted ? activeClass : inactiveClass, {
            title: lable,
            onClick: (event) => {
              this.setState({selected: event.target.title})
              props.onClick(event)
            },
          })
        })
      ),
      h('.text', {},
        labels.map((lable) => {
          if (props.subtext) {
            return h('.flex-row', {}, [
              h('.radio-titles', lable),
              h('.radio-titles-subtext', `- ${props.subtext[lable]}`),
            ])
          } else {
            return h('.radio-titles', lable)
          }
        })
      ),
    ])
  )
}

option>
<option value='2014Q3'>2014Q3</option>
<option value='2014Q4'>2014Q4</option>
<option value='2015Q1'>2015Q1</option>
<option value='2015Q2'>2015Q2</option>
<option value='2015Q3'>2015Q3</option>
<option value='2015Q4'>2015Q4</option>
<option value='2016Q1'>2016Q1</option>
<option value='2016Q2'>2016Q2</option>
<option value='2016Q3'>2016Q3</option>
<option value='2016Q4'>2016Q4</option>
<option value='2017Q1'>2017Q1</option>
<option value='2017Q2'>2017Q2</option>
<option value='2017Q3'>2017Q3</option>
<option value='2017Q4'>2017Q4</option>
<option value='2018Q1'>2018Q1</option>
<option value='2018Q2'>2018Q2</option>
<option value='2018Q3'>2018Q3</option>
<option value='2018Q4'>2018Q4</option>
<option value='2019Q1'>2019Q1</option>
<option value='2019Q2'>2019Q2</option>
<option value='2019Q3'>2019Q3</option>
<option value='2019Q4'>2019Q4</option>
<option value='2020Q1'>2020Q1</option>
<option value='2020Q2'>2020Q2</option>
<option value='2020Q3'>2020Q3</option>
<option value='2020Q4'>2020Q4</option>
<option value='2021Q1'>2021Q1</option>
<option value='2021Q2'>2021Q2</option>
<option value='2021Q3'>2021Q3</option>
<option value='2021Q4'>2021Q4</option>
<option value='2022Q1'>2022Q1</option>
<option value='2022Q2'>2022Q2</option>
<option value='2022Q3'>2022Q3</option>
<option value='2022Q4'>2022Q4</option>
<option value='2023Q1'>2023Q1</option>
<option value='2023Q2'>2023Q2</option>
<option value='2023Q3'>2023Q3</option>
<option value='2023Q4'>2023Q4</option>
<option value='2024Q1'>2024Q1</option>
<option value='2024Q2'>2024Q2</option>
<option value='2024Q3'>2024Q3</option>
<option value='2024Q4'>2024Q4</option>
<option value='2025Q1'>2025Q1</option>
<option value='2025Q2'>2025Q2</option>
<option value='2025Q3'>2025Q3</option>
<option value='branches/2014Q1'>branches/2014Q1</option>
<option value='branches/2014Q2'>branches/2014Q2</option>
<option value='branches/2014Q3'>branches/2014Q3</option>
<option value='branches/2014Q4'>branches/2014Q4</option>
<option value='branches/2015Q1'>branches/2015Q1</option>
<option value='branches/2015Q2'>branches/2015Q2</option>
<option value='branches/2015Q3'>branches/2015Q3</option>
<option value='branches/2015Q4'>branches/2015Q4</option>
<option value='branches/2016Q1'>branches/2016Q1</option>
<option value='branches/2016Q2'>branches/2016Q2</option>
<option value='branches/2016Q3'>branches/2016Q3</option>
<option value='branches/2016Q4'>branches/2016Q4</option>
<option value='branches/2017Q1'>branches/2017Q1</option>
<option value='branches/2017Q2'>branches/2017Q2</option>
<option value='branches/2017Q3'>branches/2017Q3</option>
<option value='branches/2017Q4'>branches/2017Q4</option>
<option value='branches/2018Q1'>branches/2018Q1</option>
<option value='branches/2018Q2'>branches/2018Q2</option>
<option value='branches/2018Q3'>branches/2018Q3</option>
<option value='branches/2018Q4'>branches/2018Q4</option>
<option value='branches/2019Q1'>branches/2019Q1</option>
<option value='branches/2019Q2'>branches/2019Q2</option>
<option value='branches/2019Q3'>branches/2019Q3</option>
<option value='branches/2019Q4'>branches/2019Q4</option>
<option value='branches/2020Q1'>branches/2020Q1</option>
<option value='branches/2020Q2'>branches/2020Q2</option>
<option value='branches/2020Q3'>branches/2020Q3</option>
<option value='branches/2020Q4'>branches/2020Q4</option>
<option value='branches/2021Q1'>branches/2021Q1</option>
<option value='branches/RELEASE_8_4_0'>branches/RELEASE_8_4_0</option>
<option value='branches/RELENG_2_1_0'>branches/RELENG_2_1_0</option>
<option value='branches/RELENG_2_2'>branches/RELENG_2_2</option>
<option value='branches/RELENG_9_1_0'>branches/RELENG_9_1_0</option>
<option value='branches/RELENG_9_2_0'>branches/RELENG_9_2_0</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3'>dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/lodash-4.17.15'>dependabot/npm_and_yarn/devel/electron4/files/lodash-4.17.15</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/lodash.merge-4.6.2'>dependabot/npm_and_yarn/devel/electron4/files/lodash.merge-4.6.2</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/lodash.template-4.5.0'>dependabot/npm_and_yarn/devel/electron4/files/lodash.template-4.5.0</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/minimist-1.2.2'>dependabot/npm_and_yarn/devel/electron4/files/minimist-1.2.2</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2' selected='selected'>dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2</option>
<option value='main'>main</option>
<option value='master'>master</option>
<option value='svn_head'>svn_head</option>
</select> <input type='submit' value='switch'/></form></td></tr>
<tr><td class='sub'>FreeBSD Ports (https://github.com/freebsd/freebsd-ports)</td><td class='sub right'></td></tr></table>
<table class='tabs'><tr><td>
<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/about/?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2'>about</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2'>summary</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/refs/?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>refs</a><a class='active' href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2'>log</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/tree/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>tree</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/commit/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>commit</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/diff/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>diff</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/stats/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2'>stats</a></td><td class='form'><form class='right' method='get' action='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/mail/sieve-connect'>
<input type='hidden' name='h' value='dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2'/><input type='hidden' name='id' value='e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'/><select name='qt'>
<option value='grep'>log msg</option>
<option value='author'>author</option>
<option value='committer'>committer</option>
<option value='range'>range</option>
</select>
<input class='txt' type='search' size='10' name='q' value=''/>
<input type='submit' value='search'/>
</form>
</td></tr></table>
<div class='path'>path: <a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>root</a>/<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/mail?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>mail</a>/<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58'>sieve-connect</a></div><div class='content'><table class='list nowrap'><tr class='nohover'><th></th><th class='left'>Commit message (<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/mail/sieve-connect?h=dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2&amp;id=e13c8eaa1ccadcaf3319c3f4fd2d3d6585555d58&amp;showmsg=1'>Expand</a>)</th><th class='left'>Author</th><th class='left'>Age</th><th class='left'>Files</th><th class='left'>Lines</th></tr>