pantoken-root / plugins/postcss/flatten-property/src / flattenProperty

Variable: flattenProperty ​

const flattenProperty: {(options?): Plugin; postcss: true; }

Beta

Create the flatten-@property PostCSS plugin.

Walks all @property at-rules in the stylesheet, extracts each initial-value descriptor, removes the at-rule, and prepends a single injectSelector { --name: value; … } rule containing all extracted declarations. Empty rules and @layer blocks left behind after removal are dropped.

Type Declaration ​

Parameters ​

options? ​

FlattenPropertyOptions

FlattenPropertyOptions.

Returns ​

Plugin

A PostCSS Plugin.

postcss ​

postcss: true

Required PostCSS plugin marker.

Examples ​

Default injection into :root

ts
import postcss from "postcss";
import { flattenProperty } from "@pantoken/plugin-flatten-property";

const out = postcss([flattenProperty()]).process(css, { from: undefined }).css;

Inject into :scope (for use inside scope blocks)

ts
import postcss from "postcss";
import { flattenProperty } from "@pantoken/plugin-flatten-property";

const out = postcss([flattenProperty({ injectSelector: ":scope" })]).process(css, { from: undefined }).css;
ts
Preserve