Change Details

To make WVUI work well with code in various stages of being migrated to Vue 3, we should make sure it works both with the Vue 3 migration build in compatibility mode, and with compatibility mode disabled. Issues discovered so far: [ ] Avoid binding `false` to attributes, bind `null` or `'false'` instead [ ] WvuiToggleButton's `aria-pressed` attribute [ ] `class` attribute no longer applies to root when `inheritAttrs: false` is used [ ] WvuiInput uses this, but WvuiTypeaheadSearch sets `class` on it. This applies to the root now but will move to the `<input>` element, which could cause problems. We may need to set ` :class="$attrs.class"` on the root element of WvuiInput. This only affects the `z-index: 1` rule on hover so the breakage would be subtle. [ ] The standard prop and event names for `v-model` changed from `value` and `input` in Vue 2 to `modelValue` and `update:modelValue` in Vue 3. We should work around this by setting `model: { prop: 'modelValue', event: 'update:modelValue' }` on all components that use accept v-model, and emitting the previous events for backwards compatibility in cases where codesearch finds that they were listened to. We should also check in codesearch that the prop names are unused (as they hopefully mostly are).

To make WVUI work well with code in various stages of being migrated to Vue 3, we should make sure it works both with the Vue 3 migration build in compatibility mode, and with compatibility mode disabled. Issues discovered so far: [ ] Avoid binding `false` to attributes, bind `null` or `'false'` instead [ ] WvuiToggleButton's `aria-pressed` attribute [ ] WvuiCheckbox's `aria-disabled` attribute [ ] `class` attribute no longer applies to root when `inheritAttrs: false` is used [ ] WvuiInput uses this, but WvuiTypeaheadSearch sets `class` on it. This applies to the root now but will move to the `<input>` element, which could cause problems. We may need to set ` :class="$attrs.class"` on the root element of WvuiInput. This only affects the `z-index: 1` rule on hover so the breakage would be subtle. [ ] The standard prop and event names for `v-model` changed from `value` and `input` in Vue 2 to `modelValue` and `update:modelValue` in Vue 3. We should work around this by setting `model: { prop: 'modelValue', event: 'update:modelValue' }` on all components that use accept v-model, and emitting the previous events for backwards compatibility in cases where codesearch finds that they were listened to. We should also check in codesearch that the prop names are unused (as they hopefully mostly are). [ ] WvuiInput [ ] WvuiCheckbox [ ] WvuiRadio [ ] WvuiDropdown [ ] WvuiOptionsMenu [ ] `Vue.observable()` should be replaced with `Vue.reactive()` from the composition API [ ] WvuiCheckbox [ ] Something about how WvuiCheckbox uses template refs doesn't work with the Vue 3 migration build: the `focusInput` method throws an error because `input.value` is undefined.

To make WVUI work well with code in various stages of being migrated to Vue 3, we should make sure it works both with the Vue 3 migration build in compatibility mode, and with compatibility mode disabled. Issues discovered so far: [ ] Avoid binding `false` to attributes, bind `null` or `'false'` instead [ ] WvuiToggleButton's `aria-pressed` attribute [ ] WvuiCheckbox's `aria-disabled` attribute [ ] `class` attribute no longer applies to root when `inheritAttrs: false` is used [ ] WvuiInput uses this, but WvuiTypeaheadSearch sets `class` on it. This applies to the root now but will move to the `<input>` element, which could cause problems. We may need to set ` :class="$attrs.class"` on the root element of WvuiInput. This only affects the `z-index: 1` rule on hover so the breakage would be subtle. [ ] The standard prop and event names for `v-model` changed from `value` and `input` in Vue 2 to `modelValue` and `update:modelValue` in Vue 3. We should work around this by setting `model: { prop: 'modelValue', event: 'update:modelValue' }` on all components that use accept v-model, and emitting the previous events for backwards compatibility in cases where codesearch finds that they were listened to. We should also check in codesearch that the prop names are unused (as they hopefully mostly are). [ ] WvuiInput [ ] WvuiCheckbox [ ] WvuiRadio [ ] WvuiDropdown [ ] WvuiOptionsMenu [ ] `Vue.observable()` should be replaced with `Vue.reactive()` from the composition API [ ] WvuiCheckbox [ ] Something about how WvuiCheckbox uses template refs doesn't work with the Vue 3 migration build: the `focusInput` method throws an error because `input.value` is undefined.