Containment checks for text rendered verbatim into a stylesheet.
A theme is plain data, and a theme restored from storage or handed across
a boundary is untrusted data. Its values land in CSS as written, so each
one has to stay inside the declaration it was rendered into - and inside
the <style> element when the CSS is injected as HTML. The Theme schema
reports a failing value as an error, and render_theme_style drops it.
These are not CSS validators: a contained value can still be meaningless CSS, which the browser discards on its own.
Each check takes unknown and fails anything that isn't a string, so
unvalidated data can be handed over as it is: a non-string would otherwise
be coerced on its way into the stylesheet, past the check that read it.
4 declarations
css_containment.ts view source
(text: unknown): boolean import {css_comment_is_contained} from '@fuzdev/fuz_css/css_containment.js'; Checks that text can sit inside a CSS comment without closing it.
textthe comment body, e.g. a style variable's summary
unknownboolean css_containment.ts view source
(name: unknown): boolean import {css_custom_property_name_is_contained} from '@fuzdev/fuz_css/css_containment.js'; Checks that a custom property name is a plain identifier, so it can't smuggle a value or a second declaration in with it.
namethe name without its -- prefix
unknownboolean css_containment.ts view source
(value: unknown): boolean import {css_value_is_contained} from '@fuzdev/fuz_css/css_containment.js'; Checks that a declaration value can't end its own declaration or rule:
quotes and brackets balance, and nothing outside a string closes the
declaration (a top-level ;), opens or closes a block, sets !important,
opens a comment, or escapes a character. Stricter than the grammar where
that keeps the rule simple - braces, comments, and escapes outside strings
are rejected outright, as is an unquoted url( whose contents a quoted one
would hold, so quote a URL that needs them.
valuethe declaration value, e.g. a style variable's slot
unknownboolean css_containment.ts view source
(value: string): string import {escape_css_identifier} from '@fuzdev/fuz_css/css_containment.js'; Serializes a string as a CSS identifier, so any string can name an element
id in a selector ('#' + escape_css_identifier(id) matches the element
whose id attribute is that string). Follows the CSSOM identifier
serialization, except that ASCII punctuation is escaped by code point
(\3c ) rather than with a bare backslash, since \</style still closes a
<style> element - the output can't end its rule or its element.
valuethe raw identifier text
stringstring the identifier, safe to follow # or . in a selector