feat(rdom): support setting CSS vars via $style()

postspectacular · postspectacular · commit 81169ee4e3ad · 2024-08-24T10:01:43.000+02:00
diff --git a/packages/rdom/src/dom.ts b/packages/rdom/src/dom.ts
@@ -457,11 +457,11 @@ export const $style = (el: Element, rules: string | any) => {
 	if (isString(rules)) {
 		el.setAttribute("style", rules);
 	} else {
-		const style: any = (<HTMLElement>el).style;
+		const style = (<HTMLElement>el).style;
 		for (let id in rules) {
 			let v = deref(rules[id]);
 			isFunction(v) && (v = v(rules));
-			style[id] = v != null ? v : "";
+			style.setProperty(id, v != null ? v : "");
 		}
 	}
 };

Original file line number	Diff line number	Diff line change
`@@ -457,11 +457,11 @@ export const $style = (el: Element, rules: string \| any) => {`
`457`	`457`	`if (isString(rules)) {`
`458`	`458`	`el.setAttribute("style", rules);`
`459`	`459`	`} else {`
`460`		`- const style: any = (<HTMLElement>el).style;`
	`460`	`+ const style = (<HTMLElement>el).style;`
`461`	`461`	`for (let id in rules) {`
`462`	`462`	`let v = deref(rules[id]);`
`463`	`463`	`isFunction(v) && (v = v(rules));`
`464`		`- style[id] = v != null ? v : "";`
	`464`	`+ style.setProperty(id, v != null ? v : "");`
`465`	`465`	`}`
`466`	`466`	`}`
`467`	`467`	`};`