Typescript Library - Custom Colors - CSS Variables

[wojtek-viirtue]

The applyTheme function as referenced below, creates CSS variables on a given target element and scopes everything to the sys token type. However, custom colors are not factored in. Given that the custom colors do account for "color", "on", and "container" (as well as light/dark) is there a convention for how these should be tokenized. Also, is there a reason that the convention would/wouldn't be applied in the applyTheme function ?

material-color-utilities/typescript/utils/theme_utils.ts

Lines 154 to 166 in 9e67d5e

	export function applyTheme(theme: Theme, options?: {
	dark?: boolean,
	target?: HTMLElement,
	}) {
	const target = options?.target || document.body;
	const isDark = options?.dark ?? false;
	const scheme = isDark ? theme.schemes.dark : theme.schemes.light;
	for (const [key, value] of Object.entries(scheme.toJSON())) {
	const token = key.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
	const color = hexFromArgb(value);
	target.style.setProperty(`--md-sys-color-${token}`, color);
	}
	}