mercuryworkshop-mirror/dreamlandjs
1
0
Fork 0
mirror of https://github.com/MercuryWorkshop/dreamlandjs.git synced 2025-05-15 07:10:00 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

(breaking) nuke css dynamic variables and flatten css` and rule` into the same function

Browse source
This commit is contained in:
CoolElectronics 2024-03-18 21:13:03 -04:00
parent 1b33b2a700
commit 469ceff2ab
No known key found for this signature in database
GPG key ID: F63593D168636C50
1 changed files with 10 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

70
src/css.js
View file

@ -1,28 +1,14 @@
Object.assign(window, { css, rule, styled: { new: css, rule: rule } })
Object.assign(window, { css, rule: css, styled: { new: css, rule: css } })
const cssmap = {}
function scopify_css(uid, css) {
const virtualDoc = document.implementation.createHTMLDocument('')
const virtualStyleElement = document.createElement('style')
virtualDoc.body.appendChild(virtualStyleElement)
let cssParsed = ''
virtualStyleElement.textContent = css
//@ts-ignore
for (const rule of virtualStyleElement.sheet.cssRules) {
rule.selectorText = rule.selectorText.includes('self')
? `.${uid}.self${rule.selectorText.replace('self', '')}`
: `.${uid} ${rule.selectorText}`
cssParsed += `${rule.cssText}\n`
export function css(strings, ...values) {
let str = ''
for (let f of strings) {
str += f + (values.shift() || '')
}
return cssParsed
}
function tagcss(strings, values, isblock) {
let cached = cssmap[strings[0]]
let cachable = strings.length == 1
if (cachable && cached) return cached
let cached = cssmap[str]
if (cached) return cached
const uid = `dl${Array(5)
.fill(0)
.map(() => {
@ -31,46 +17,10 @@ function tagcss(strings, values, isblock) {
.join('')}`
const styleElement = document.createElement('style')
document.head.appendChild(styleElement)
const flattened_template = []
for (const i in strings) {
flattened_template.push(strings[i])
if (values[i]) {
const prop = values[i]
if (isDLPtr(prop)) {
const current_i = flattened_template.length
let oldparsed
handle(prop, (val) => {
flattened_template[current_i] = String(val)
let parsed = flattened_template.join('')
if (parsed != oldparsed)
if (isblock)
styleElement.textContent = scopify_css(uid, parsed)
else styleElement.textContent = `.${uid} { ${parsed}; }`
oldparsed = parsed
})
} else {
flattened_template.push(String(prop))
}
}
}
if (isblock) {
styleElement.textContent = scopify_css(uid, flattened_template.join(''))
} else {
styleElement.textContent = `.${uid} { ${flattened_template.join('')}; }`
}
if (cachable) cssmap[strings[0]] = uid
styleElement.textContent = `.${uid} { ${str}; }`
cssmap[str] = uid
return uid
}
function rule(strings, ...values) {
return tagcss(strings, values, false)
}
function css(strings, ...values) {
return tagcss(strings, values, true)
}