src/lib/modal.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

import { h } from 'lib/h'
import * as Button from 'lib/button'

export function show(content: Element) {
  document.body.appendChild(h('div',
    { id: 'g-Modal' },
    h('div',
      { className: 'g-Modal__Curtain',
        onclick: () => hide()
      }
    ),
    h('div',
      { className: 'g-Modal__Window' },
      Button.raw(
        { className: 'g-Modal__Close',
          onclick: () => hide()
        },
        'x'
      ),
      content
    )
  ))
}

export function hide() {
  const modal = document.querySelector('#g-Modal')
  modal && document.body.removeChild(modal)
}