<commit_before>
var h = require('hyperscript')

document.head.appendChild(h('style', '.hypertabs--selected { background: yellow }'))
document.head.appendChild(h('style', '.hypertabs--notify { border: 1px solid red; }'))
document.head.appendChild(h('style', '.hypertabs__content { display: flex; flex-direction: row; }'))
document.head.appendChild(h('style', '.hypertabs__content > * { padding: 50px; margin: auto; border: 1px solid black;}'))

var tabs = require('../')()

var logEvents = {
  onfocus: function (ev) {
    console.log('focus', ev)
  },
  onblur: function (ev) {
    console.log('blur', ev)
  }
}

document.body.appendChild(tabs)

tabs.add('foo', h('h1', logEvents, 'foo bar baz'))
tabs.add('bar',
  h('ul',
    logEvents,
    h('li', 'foo'),
    h('li', 'bar'),
    h('li', 'baz')
  )
)

tabs.add('baz',
  h('form',
    logEvents,
    h('input', {value: 'foo bar baz'}),
    h('submit')
  )
)

function FocusClock () {
  var clock
  var blurStart = Date.now()
  var focusStart, focused = false
  var focusTime, blurTime

  function update () {
    var t = 'focus('+(focused ? 'focused' : 'blurred')+')'
    if(clock.title != t) clock.title = t

    if(Date.now() - blurStart > 1000 && !focused && !clock.classList.contains('hypertabs--notify')) {
      clock.classList.add('hypertabs--notify')<commit_msg>expose TABS global in example<commit_after>
var h = require('hyperscript')

document.head.appendChild(h('style', '.hypertabs--selected { background: yellow }'))
document.head.appendChild(h('style', '.hypertabs--notify { border: 1px solid red; }'))
document.head.appendChild(h('style', '.hypertabs__content { display: flex; flex-direction: row; }'))
document.head.appendChild(h('style', '.hypertabs__content > * { padding: 50px; margin: auto; border: 1px solid black;}'))

var tabs = TABS = require('../')()

var logEvents = {
  onfocus: function (ev) {
    console.log('focus', ev)
  },
  onblur: function (ev) {
    console.log('blur', ev)
  }
}

document.body.appendChild(tabs)

tabs.add(h('h1', logEvents, 'foo bar baz'))
tabs.add(
  h('ul',
    logEvents,
    h('li', 'foo'),
    h('li', 'bar'),
    h('li', 'baz')
  )
)

tabs.add(
  h('form',
    logEvents,
    h('input', {value: 'foo bar baz'}),
    h('submit')
  )
)

function FocusClock () {
  var clock
  var blurStart = Date.now()
  var focusStart, focused = false
  var focusTime, blurTime

  function update () {
    var t = 'focus('+(focused ? 'focused' : 'blurred')+')'
    if(clock.title != t) clock.title = t

    if(Date.now() - blurStart > 1000 && !focused && !clock.classList.contains('hypertabs--notify')) {
      clock.classList.add('hypertabs--notify')
{'fraction_non_alphanumeric': 0.19879062736205594, 'fraction_numerical': 0.006802721088435374, 'mean_word_length': 3.901851851851852, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4691577', 'n_tokens_mistral': 955, 'n_tokens_neox': 907, 'n_words': 205}