therwi/sunkkoma
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

resolve TODO VUE3

Browse source
This commit is contained in:
Henry Jameson 2021-04-25 13:23:16 +03:00
parent 6e687c0663
commit fca885e665
8 changed files with 41 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/components/color_input/color_input.vue
View file

@ -14,25 +14,25 @@
:checked="present"
:disabled="disabled"
class="opt"
@change="$emit('input', typeof value === 'undefined' ? fallback : undefined)"
@change="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
/>
<div class="input color-input-field">
<input
:id="name + '-t'"
class="textColor unstyled"
type="text"
:value="value || fallback"
:value="modelValue || fallback"
:disabled="!present || disabled"
@input="$emit('input', $event.target.value)"
@input="$emit('update:modelValue', $event.target.value)"
>
<input
v-if="validColor"
:id="name"
class="nativeColor unstyled"
type="color"
:value="value || fallback"
:value="modelValue || fallback"
:disabled="!present || disabled"
@input="$emit('input', $event.target.value)"
@input="$emit('update:modelValue', $event.target.value)"
>
<div
v-if="transparentColor"
@ -67,7 +67,7 @@ export default {
},
// Color value, should be required but vue cannot tell the difference
// between "property missing" and "property set to undefined"
value: {
modelValue: {
required: false,
type: String,
default: undefined
@ -93,16 +93,16 @@ export default {
},
computed: {
present () {
return typeof this.value !== 'undefined'
return typeof this.modelValue !== 'undefined'
},
validColor () {
return hex2rgb(this.value || this.fallback)
return hex2rgb(this.modelValue || this.fallback)
},
transparentColor () {
return this.value === 'transparent'
return this.modelValue === 'transparent'
},
computedColor () {
return this.value && this.value.startsWith('--')
return this.modelValue && this.modelValue.startsWith('--')
}
}
}