css_class_extractor.ts view source
AcornPlugin Acorn plugin type - a function that extends the Parser class.
CSS framework and design system for semantic HTML
524 declarations
css_class_extractor.ts view source
AcornPlugin Acorn plugin type - a function that extends the Parser class.
Set<string> All modifier names for quick lookup
Map<string, ModifierDefinition> Map of ancestor modifier names to their CSS output
RegExp Pattern for arbitrary max-width breakpoints: max-width(600px):
RegExp Pattern for arbitrary min-width breakpoints: min-width(800px):
example_class_utilities.ts view source
string[] Array - all elements extracted
BaseDiagnostic Base diagnostic with common fields.
level'error' | 'warning'messagestringsuggestionstring | nullStyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly [1, 2, 3, 4, 5] StyleVariable StyleVariable StyleVariable StyleVariable readonly ["xs3", "xs2", "xs", "sm", "md", "lg", "xl"] StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly [1, 2, 3, 4, 5, 6, 7, 8, 9] 4 | 3 | 1 | 2 | 5 "xs" | "sm" | "md" | "lg" | "xl" | "xs3" | "xs2" 4 | 3 | 1 | 2 | 5 | 6 | 7 | 8 | 9 StyleVariable StyleVariable StyleVariable CachedExtraction Cached extraction result for a single file.
Uses null instead of empty arrays to avoid allocation overhead.
vCache version - invalidates cache when bumped
numbercontent_hashSHA-256 hash of the source file contents
stringclassesClasses as [name, locations] tuples, or null if none
Array<[string, Array<SourceLocation>]> | nullexplicit_classesClasses from
Array<string> | nulldiagnosticsExtraction diagnostics, or null if none
Array<ExtractionDiagnostic> | null(value: string): string | null Checks if a value contains a possibly invalid calc expression.
value- The formatted CSS value
stringstring | null Warning message if suspicious, null otherwise
css_class_generators.ts view source
ClassTemplateFn<T1, T2, T3> T1stringT2stringT3stringStyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable ColorScheme[] readonly ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j"] ColorScheme "a" | "b" | "c" | "d" | "e" | "f" | "g" | "h" | "i" | "j" (content: string): Promise<string> Computes SHA-256 hash of content using Web Crypto API.
contentstringPromise<string> (diagnostic: InterpreterDiagnostic, locations: SourceLocation[] | null): GenerationDiagnostic Converts a InterpreterDiagnostic to a GenerationDiagnostic with locations.
diagnostic- Interpreter diagnostic to convert
locations- Source locations where the class was used
SourceLocation[] | nullGenerationDiagnostic css_class_composites.ts view source
Record<string, CssClassDefinition | undefined> css_class_definitions.ts view source
Record<string, CssClassDefinition | undefined> All built-in CSS class definitions (token classes + composites).
``generate_classes_css``
css_class_interpreters.ts view source
CssClassDefinitionInterpreter[] Collection of all builtin interpreters for dynamic CSS class generation.
Order matters: modified_class_interpreter runs first to handle hover:box before
css_literal_interpreter tries to interpret it as hover:box (property:value).
css_class_generators.ts view source
readonly ["top", "right", "bottom", "left"] css_class_interpreters.ts view source
CssClassDefinitionInterpreter Interpreter for CSS-literal classes (e.g., display:flex, hover:opacity:80%).
Generates full CSS rulesets including any modifier wrappers.
css_class_generation.ts view source
CssClassDefinition Full union including interpreters.
css_class_generation.ts view source
CssClassDefinitionBase commentstringcss_class_generation.ts view source
CssClassDefinitionComposition Pure utility composition (composes only).
composesArray<string>declarationneverrulesetnevercss_class_generation.ts view source
CssClassDefinitionDeclaration Custom CSS declaration (optionally seeded with composes).
declarationstringcomposesArray<string>rulesetnevercss_class_generation.ts view source
CssClassDefinitionInterpreter Interpreter for dynamic CSS class generation based on pattern matching.
patternRegExpinterpret(matched: RegExpMatchArray, ctx: CssClassInterpreterContext) => string | nullcss_class_generation.ts view source
CssClassDefinitionRuleset Full ruleset with selectors.
rulesetstringclassesneverdeclarationnevercss_class_generation.ts view source
CssClassDefinitionStatic Static definitions (not interpreter-based).
Collection of CSS classes extracted from source files.
Tracks classes per-file for efficient incremental updates.
Handles include/exclude filtering and explicit class tracking.
Uses null instead of empty collections to avoid allocation overhead.
constructorCreates a new CssClasses collection.
type new (include_classes?: Set<string> | null, exclude_classes?: Set<string> | null): CssClasses
include_classes- Classes to always include (also treated as explicit for warnings)
Set<string> | nullnullexclude_classes- Classes to exclude from output (also suppresses warnings)
Set<string> | nullnulladdAdds extraction results for a file. Replaces any previous classes and diagnostics for this file.
type (id: string, classes: Map<string, SourceLocation[]> | null, explicit_classes?: Set<string> | null | undefined, diagnostics?: ExtractionDiagnostic[] | null | undefined): void
id- File identifier
stringclasses- Map of class names to their source locations, or null if none
Map<string, SourceLocation[]> | nullexplicit_classes?- Classes from
Set<string> | null | undefineddiagnostics?- Extraction diagnostics from this file, or null if none
ExtractionDiagnostic[] | null | undefinedvoiddeletetype (id: string): void
idstringvoidgetGets all unique class names as a Set (with exclude filter applied).
type (): Set<string>
Set<string>get_with_locationsGets all classes with their source locations (with exclude filter applied). Locations from include_classes are null.
type (): Map<string, SourceLocation[] | null>
Map<string, SourceLocation[] | null>get_allGets all classes and their locations in a single call.
More efficient than calling get() and get_with_locations() separately
when both are needed (avoids potential double recalculation).
Results have exclude filter applied and explicit_classes includes include_classes.
type (): { all_classes: Set<string>; all_classes_with_locations: Map<string, SourceLocation[] | null>; explicit_classes: Set<string> | null; }
{ all_classes: Set<string>; all_classes_with_locations: Map<string, SourceLocation[] | null>; explicit_classes: Set<string> | null; }get_diagnosticsGets all extraction diagnostics from all files.
type (): ExtractionDiagnostic[]
ExtractionDiagnostic[]css_class_generation.ts view source
CssClassInterpreterContext Context passed to CSS class interpreters. Provides access to logging, diagnostics collection, and the class registry.
logOptional logger for warnings/errors
LoggerdiagnosticsDiagnostics array to collect warnings and errors
Array<InterpreterDiagnostic>class_definitionsAll known CSS class definitions (token + composite classes)
Record<string, CssClassDefinition | undefined>css_propertiesValid CSS properties for literal validation, or null to skip validation
Set<string> | nullcss_class_generators.ts view source
"top" | "right" | "bottom" | "left" Error thrown when CSS generation encounters errors or warnings
(depending on on_error and on_warning settings).
Contains the full diagnostics array for programmatic access.
Errordiagnosticstype Array<Diagnostic>
constructortype new (diagnostics: Diagnostic[]): CssGenerationError
diagnosticsDiagnostic[]CssLiteralOutput Information needed to generate CSS output for a CSS-literal class.
declarationCSS declaration (property: value;)
stringselectorFull CSS selector including pseudo-classes/elements
stringmedia_wrapperMedia query wrapper if any
string | nullancestor_wrapperAncestor wrapper if any
string | nullCssLiteralParseResult Result of parsing a CSS-literal class name.
Uses a discriminated union (Result type) because parsing a single class is binary: it either succeeds or fails entirely. This differs from which uses embedded diagnostics because file extraction can partially succeed (some classes extracted, others have errors).
Uses | null for diagnostics to avoid allocating empty arrays.
Callers should use a guard pattern: if (result.diagnostics) { ... }
StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable ".fuz/cache/css" Default cache directory relative to project root.
Theme Theme[] These are super basic proof-of-concept themes.
StyleVariable[] These are implicitly the variables for the base theme.
See also the empty variables array of the base theme above.
(cache_path: string): Promise<void> Deletes a cached extraction file. Silently succeeds if the file doesn't exist.
cache_path- Absolute path to the cache file
stringPromise<void> example_class_utilities.ts view source
"mb_xs4" *_class suffix (snake_case)
example_class_utilities.ts view source
"mb_xs3" SCREAMING_SNAKE_CASE naming
example_class_utilities.ts view source
"mb_xl3" *class_list suffix (snake_case)
example_class_utilities.ts view source
"mb_xl5 ml_xl2" *class_lists suffix (snake_case) - plural, multiple classes
example_class_utilities.ts view source
"mb_md" *class_name suffix (snake_case)
example_class_utilities.ts view source
"mb_xl ml_lg" *class_names suffix (snake_case) - plural, multiple classes
example_class_utilities.ts view source
"mb_xs ml_sm" *_classes suffix (snake_case) - plural, multiple classes
example_class_utilities.ts view source
"mb_xs5" *Class suffix (camelCase)
example_class_utilities.ts view source
"mb_xs2 ml_xs" *Classes suffix (camelCase) - plural, multiple classes
example_class_utilities.ts view source
"mb_xl2" *ClassList suffix (camelCase)
example_class_utilities.ts view source
"mb_xl4 ml_xl" *ClassLists suffix (camelCase) - plural, multiple classes
example_class_utilities.ts view source
"mb_sm" *ClassName suffix (camelCase)
example_class_utilities.ts view source
"mb_lg ml_md" *ClassNames suffix (camelCase) - plural, multiple classes
Diagnostic Union of all diagnostic types.
StyleVariable StyleVariable StyleVariable StyleVariable readonly ["xs", "sm", "md", "lg", "xl"] StyleVariable StyleVariable "xs" | "sm" | "md" | "lg" | "xl" StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable css_class_generation.ts view source
(name: string): string Escapes special characters in a CSS class name for use in a selector.
CSS selectors require escaping of characters like :, %, (, ), etc.
namestringstring (segments: string[], class_name: string): ModifierExtractionResult Extracts and validates modifiers from the beginning of a segments array. Modifiers are consumed from the front until a non-modifier segment is found.
Used by both CSS-literal parsing and modified class interpretation.
segments- Array of colon-separated segments
string[]class_name- Original class name for error messages
stringModifierExtractionResult ModifierExtractionResult with modifiers and remaining segments, or error
css_class_extractor.ts view source
(source: string, options?: ExtractCssClassesOptions): Set<string> Unified extraction function that auto-detects file type. Returns just the class names as a Set.
source- The file source code
stringoptions- Extraction options
{}Set<string> Set of class names
css_class_extractor.ts view source
(source: string, options?: ExtractCssClassesOptions): ExtractionResult Unified extraction function that auto-detects file type. Returns full extraction result with locations and diagnostics.
source- The file source code
stringoptions- Extraction options
{}ExtractionResult Full extraction result with classes, tracked variables, and diagnostics
css_ruleset_parser.ts view source
(css: string, rules: ParsedRule[]): string | null Extracts the CSS comment from a ruleset (if any). Looks for comments before the first rule.
css- Raw CSS string
stringrules- Parsed rules
ParsedRule[]string | null Comment text without delimiters, or null if no comment
css_class_extractor.ts view source
(source: string, file?: string): ExtractionResult Extracts CSS classes from a Svelte file using AST parsing.
source- The Svelte file source code
stringfile- File path for location tracking
string'<unknown>'ExtractionResult Extraction result with classes, tracked variables, and diagnostics
css_class_extractor.ts view source
(source: string, file?: string, acorn_plugins?: AcornPlugin[] | undefined): ExtractionResult Extracts CSS classes from a TypeScript/JS file using AST parsing.
source- The TS/JS file source code
stringfile- File path for location tracking
string'<unknown>'acorn_plugins?- Additional acorn plugins (e.g., acorn-jsx for React)
AcornPlugin[] | undefinedExtractionResult Extraction result with classes, tracked variables, and diagnostics
(class_name: string): string[] Extracts colon-separated segments from a class name, handling parentheses. Parenthesized content (like function arguments) is kept intact.
class_namestringstring[] css_class_extractor.ts view source
ExtractCssClassesOptions Options for CSS class extraction.
filenameFile path used to determine extraction method (Svelte vs TS) and for location tracking in diagnostics.
stringacorn_pluginsAdditional acorn plugins to use when parsing TS/JS files.
Useful for adding JSX support via acorn-jsx for React projects.
Array<AcornPlugin>ExtractedModifiers Extracted modifiers from a class name. Used by both CSS-literal parsing and modified class interpretation.
mediaMedia modifier (breakpoint or feature query)
ModifierDefinition | nullancestorAncestor modifier (dark/light)
ModifierDefinition | nullstatesState modifiers in alphabetical order (can have multiple)
Array<ModifierDefinition>pseudo_elementPseudo-element modifier (before, after, etc.)
ModifierDefinition | nullExtractionDiagnostic Diagnostic from the extraction phase.
phase'extraction'locationcss_class_extractor.ts view source
ExtractionResult Extraction result with classes mapped to their source locations.
Uses null instead of empty collections to avoid allocation overhead.
Uses embedded diagnostics (rather than a Result type) because file extraction can partially succeed: some classes may be extracted while others produce errors. This differs from which uses a discriminated union because single-class parsing is binary success/failure.
classesMap from class name to locations where it was used, or null if none. Keys = unique classes, values = locations for diagnostics/IDE integration.
Map<string, Array<SourceLocation>> | nullexplicit_classesClasses explicitly annotated via @fuz-classes comments, or null if none.
These should produce warnings if they can't be resolved during generation.
Set<string> | nulltracked_varsVariables that were used in class contexts, or null if none
Set<string> | nulldiagnosticsDiagnostics from the extraction phase, or null if none
Array<ExtractionDiagnostic> | nullStyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable FileFilter Filter function to determine which files to process for CSS class extraction.
StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable (path: string): boolean Default file filter for CSS class extraction. Includes .svelte, .html, .ts, .js, .tsx, .jsx files. Excludes test files and generated files.
pathstringboolean css_ruleset_parser.ts view source
(selector: string, class_pos: number): number Finds the end position of the compound selector containing the class at class_pos. A compound selector is a sequence of simple selectors without combinators.
selector- The CSS selector string
stringclass_pos- Position of the . in .class_name
numbernumber Position where state modifiers should be inserted (before any pseudo-element)
StyleVariable StyleVariable StyleVariable readonly ["font_family_sans", "font_family_serif", "font_family_mono"] StyleVariable StyleVariable string[] StyleVariable readonly ["xs", "sm", "md", "lg", "xl", "xl2", "xl3", "xl4", "xl5", "xl6", "xl7", "xl8", "xl9"] StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable "font_family_sans" | "font_family_serif" | "font_family_mono" (value: string): string Formats a CSS-literal value for CSS output.
- Replaces ~ with space
- Ensures space before !important
value- Raw value from class name
stringstring Formatted CSS value
(d: Diagnostic): string Formats a diagnostic for display.
dstring css_class_generators.ts view source
(value: string): string Format width/height values for CSS (handles 0, auto, percentages, pixels, content values, and CSS variables). Used by width and height properties.
valuestringstring css_class_generators.ts view source
(value: string): string Format spacing values for CSS (handles 0, auto, percentages, pixels, and CSS variables). Used by margin, padding, gap, inset, top/right/bottom/left, etc.
valuestringstring css_class_generators.ts view source
(str: string): string strstringstring (cached: CachedExtraction): { classes: Map<string, SourceLocation[]> | null; explicit_classes: Set<string> | null; diagnostics: ExtractionDiagnostic[] | null; } Converts a cached extraction back to the runtime format. Preserves null semantics (null = empty).
cached- Cached extraction data
{ classes: Map<string, SourceLocation[]> | null; explicit_classes: Set<string> | null; diagnostics: ExtractionDiagnostic[] | null; } example_class_utilities.ts view source
"shadow_lg" Comment hint - extracted via
vite_plugin_fuz_css.ts view source
"/* generated by vite_plugin_fuz_css */" Marker comment used to delimit generated CSS in the output.
(options?: GenFuzCssOptions): Gen options{}Gen css_class_generators.ts view source
(values: Iterable<string>, formatter?: ((value: string) => string) | undefined): Record<string, CssClassDefinition> Generate border radius corner classes for all four corners. Creates classes for top-left, top-right, bottom-left, bottom-right corners.
values- The values to generate classes for
Iterable<string>formatter?- Optional function to format values
((value: string) => string) | undefinedRecord<string, CssClassDefinition> css_class_generators.ts view source
<T1 = string, T2 = string, T3 = string>(template: ClassTemplateFn<T1, T2, T3>, values: Iterable<T1>, secondary?: Iterable<T2> | undefined, tertiary?: Iterable<...> | undefined): Record<...> Generates CSS class declarations from templates. Supports up to 3 dimensions of multiplicative combinations.
template- Function that generates CSS from values, can return null to skip
ClassTemplateFn<T1, T2, T3>values- Primary iterable of values
Iterable<T1>secondary?- Optional second dimension (makes it multiplicative)
Iterable<T2> | undefinedtertiary?- Optional third dimension for even more combinations
Iterable<T3> | undefinedRecord<string, CssClassDefinition> css_class_generation.ts view source
(options: GenerateClassesCssOptions): GenerateClassesCssResult optionsGenerateClassesCssResult (output: CssLiteralOutput): string Generates simple CSS for a CSS-literal class (without grouping). Used by the interpreter for basic output.
output- The CSS-literal output info
string CSS string for this class
(parsed: ParsedCssLiteral): string Generates the CSS declaration for a parsed CSS-literal class.
parsedstring css_class_generators.ts view source
(property: string, values: Iterable<string>, formatter?: ((v: string) => string) | undefined): Record<string, CssClassDefinition> Generate directional classes for properties like margin and padding. Creates classes for all directions: base, top, right, bottom, left, x (horizontal), y (vertical).
property- The base CSS property name (e.g. 'margin', 'padding')
stringvalues- The values to generate classes for
Iterable<string>formatter?- Optional function to format values (defaults to identity)
((v: string) => string) | undefinedRecord<string, CssClassDefinition> css_ruleset_parser.ts view source
(original_ruleset: string, original_class: string, new_class_escaped: string, state_css: string, pseudo_element_css: string, media_wrapper: string | null, ancestor_wrapper: string | null): ModifiedRulesetResult Generates CSS for a modified ruleset with applied modifiers.
Conflict handling is per-selector within selector lists:
- For .plain:hover, .plain:active with hover: modifier, only .plain:hover skips
the :hover addition; .plain:active still gets :hover appended.
- For multiple states like :hover:focus, each is checked individually; conflicting
states are skipped while non-conflicting ones are still applied.
original_ruleset- The original CSS ruleset string
stringoriginal_class- The base class name
stringnew_class_escaped- The escaped new class name with modifiers
stringstate_css- State modifier CSS (e.g., ":hover" or ":hover:focus")
stringpseudo_element_css- Pseudo-element modifier CSS (e.g., "::before")
stringmedia_wrapper- Media query wrapper (e.g., "@media (width >= 48rem)")
string | nullancestor_wrapper- Ancestor wrapper (e.g., ":root.dark")
string | nullModifiedRulesetResult Result with generated CSS and information about skipped modifiers
css_class_generators.ts view source
(property: string, values: Iterable<string>, formatter?: ((value: string) => string) | undefined, prefix?: string): Record<string, CssClassDefinition> Generate classes for a single CSS property with various values.
property- The CSS property name (e.g. 'font-size', 'gap')
stringvalues- The values to generate classes for
Iterable<string>formatter?- Optional function to format values (e.g. v => var(--space_${v}))
((value: string) => string) | undefinedprefix- Optional class name prefix (defaults to property with dashes replaced by underscores)
stringformat_variable_name(property)Record<string, CssClassDefinition> (escaped_class_name: string, parsed: ParsedCssLiteral): string Generates the CSS selector for a parsed CSS-literal class. Includes state pseudo-classes and pseudo-element in the selector.
escaped_class_namestringparsedstring css_class_generators.ts view source
(sizes: Iterable<string>, alpha_mapping: Record<string, string>): Record<string, CssClassDefinition> Generate shadow classes for various shadow types and sizes. Creates classes for regular, top, bottom, inset, inset-top, and inset-bottom shadows. Each shadow uses color-mix with alpha values for transparency.
sizes- The shadow size variants (xs, sm, md, lg, xl)
Iterable<string>alpha_mapping- Mapping of sizes to alpha numbers (1-5)
Record<string, string>Record<string, CssClassDefinition> css_class_generation.ts view source
GenerateClassesCssOptions class_namesIterable<string>class_definitionsRecord<string, CssClassDefinition | undefined>interpretersArray<CssClassDefinitionInterpreter>css_propertiesValid CSS properties for literal validation, or null to skip validation
Set<string> | nulllogLoggerclass_locationsMap<string, Array<SourceLocation> | null>explicit_classesClasses that were explicitly annotated (via
Set<string> | nullcss_class_generation.ts view source
GenerateClassesCssResult Result from CSS class generation.
cssstringdiagnosticsArray<GenerationDiagnostic>css_class_generators.ts view source
GeneratedClassResult GenerationDiagnostic Diagnostic from the generation phase.
phase'generation'level'error' | 'warning'messagestringsuggestionstring | nullclass_namestringlocationsSource locations where this class was used, or null if from include_classes
Array<SourceLocation> | nullGenFuzCssOptions filter_fileinclude_statsbooleanclass_definitionsAdditional class definitions to merge with defaults.
User definitions take precedence over defaults with the same name.
Required when include_default_definitions is false.
Record<string, CssClassDefinition | undefined>include_default_definitionsWhether to include default class definitions (token and composite classes).
When false, class_definitions is required.
booleanclass_interpretersCustom interpreters for dynamic class generation. Replaces the builtin interpreters entirely if provided.
Array<CssClassDefinitionInterpreter>on_errorHow to handle CSS-literal errors during generation. - 'log': Log errors, skip invalid classes, continue - 'throw': Throw on first error, fail the build
'log' | 'throw'on_warningHow to handle warnings during generation. - 'log': Log warnings, continue - 'throw': Throw on first warning, fail the build - 'ignore': Suppress warnings entirely
'log' | 'throw' | 'ignore'include_classesClasses to always include in the output, regardless of whether they're detected in source files. Useful for dynamically generated class names that can't be statically extracted.
Iterable<string>exclude_classesClasses to exclude from the output, even if they're detected in source files. Useful for filtering out false positives from extraction.
Iterable<string>cache_dirCache directory relative to project_root.
stringproject_rootProject root directory. Source paths must be under this directory.
stringconcurrencyMax concurrent file processing (cache read + extract). Bottlenecked by CPU-bound AST parsing.
numbercache_io_concurrencyMax concurrent cache writes and deletes (I/O-bound).
numberacorn_pluginsAdditional acorn plugins to use when parsing TS/JS files.
Useful for adding JSX support via acorn-jsx for React projects.
Array<AcornPlugin>(): string[] Gets all modifier names for error message suggestions.
string[] (source_path: string, cache_dir: string, project_root: string): string Computes the cache file path for a source file.
Cache structure mirrors source tree: src/lib/Foo.svelte → .fuz/cache/css/src/lib/Foo.svelte.json
source_path- Absolute path to the source file
stringcache_dir- Absolute path to the cache directory
stringproject_root- Normalized project root (must end with /)
stringstring (segment: string): (ModifierDefinition & { is_arbitrary?: boolean | undefined; }) | null Gets the modifier definition for a segment. Handles both static modifiers and dynamic patterns (arbitrary breakpoints, parameterized states).
segmentstring(ModifierDefinition & { is_arbitrary?: boolean | undefined; }) | null The modifier definition or null if not a known modifier
(modifiers: ExtractedModifiers): boolean Checks if extracted modifiers contain any modifier. Useful for tooling that needs to detect modified classes.
modifiersboolean (parsed: ParsedCssLiteral): boolean Checks if a parsed CSS literal has any modifiers.
parsedboolean StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly ["xs", "sm", "md", "lg", "xl", "xl2", "xl3"] StyleVariable StyleVariable StyleVariable StyleVariable { icon_size_xs: string; icon_size_sm: string; icon_size_md: string; icon_size_lg: string; icon_size_xl: string; icon_size_xl2: string; icon_size_xl3: string; } "xs" | "sm" | "md" | "lg" | "xl" | "xl2" | "xl3" StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly [1, 2, 3, 4, 5, 6, 7, 8, 9] 4 | 3 | 1 | 2 | 5 | 6 | 7 | 8 | 9 (class_name: string, escaped_class_name: string, css_properties: Set<string> | null): InterpretCssLiteralResult Interprets a CSS-literal class and returns CSS generation info.
Callers should first check is_possible_css_literal() to filter non-CSS-literal classes.
class_name- The class name to interpret
stringescaped_class_name- The CSS-escaped version of the class name
stringcss_properties- Set of valid CSS properties from load_css_properties().
Pass null to skip property validation.
Set<string> | nullInterpretCssLiteralResult Result with output and warnings on success, or error on failure
InterpretCssLiteralResult Result of interpreting a CSS-literal class.
Uses | null for warnings to avoid allocating empty arrays.
Callers should use a guard pattern: if (result.warnings) { ... }
InterpreterDiagnostic Diagnostic from CSS class interpretation. Used internally by interpreters; converted to GenerationDiagnostic with locations.
level'error' | 'warning'messagestringclass_namestringsuggestionstring | null(class_name: string): boolean Checks if a class name could be a CSS-literal class. Quick check before attempting full parse.
class_name- The class name to check
stringboolean True if it could be CSS-literal syntax
css_ruleset_parser.ts view source
(rules: ParsedRule[], escaped_class_name: string): boolean Checks if a ruleset has only a single simple selector (just the class name). Used to detect rulesets that could be converted to declaration format.
rules- Parsed rules from the ruleset
ParsedRule[]escaped_class_name- The CSS-escaped class name (e.g., "box" or "hover\\:card")
stringboolean True if there's exactly one rule with selector ".class_name"
(name: string): name is StyleVariableName namestringboolean (property: string, properties: Set<string> | null): boolean Checks if a property name is a valid CSS property. Custom properties (--*) always return true.
property- The CSS property name to validate
stringproperties- Set of valid CSS properties from load_css_properties().
Pass null to skip validation.
Set<string> | nullboolean True if valid CSS property or custom property
StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable string[] StyleVariable readonly ["xs", "sm", "md", "lg", "xl"] StyleVariable StyleVariable "xs" | "sm" | "md" | "lg" | "xl" StyleVariable StyleVariable LiteralResolutionResult Result of attempting to resolve a CSS literal for composition.
(cache_path: string): Promise<CachedExtraction | null> Loads a cached extraction result from disk.
Returns null if the cache is missing, corrupted, or has a version mismatch.
This makes the cache self-healing: any error triggers re-extraction.
cache_path- Absolute path to the cache file
stringPromise<CachedExtraction | null> (): Promise<Set<string>> Loads CSS properties from
Promise<Set<string>> example_class_utilities.ts view source
"mt_md" Logical AND - truthy value extracted
Map<string, ModifierDefinition> Map of media modifier names to their CSS output
css_class_interpreters.ts view source
CssClassDefinitionInterpreter Interpreter for modified token/composite classes (e.g., hover:p_md, md:box, dark:hover:panel).
Applies modifiers to existing declaration-based or ruleset-based classes.
This interpreter must run BEFORE css_literal_interpreter to handle cases like hover:box
where box is a known class (not a CSS property).
css_ruleset_parser.ts view source
ModifiedRulesetResult Result from generating a modified ruleset.
Uses | null for skipped_modifiers to avoid allocating empty arrays.
Callers should use a guard pattern: if (result.skipped_modifiers) { ... }
cssThe generated CSS
stringskipped_modifiersInformation about modifiers that were skipped for certain rules, or null if none
Array<SkippedModifierInfo> | nullcss_ruleset_parser.ts view source
ModifiedSelectorGroupResult Result from modifying a selector group with conflict detection.
Uses | null for skipped_modifiers to avoid allocating empty arrays.
Callers should use a guard pattern: if (result.skipped_modifiers) { ... }
selectorThe modified selector list as a string
stringskipped_modifiersInformation about modifiers skipped for specific selectors, or null if none
Array<SkippedModifierInfo> | nullModifierDefinition Definition for a single modifier.
nameThe prefix used in class names (e.g., 'hover', 'md', 'dark')
stringtypeType determines position in modifier order and CSS output behavior
cssThe CSS output - wrapper for media/ancestor, suffix for state/pseudo-element
stringorderOptional ordering within type (for breakpoints, sorted by this value)
numberModifierExtractionResult Result of extracting modifiers from segments.
ModifierDefinition[] All modifier definitions in a single declarative structure. Adding a new modifier requires only adding to this array.
ModifierType Type of modifier determining its position in the class name and CSS output.
Order in class names: [media:][ancestor:][state...:][pseudo-element:]property:value
css_ruleset_parser.ts view source
(selector_group: string, original_class: string, new_class_escaped: string, states_to_add: string[], pseudo_element_css: string): ModifiedSelectorGroupResult Modifies a selector list (comma-separated selectors) to add modifiers. Handles conflicts per-selector: if one selector in a list has a conflict, only that selector skips the modifier; other selectors still get it.
selector_group- CSS selector list (may contain commas)
stringoriginal_class- The base class name
stringnew_class_escaped- The escaped new class name
stringstates_to_add- Individual state modifiers (e.g., [":hover", ":focus"])
string[]pseudo_element_css- Pseudo-element modifier CSS to insert (e.g., "::before")
stringModifiedSelectorGroupResult Result with modified selector list and information about skipped modifiers
css_ruleset_parser.ts view source
(selector: string, original_class: string, new_class_escaped: string, state_css: string, pseudo_element_css: string): string Modifies a single CSS selector to add modifiers.
selector- A single CSS selector (not a selector list)
stringoriginal_class- The base class name (e.g., "menu_item")
stringnew_class_escaped- The escaped new class name (e.g., "hover\\:menu_item")
stringstate_css- State modifier CSS to insert (e.g., ":hover")
stringpseudo_element_css- Pseudo-element modifier CSS to insert (e.g., "::before")
stringstring Modified selector
RegExp Pattern for parameterized nth-child: nth-child(2n+1):
RegExp Pattern for parameterized nth-last-child: nth-last-child(2n+1):
RegExp Pattern for parameterized nth-last-of-type: nth-last-of-type(2n):
RegExp Pattern for parameterized nth-of-type: nth-of-type(2n):
example_class_utilities.ts view source
{ mt_xl2: string; mt_xl3: string; } Object - keys extracted as class names
StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly ["focus", "active"] "focus" | "active" (segment: string): string | null Parses an arbitrary breakpoint modifier.
segmentstringstring | null The CSS media query or null if not an arbitrary breakpoint
(class_name: string, css_properties: Set<string> | null): CssLiteralParseResult Parses a CSS-literal class name into its components.
class_name- The class name to parse
stringcss_properties- Set of valid CSS properties from load_css_properties().
Pass null to skip property validation.
Set<string> | nullCssLiteralParseResult CssLiteralParseResult with parsed data or error
(segment: string): { name: string; css: string; type: "state"; } | null Parses a parameterized state modifier (nth-child, nth-last-child, nth-of-type, nth-last-of-type).
segmentstring{ name: string; css: string; type: "state"; } | null Object with name (including parameter) and CSS, or null if not parameterized
css_ruleset_parser.ts view source
(css: string): ParsedRuleset Parses a CSS ruleset string using Svelte's CSS parser.
css- Raw CSS string (e.g., ".box { display: flex; }")
stringParsedRuleset ParsedRuleset with structured rule data and positions
ParsedCssLiteral Parsed CSS-literal class with all components extracted.
class_nameOriginal class name
stringmediaMedia modifier (breakpoint or feature query)
ModifierDefinition | nullancestorAncestor modifier (dark/light)
ModifierDefinition | nullstatesState modifiers in alphabetical order (can have multiple)
Array<ModifierDefinition>pseudo_elementPseudo-element modifier (before, after, etc.)
ModifierDefinition | nullpropertyCSS property name
stringvalueCSS value (with ~ replaced by spaces)
stringcss_ruleset_parser.ts view source
ParsedRule A parsed CSS rule with its components and positions.
selectorFull selector string (e.g., ".box", ".selectable:hover")
stringselector_startStart position of selector in original CSS (0-indexed, relative to style wrapper)
numberselector_endEnd position of selector in original CSS
numberdeclarationsThe declarations block (without braces)
stringrule_startStart position of the entire rule
numberrule_endEnd position of the entire rule
numbercss_ruleset_parser.ts view source
ParsedRuleset Result of parsing a CSS ruleset.
rulesAll rules in the ruleset
Array<ParsedRule>wrapper_offsetThe offset added by the <style> wrapper (characters before actual CSS)
numberMap<string, ModifierDefinition> Map of pseudo-element modifier names to their CSS output
(theme: Theme, options?: RenderThemeStyleOptions): string themeoptions{}string (variable: StyleVariable, dark?: boolean, comments?: boolean): string variabledarkbooleanfalsecommentsbooleantruestring RenderThemeStyleOptions commentsbooleanidstring | nullempty_default_themebooleanspecificityRepeats the theme selector to handle unpredictable head content insertion order. Accepts any integer >= 1, defaults to 2.
numbercss_class_resolution.ts view source
(def: CssClassDefinitionStatic, class_name: string, definitions: Record<string, CssClassDefinition | undefined>, css_properties?: Set<...> | null): ResolveComposesResult Resolves a class definition's declaration, handling composes composition.
If the definition has a composes property, resolves those classes recursively
and combines with any explicit declaration. If no composes, returns the
explicit declaration directly.
def- The class definition to resolve
class_name- The name of the class being resolved (for error messages)
stringdefinitions- Record of all known class definitions
Record<string, CssClassDefinition | undefined>css_properties- Set of valid CSS properties for literal validation, or null to skip
Set<string> | nullnullResolveComposesResult Combined declaration or an error
css_class_resolution.ts view source
(class_names: string[], definitions: Record<string, CssClassDefinition | undefined>, resolution_stack: Set<string>, visited: Set<string>, original_class_name: string, css_properties?: Set<...> | null): ResolveComposesResult Resolves an array of class names to their combined CSS declarations.
Recursively resolves nested composes arrays and combines all declarations.
Validates that referenced classes exist and are resolvable (not rulesets or interpreters).
Supports unmodified CSS literals (e.g., text-align:center) in the composes array.
Deduplication behavior: - Diamond dependencies (class reached via different composition branches) are silently skipped - Redundant listings (class already included by an earlier sibling in this array) emit a warning
class_names- Array of class names to resolve
string[]definitions- Record of all known class definitions
Record<string, CssClassDefinition | undefined>resolution_stack- Set of class names currently being resolved (for cycle detection)
Set<string>visited- Set of all class names already resolved (for deduplication)
Set<string>original_class_name- The class name being defined (for error messages)
stringcss_properties- Set of valid CSS properties for literal validation, or null to skip
Set<string> | nullnullResolveComposesResult Combined declarations or an error
css_class_resolution.ts view source
ResolveComposesResult Result from resolving a composes array to combined declarations.
css_ruleset_parser.ts view source
(rules: ParsedRule[], escaped_class_name: string): boolean Checks if any selector in the ruleset contains the expected class name. Used to validate that ruleset definitions match their key.
rules- Parsed rules from the ruleset
ParsedRule[]escaped_class_name- The CSS-escaped class name (e.g., "clickable" or "hover\\:card")
stringboolean True if at least one selector contains ".class_name"
(cache_path: string, content_hash: string, classes: Map<string, SourceLocation[]> | null, explicit_classes: Set<string> | null, diagnostics: ExtractionDiagnostic[] | null): Promise<...> Saves an extraction result to the cache. Uses atomic write (temp file + rename) for crash safety. Converts empty arrays to null to avoid allocation overhead on load.
cache_path- Absolute path to the cache file
stringcontent_hash- SHA-256 hash of the source file contents
stringclasses- Extracted classes with their locations, or null if none
Map<string, SourceLocation[]> | nullexplicit_classes- Classes from
Set<string> | nulldiagnostics- Extraction diagnostics, or null if none
ExtractionDiagnostic[] | nullPromise<void> StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly [1, 2, 3, 4, 5] StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly ["highlight", "glow", "shroud"] readonly ["xs", "sm", "md", "lg", "xl"] StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly ["shadow_", "shadow_top_", "shadow_bottom_", "shadow_inset_", "shadow_inset_top_", "shadow_inset_bottom_"] StyleVariable StyleVariable 4 | 3 | 1 | 2 | 5 "highlight" | "glow" | "shroud" "xs" | "sm" | "md" | "lg" | "xl" "xs" | "sm" | "md" | "lg" | "xl" | "xl2" | "xl3" | "xl4" | "xl5" | "xl6" | "xl7" | "xl8" | "xl9" css_ruleset_parser.ts view source
SkippedModifierInfo Information about a modifier that was skipped for a selector during ruleset modification. The selector is still included in output, just without the conflicting modifier applied.
selectorThe specific selector where the modifier was skipped (not the full selector list)
stringreasonReason the modifier was skipped
'pseudo_element_conflict' | 'state_conflict'conflicting_modifierThe conflicting modifier that was not applied (e.g., "::before" or ":hover")
stringcss_class_extractor.ts view source
Helper class for converting character offsets to line/column positions. Svelte template nodes (Comment, Text, ExpressionTag) only have char offsets, so this class enables efficient conversion.
Build: O(n) where n = source length Lookup: O(log m) where m = number of lines (binary search)
line_startstype Array<number>
constructortype new (source: string): SourceIndex
sourcestringget_locationConverts a character offset to a source location.
type (offset: number, file: string): SourceLocation
offset- 0-based character offset in the source
numberfile- File path for the location
stringSourceLocation with 1-based line and column
SourceLocation Source location for IDE/LSP integration.
filestringline1-based line number
numbercolumn1-based column number
numberStyleVariable StyleVariable StyleVariable readonly ["xs5", "xs4", "xs3", "xs2", "xs", "sm", "md", "lg", "xl", "xl2", "xl3", "xl4", "xl5", "xl6", "xl7", "xl8", "xl9", "xl10", "xl11", "xl12", "xl13", "xl14", "xl15"] StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable "xs" | "sm" | "md" | "lg" | "xl" | "xl2" | "xl3" | "xl4" | "xl5" | "xl6" | "xl7" | "xl8" | "xl9" | "xs5" | "xs4" | "xs3" | "xs2" | "xl10" | "xl11" | "xl12" | "xl13" | "xl14" | "xl15" css_ruleset_parser.ts view source
(selector_group: string): string[] Splits a selector list by commas, respecting parentheses, brackets, and quoted strings.
selector_groupstringstring[] Map<string, ModifierDefinition> Map of state modifier names to their CSS output
RegExp StyleVariable namelightstringdarkstringsummarystringStyleVariableName (typo: string, properties: Set<string> | null): string | null Suggests a correct property name for a typo using Levenshtein distance.
typo- The mistyped property name
stringproperties- Set of valid CSS properties from load_css_properties().
Pass null to skip suggestions.
Set<string> | nullstring | null The suggested property or null if no close match (Levenshtein distance > 2)
(typo: string): string | null Suggests a correct modifier name for a typo using Levenshtein distance.
typo- The mistyped modifier name
stringstring | null The suggested modifier or null if no close match (Levenshtein distance > 2)
example_class_utilities.ts view source
"mt_xs" | "mt_sm" Ternary expression - both branches extracted
StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable StyleVariable readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10] StyleVariable StyleVariable StyleVariable 0 | 4 | 3 | 1 | 2 | 5 | 6 | 7 | 8 | 9 | 10 Theme namestringvariablesArray<StyleVariable>StyleVariable StyleVariable (class_name: string, css_properties: Set<string> | null, context_class_name: string): LiteralResolutionResult Attempts to resolve a class name as an unmodified CSS literal for composition.
Used by resolve_composes to support literals in composes arrays.
Returns the declaration if successful, null if not a literal, or an error
if it's a literal with issues (modifiers, invalid property, etc.).
class_name- The class name to try resolving
stringcss_properties- Set of valid CSS properties, or null to skip validation
Set<string> | nullcontext_class_name- The class being defined (for error messages)
stringLiteralResolutionResult Resolution result with declaration, or error, or null if not a literal
vite_plugin_fuz_css.ts view source
(options?: VitePluginFuzCssOptions): Plugin$1<any> Creates the fuz_css Vite plugin.
Extracts CSS classes from source files during Vite's transform phase
and generates optimized CSS via the virtual:fuz.css virtual module.
options{}Plugin$1<any> vite_plugin_fuz_css.ts view source
VitePluginFuzCssOptions Options for the fuz_css Vite plugin.
filter_fileFilter function to determine which files to extract classes from. By default, extracts from .svelte, .html, .ts, .js, .tsx, .jsx files, excluding test files and .gen files.
class_definitionsAdditional class definitions to merge with defaults.
User definitions take precedence over defaults with the same name.
Required when include_default_definitions is false.
Record<string, CssClassDefinition | undefined>include_default_definitionsWhether to include default class definitions (token and composite classes).
When false, class_definitions is required.
booleanclass_interpretersCustom interpreters for dynamic class generation. Replaces the builtin interpreters entirely if provided.
Array<CssClassDefinitionInterpreter>include_classesClasses to always include in the output, regardless of detection.
Iterable<string>exclude_classesClasses to exclude from the output, even if detected.
Iterable<string>acorn_pluginsAdditional acorn plugins for parsing.
Use acorn-jsx for React/Preact/Solid projects.
Array<AcornPlugin>on_errorHow to handle CSS-literal errors during generation. - 'log': Log errors, skip invalid classes, continue - 'throw': Throw on first error, fail the build
'log' | 'throw'on_warningHow to handle warnings during generation. - 'log': Log warnings, continue - 'throw': Throw on first warning, fail the build - 'ignore': Suppress warnings entirely
'log' | 'throw' | 'ignore'cache_dirCache directory relative to project root.
string2147483647 Maximum value for CSS z-index property (32-bit signed integer max).