/
index.ts
69 lines (58 loc) · 1.92 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
import { mergeDeep } from '@unocss/core'
import { DEFAULT } from './default'
function getCSS(
escapedSelector: string,
selectorName: string,
preflights: object,
): string {
let css = ''
for (const selector in preflights) {
// @ts-expect-error preflights do not have definitive keys
const cssDeclarationBlock = preflights[selector]
const notProseSelector = `:not(:where(.not-${selectorName},.not-${selectorName} *))`
// since pseudo class & elements can't be matched
// within single :where(), they are splitted and rejoined.
const pseudoCSSMatchArray = selector
.split(',')
.map((s) => {
// pseudo class & pseudo elements matcher
// matches :, ::, -, (), numbers and words
const match = s.match(/::?(?:[\(\)\:\-\d\w]+)$/g)
if (match) {
const matchStr = match[0]
s = s.replace(matchStr, '')
return `${escapedSelector} :where(${s})${notProseSelector}${matchStr}`
}
return null
})
.filter(v => v)
// rejoin pseudo class & elements
// multi selectors, single utility
if (pseudoCSSMatchArray.length) {
css += pseudoCSSMatchArray.join(',')
}
else {
// directly from css declaration
css += `${escapedSelector} :where(${selector})${notProseSelector}`
}
css += '{'
for (const k in cssDeclarationBlock) {
const v = cssDeclarationBlock[k]
css += `${k}:${v};`
}
css += '}'
}
return css
}
export function getPreflights(
escapedSelector: string,
selectorName: string,
cssExtend?: object | undefined,
): string {
// attribute mode -> add class selector with `:is()` pseudo-class function
if (!escapedSelector.startsWith('.'))
escapedSelector = `:is(${escapedSelector},.${selectorName})`
if (cssExtend)
return getCSS(escapedSelector, selectorName, mergeDeep(DEFAULT, cssExtend))
return getCSS(escapedSelector, selectorName, DEFAULT)
}