/** * CSS variable extraction and parsing utilities * Extracts variables from `@theme`, :root, and variant selectors */ import type { Root } from 'postcss'; import type { CSSVariable, DeprecationWarning } from '../../types'; import type { CSSRuleOverride } from '../extraction/rules'; /** * Extracts variant name from CSS selector * * Patterns supported: * - [data-theme='dark'] → 'dark' * - [data-theme="blue"] → 'blue' * - [data-slot='select-trigger'] → 'select-trigger' * - .midnight → 'midnight' * - .dark → 'dark' * - `@media` (prefers-color-scheme: dark) → 'dark' * - [data-theme='compact'].dark → 'compact.dark' (compound selectors for same element) * - .theme-default .theme-container → 'theme-default' (descendant selectors - only first) * * @param selector - The CSS selector to extract variant name from * @returns The variant name or null if not a recognized pattern */ export declare function extractVariantName(selector: string): string | null; /** * Extracts CSS variables, keyframes, and CSS rules from a PostCSS AST * * Supports: * - Base theme: `@theme` and :root * - Variants: any selector with CSS variables (e.g., [data-theme='dark'], .midnight) * - Keyframes: `@keyframes` rules * - Nested @variant blocks: creates compound variants with recursive support * (e.g., .theme-mono @variant dark @variant hover → theme-mono.dark.hover) * - CSS Rules: Direct style rules within variants (e.g., .rounded-lg { border-radius: 0; }) * * @param root - The PostCSS root node to extract variables from * @returns Object with extracted CSS variables, keyframes, and CSS rules */ export declare function extractVariables(root: Root): { variables: Array; keyframes: Map; cssRules: Array; }; /** * Parses a CSS variable name and extracts the namespace and key * * Examples: * - --color-red-500 → { namespace: 'color', key: 'red-500' } * - --spacing-4 → { namespace: 'spacing', key: '4' } * - --font-sans → { namespace: 'font', key: 'sans' } * - --spacing → { namespace: 'spacing', key: 'base' } (singular variable) * - --blur → { namespace: 'blur', key: 'default' } (singular variable) * * @param variableName - The CSS variable name (including the -- prefix) * @returns Object containing the namespace, key, and optional deprecation warning */ export declare function parseVariableName(variableName: string): { namespace: string; key: string; deprecationWarning?: DeprecationWarning; } | null; /** * Converts kebab-case to camelCase with memoization for performance * * This function is called frequently during theme building (for every color key, * font size, etc.), so results are cached to avoid redundant regex operations. * * @param str - The kebab-case string to convert * @returns The camelCase version * * @example * kebabToCamelCase('tooltip-outline') // 'tooltipOutline' * kebabToCamelCase('my-custom-color') // 'myCustomColor' */ export declare function kebabToCamelCase(str: string): string; /** * Converts variant names with dots and kebab-case to camelCase * * Handles compound variant names (e.g., "theme-mono.dark" → "themeMonoDark") * by converting each segment to camelCase and joining them together. * * @param variantName - The variant name to convert (may contain dots) * @returns The camelCase version * * @example * variantNameToCamelCase('theme-mono') // 'themeMono' * variantNameToCamelCase('theme-mono.dark') // 'themeMonoDark' * variantNameToCamelCase('theme-rounded-none.dark.hover') // 'themeRoundedNoneDarkHover' */ export declare function variantNameToCamelCase(variantName: string): string; /** * Parses a CSS variable key into nested path parts with configurable nesting behavior * * This function enables configurable nesting depth and dash handling: * - No dashes: null (flat key, e.g., "primary" → colors.primary) * - One dash: ["red", "500"] → colors.red[500] * - Two dashes: ["tooltip", "outline", "50"] → colors.tooltip.outline[50] * - Multiple dashes: ["a", "b", "c", "d"] → colors.a.b.c.d * * With maxDepth configuration (controls nesting levels in result structure): * - maxDepth: 0 → 0 nesting levels = completely flat * - "a-b-c-d" → ["aBC D"] (all parts flattened to one key) * - maxDepth: 1 → 1 nesting level = one object with final key * - "a-b-c-d" → ["a", "bCD"] (first part as object, rest flattened) * - maxDepth: 2 → 2 nesting levels = two nested objects with final key * - "a-b-c-d" → ["a", "b", "cD"] (two parts as nested objects, rest flattened) * - maxDepth: Infinity → unlimited nesting (default) * - "a-b-c-d" → ["a", "b", "c", "d"] (every dash creates a level) * * With flattenMode (controls how parts after maxDepth are flattened): * - flattenMode: 'camelcase' (default) → flattens to camelCase * - maxDepth: 2, "a-b-c-d" → ["a", "b", "cD"] * - flattenMode: 'literal' → flattens to kebab-case string * - maxDepth: 2, "a-b-c-d" → ["a", "b", "c-d"] * * Multiple consecutive dashes behavior (configurable): * - consecutiveDashes: 'exclude' → "button--primary" → null (excluded from theme) * - consecutiveDashes: 'nest' → "button--primary" → ["button", "primary"] (-- as -) * - consecutiveDashes: 'camelcase' → "button--primary" → ["buttonPrimary"] (camelCase) * - consecutiveDashes: 'literal' → "button--primary" → ["button-", "primary"] (dash preserved) * * @param key - The variable key to parse * @param config - Optional nesting configuration * @param config.maxDepth - Maximum nesting depth in result structure (default: Infinity) * @param config.consecutiveDashes - How to handle consecutive dashes (default: 'exclude') * @param config.flattenMode - How to flatten remaining parts after maxDepth (default: 'camelcase') * @returns Object with array of path parts (in camelCase), or null if excluded/flat * * @example * parseNestedKey('primary') // null (flat key) * parseNestedKey('red-500') // { parts: ['red', '500'] } * parseNestedKey('tooltip-outline-50') // { parts: ['tooltip', 'outline', '50'] } * parseNestedKey('blue-50', { maxDepth: 1 }) // { parts: ['blue', '50'] } * parseNestedKey('tooltip-outline-50', { maxDepth: 2 }) // { parts: ['tooltip', 'outline', '50'] } * parseNestedKey('a-b-c-d', { maxDepth: 2 }) // { parts: ['a', 'b', 'cD'] } * parseNestedKey('a-b-c-d', { maxDepth: 2, flattenMode: 'literal' }) // { parts: ['a', 'b', 'c-d'] } * parseNestedKey('button--primary', { consecutiveDashes: 'exclude' }) // null (excluded) * parseNestedKey('button--primary', { consecutiveDashes: 'nest' }) // { parts: ['button', 'primary'] } * parseNestedKey('button--primary', { consecutiveDashes: 'camelcase' }) // { parts: ['buttonPrimary'] } * parseNestedKey('button--primary', { consecutiveDashes: 'literal' }) // { parts: ['button-', 'primary'] } */ export declare function parseNestedKey(key: string, config?: { maxDepth?: number; consecutiveDashes?: 'exclude' | 'nest' | 'camelcase' | 'literal'; flattenMode?: 'camelcase' | 'literal'; }): { parts: Array; } | null; /** * Parses a color key into nested path parts for multi-level nesting * * This function is a backward-compatible wrapper around parseNestedKey * that maintains the original behavior (unlimited depth, literal dashes). * * @param key - The variable key to check * @returns Object with array of path parts (in camelCase), or null if no nesting * @deprecated Use parseNestedKey with explicit config instead * * @example * parseColorScale('primary') // null (flat color) * parseColorScale('red-500') // { parts: ['red', '500'] } * parseColorScale('tooltip-outline-50') // { parts: ['tooltip', 'outline', '50'] } * parseColorScale('tooltip--outline-50') // { parts: ['tooltip-', 'outline', '50'] } */ export declare function parseColorScale(key: string): { parts: Array; } | null; /** * Checks if a key represents a font size with line height modifier * * @param key - The variable key to check * @returns Base font size key if it's a line height variant, null otherwise */ export declare function parseFontSizeLineHeight(key: string): string | null;