workflow(template-explorer): fix cacheHandlers disabled state

This commit is contained in:
Evan You 2019-12-10 12:46:38 -05:00
parent c8c5b16ef7
commit 03301b264e

View File

@ -10,83 +10,86 @@ export const compilerOptions: CompilerOptions = reactive({
const App = {
setup() {
return () => [
h('h1', `Vue 3 Template Explorer`),
h(
'a',
{
href: `https://github.com/vuejs/vue-next/tree/${__COMMIT__}`,
target: `_blank`
},
`@${__COMMIT__}`
),
h('div', { id: 'options' }, [
// mode selection
h('span', { class: 'options-group' }, [
h('span', { class: 'label' }, 'Mode:'),
return () => {
const usePrefix =
compilerOptions.prefixIdentifiers || compilerOptions.mode === 'module'
return [
h('h1', `Vue 3 Template Explorer`),
h(
'a',
{
href: `https://github.com/vuejs/vue-next/tree/${__COMMIT__}`,
target: `_blank`
},
`@${__COMMIT__}`
),
h('div', { id: 'options' }, [
// mode selection
h('span', { class: 'options-group' }, [
h('span', { class: 'label' }, 'Mode:'),
h('input', {
type: 'radio',
id: 'mode-module',
name: 'mode',
checked: compilerOptions.mode === 'module',
onChange() {
compilerOptions.mode = 'module'
}
}),
h('label', { for: 'mode-module' }, 'module'),
h('input', {
type: 'radio',
id: 'mode-function',
name: 'mode',
checked: compilerOptions.mode === 'function',
onChange() {
compilerOptions.mode = 'function'
}
}),
h('label', { for: 'mode-function' }, 'function')
]),
// toggle prefixIdentifiers
h('input', {
type: 'radio',
id: 'mode-module',
name: 'mode',
checked: compilerOptions.mode === 'module',
onChange() {
compilerOptions.mode = 'module'
type: 'checkbox',
id: 'prefix',
disabled: compilerOptions.mode === 'module',
checked: usePrefix,
onChange(e: Event) {
compilerOptions.prefixIdentifiers =
(<HTMLInputElement>e.target).checked ||
compilerOptions.mode === 'module'
}
}),
h('label', { for: 'mode-module' }, 'module'),
h('label', { for: 'prefix' }, 'prefixIdentifiers'),
// toggle hoistStatic
h('input', {
type: 'radio',
id: 'mode-function',
name: 'mode',
checked: compilerOptions.mode === 'function',
onChange() {
compilerOptions.mode = 'function'
type: 'checkbox',
id: 'hoist',
checked: compilerOptions.hoistStatic,
onChange(e: Event) {
compilerOptions.hoistStatic = (<HTMLInputElement>e.target).checked
}
}),
h('label', { for: 'mode-function' }, 'function')
]),
h('label', { for: 'hoist' }, 'hoistStatic'),
// toggle prefixIdentifiers
h('input', {
type: 'checkbox',
id: 'prefix',
disabled: compilerOptions.mode === 'module',
checked:
compilerOptions.prefixIdentifiers ||
compilerOptions.mode === 'module',
onChange(e: Event) {
compilerOptions.prefixIdentifiers =
(<HTMLInputElement>e.target).checked ||
compilerOptions.mode === 'module'
}
}),
h('label', { for: 'prefix' }, 'prefixIdentifiers'),
// toggle hoistStatic
h('input', {
type: 'checkbox',
id: 'hoist',
checked: compilerOptions.hoistStatic,
onChange(e: Event) {
compilerOptions.hoistStatic = (<HTMLInputElement>e.target).checked
}
}),
h('label', { for: 'hoist' }, 'hoistStatic'),
// toggle cacheHandlers
h('input', {
type: 'checkbox',
id: 'cache',
checked:
compilerOptions.cacheHandlers && compilerOptions.prefixIdentifiers,
disabled: !compilerOptions.prefixIdentifiers,
onChange(e: Event) {
compilerOptions.cacheHandlers = (<HTMLInputElement>e.target).checked
}
}),
h('label', { for: 'cache' }, 'cacheHandlers')
])
]
// toggle cacheHandlers
h('input', {
type: 'checkbox',
id: 'cache',
checked: usePrefix && compilerOptions.cacheHandlers,
disabled: !usePrefix,
onChange(e: Event) {
compilerOptions.cacheHandlers = (<HTMLInputElement>(
e.target
)).checked
}
}),
h('label', { for: 'cache' }, 'cacheHandlers')
])
]
}
}
}