export default function (children, {
theme,
vn = {}
} = {}) {
Lens(vn)('class')({
[`cc-theme-${theme}`]: theme,
})
return h('div.cc-title', vn, children)
}
export default function (children, {
shadow = true,
scroll = false,
theme = 'indigo',
vn = {}
} = {}) {
Lens(vn)('class')({
'cc-shadow': shadow === true,
'cc-shadow-invert': shadow === 'invert',
'cc-scroll': scroll,
[`cc-theme-${theme}`]: true
})
return h('div.cc-toolbar', vn, children)
}
export default function ({
lens,
trigger = false,
initial,
value: _value,
placeholder = '',
type = 'underline',
theme = 'indigo',
autofocus = false,
vn = {},
} = {}) {
if (!lens) throw new Error('The "lens" option is required.')
if (getProp(lens, 'value') === undefined)
setProp(lens, 'value', initial || '', false)
if (_value !== undefined)
setProp(lens, 'value', _value, false)
const value = getProp(lens, 'value') || ''
Lens(vn)('on')({
focus: ev => {
ev.stopPropagation()
ev.preventDefault()
if (!trigger) {
setProp(lens, 'focus', true)
}
},
blur: () => setProp(lens, 'focus', false),
input: ev => setProp(lens, 'value', trigger ? value : ev.target.value),
})
Lens(vn)('props')({
size: 1, placeholder, value,
})
if (trigger) {
Lens(vn)('attrs')({
readonly: 'true',
tabindex: '-1',
})
Lens(vn)('props')({
readonly: 'true',
tabindex: '-1',
})
}
Lens(vn)('attrs')({
autofocus,
})
if (autofocus)
Lens(vn)('hook')({
insert: el => el.elm.focus()
})
Lens(vn)('class')({
[`cc-theme-${theme}`]: true,
[`cc-type-${type}`]: true,
})
return wrap(h('input.cc-input', vn))
}