-
-
Notifications
You must be signed in to change notification settings - Fork 6.9k
/
index.ts
78 lines (72 loc) 路 2.06 KB
/
index.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
import Vue from 'vue'
import { VNodeData } from 'vue/types/vnode'
import { consoleError } from '../../util/console'
function isCssColor (color?: string | false): boolean {
return !!color && !!color.match(/^(#|var\(--|(rgb|hsl)a?\()/)
}
export default Vue.extend({
name: 'colorable',
props: {
color: String,
},
methods: {
setBackgroundColor (color?: string | false, data: VNodeData = {}): VNodeData {
if (typeof data.style === 'string') {
// istanbul ignore next
consoleError('style must be an object', this)
// istanbul ignore next
return data
}
if (typeof data.class === 'string') {
// istanbul ignore next
consoleError('class must be an object', this)
// istanbul ignore next
return data
}
if (isCssColor(color)) {
data.style = {
...data.style as object,
'background-color': `${color}`,
'border-color': `${color}`,
}
} else if (color) {
data.class = {
...data.class,
[color]: true,
}
}
return data
},
setTextColor (color?: string | false, data: VNodeData = {}): VNodeData {
if (typeof data.style === 'string') {
// istanbul ignore next
consoleError('style must be an object', this)
// istanbul ignore next
return data
}
if (typeof data.class === 'string') {
// istanbul ignore next
consoleError('class must be an object', this)
// istanbul ignore next
return data
}
if (isCssColor(color)) {
data.style = {
...data.style as object,
color: `${color}`,
'caret-color': `${color}`,
}
} else if (color) {
const [colorName, colorModifier] = color.toString().trim().split(' ', 2) as (string | undefined)[]
data.class = {
...data.class,
[colorName + '--text']: true,
}
if (colorModifier) {
data.class['text--' + colorModifier] = true
}
}
return data
},
},
})