git ssb

16+

Dominic / patchbay



Tree: 7b91ebea2f9f89a207555eda47a8779b3e83f734

Files: 7b91ebea2f9f89a207555eda47a8779b3e83f734 / app / html / modal.js

1186 bytesRaw
1const nest = require('depnest')
2const { h, when, Value } = require('mutant')
3
4exports.gives = nest('app.html.modal')
5
6exports.create = (api) => {
7 return nest('app.html.modal', (content, { isOpen, onClose, className = '' } = {}) => {
8 if (typeof isOpen !== 'function') isOpen = Value(false)
9
10 const openMe = () => {
11 isOpen.set(true)
12 }
13 const closeMe = () => {
14 isOpen.set(false)
15 if (typeof onClose === 'function') onClose()
16 }
17
18 const lb = h('Modal',
19 {
20 classList: [ className, when(isOpen, '-open', '-close') ],
21 'ev-click': closeMe,
22 'ev-keydown': ev => {
23 if (ev.keyCode === 27) closeMe() // Escape
24 }
25 },
26 [
27 h('div.content', { 'ev-click': (ev) => ev.stopPropagation() }, [
28 content
29 ])
30 ]
31 )
32
33 isOpen(state => {
34 if (!state) return
35
36 focus()
37 function focus () {
38 if (!lb.isConnected) setTimeout(focus, 200)
39 else {
40 const target = lb.querySelector('input') || lb.querySelector('textarea')
41 if (target) target.focus()
42 }
43 }
44 })
45
46 lb.open = openMe
47 lb.close = closeMe
48
49 return lb
50 })
51}
52

Built with git-ssb-web