import { Declaration, TokenOrValue } from "lightningcss"; //#region packages/core/types.d.ts type HandlerResult = string | string[] | Declaration | Declaration[] | TokenOrValue | TokenOrValue[]; /** Info about a single directive argument or computed variable. */ interface ArgInfo { /** Raw string from CSS before var() resolution. */ original: string; /** String after var() resolution and validation. */ parsed: string; /** Compiled CSS var() reference for use in value(). */ var: string; } /** Unified context passed to directive value() handlers. */ type DirectiveContext = Record; type Handler = { (args: TokenOrValue[] | null, ctx?: DirectiveContext): HandlerResult; /** When set, generates root-level CSS (e.g. @keyframes, @font-face). */ spawn?: () => string; }; //#endregion //#region packages/core/utils/defineHelper.d.ts interface Directive extends Handler { /** Raw string-level function for composition. Builds a minimal context and returns the value. */ value: (args: string[]) => string | string[]; /** Optional function that returns a map of computed variable names to raw CSS values. */ vars?: (args: string[]) => Record; /** When set, generates root-level CSS. */ spawn?: () => string; /** Builds a DirectiveContext for AST-level processing. */ buildContext: (originalArgs: string[], parsedArgs: string[], namePrefix: string | null, pushDecl?: (decl: string) => void) => DirectiveContext; } //#endregion //#region packages/helpers/background/verticalLines.d.ts /** * Vertical lines background pattern. * * @example * verticalLines('20px') */ declare const verticalLines: Directive; //#endregion //#region packages/helpers/background/horizontalLines.d.ts /** * Horizontal lines background pattern. * * @example * horizontalLines('20px') */ declare const horizontalLines: Directive; //#endregion //#region packages/helpers/background/grid.d.ts /** * Grid background pattern. * * @example * grid('20px') */ declare const grid: Directive; //#endregion //#region packages/helpers/background/dotPattern.d.ts /** * Dot pattern background. * * @example * dotPattern('20px') */ declare const dotPattern: Directive; //#endregion //#region packages/helpers/background/checkerboard.d.ts /** * Checkerboard background pattern. * * @example * checkerboard('20px') */ declare const checkerboard: Directive; //#endregion //#region packages/helpers/background/paper.d.ts /** * Blueprint/graph paper background. * * @example * paper('30px') */ declare const paper: Directive; //#endregion //#region packages/helpers/border/perfectBorder.d.ts /** * Inner or outer border-radius accounting for border thickness. * * @example * perfectBorder('outer', '1rem', '0.25rem') */ declare const perfectBorder: Directive; //#endregion //#region packages/helpers/colors/mix.d.ts /** * Mix two colors in OKLab space. * * @example * mix('red', 'blue', '50%') */ declare const mix: Directive; //#endregion //#region packages/helpers/colors/lighten.d.ts /** * Lighten a color. * * @example * lighten('#333', '20%') */ declare const lighten: Directive; //#endregion //#region packages/helpers/colors/darken.d.ts /** * Darken a color. * * @example * darken('#fff', '10%') */ declare const darken: Directive; //#endregion //#region packages/helpers/colors/opacity.d.ts /** * Set or override a color's opacity. * * @example * opacity('red', '50%') */ declare const opacity: Directive; //#endregion //#region packages/helpers/colors/complement.d.ts /** * Complementary (opposite) color. * * @example * complement('red') */ declare const complement: Directive; //#endregion //#region packages/helpers/colors/black.d.ts /** * Return black with optional opacity. * * @example * black() * black(0.5) */ declare const black: Directive; //#endregion //#region packages/helpers/colors/white.d.ts /** * Return white with optional opacity. * * @example * white() * white(0.5) */ declare const white: Directive; //#endregion //#region packages/helpers/colors/tint.d.ts /** * Tint a color by mixing with white. * * @example * tint('#333', '20%') */ declare const tint: Directive; //#endregion //#region packages/helpers/colors/shade.d.ts /** * Shade a color toward black. * * @example * shade('#ff0000', '30%') */ declare const shade: Directive; //#endregion //#region packages/helpers/colors/saturate.d.ts /** * Increase or decrease color saturation. * * @example * saturate('red', '20%') */ declare const saturate: Directive; //#endregion //#region packages/helpers/colors/grayscale.d.ts /** * Remove all color to produce grayscale. * * @example * grayscale('#ff0000') */ declare const grayscale: Directive; //#endregion //#region packages/helpers/layouts/autoGrid.d.ts /** * Responsive grid columns using auto-fit and minmax. * * @example * autoGrid('200px', 3) */ declare const autoGrid: Directive; //#endregion //#region packages/helpers/math/negate.d.ts /** * Negate a value (multiply by -1). * * @example * negate('1rem') */ declare const negate: Directive; //#endregion //#region packages/helpers/math/lerp.d.ts /** * Linear interpolation between two values. * * @example * lerp('0px', '100px', '0.5') */ declare const lerp: Directive; //#endregion //#region packages/helpers/math/ratio.d.ts /** * Ratio of two values. * * @example * ratio('100px', '200px') */ declare const ratio: Directive; //#endregion //#region packages/helpers/transforms/pxToRem.d.ts /** * Convert pixels to rem. * * @example * pxToRem('16px') */ declare const pxToRem: Directive; //#endregion //#region packages/helpers/transforms/remToPx.d.ts /** * Convert rem to pixels. * * @example * remToPx('1rem') */ declare const remToPx: Directive; //#endregion //#region packages/helpers/transforms/toOklch.d.ts /** * Convert to OKLCH color space. * * @example * toOklch('#ff0000') */ declare const toOklch: Directive; //#endregion //#region packages/helpers/transforms/toOklab.d.ts /** * Convert to OKLAB color space. * * @example * toOklab('#ff0000') */ declare const toOklab: Directive; //#endregion //#region packages/helpers/transforms/toRgb.d.ts /** * Convert to sRGB color space. * * @example * toRgb('#ff0000') */ declare const toRgb: Directive; //#endregion //#region packages/helpers/transforms/toHsl.d.ts /** * Convert to HSL color space. * * @example * toHsl('#ff0000') */ declare const toHsl: Directive; //#endregion //#region packages/helpers/transforms/toHwb.d.ts /** * Convert to HWB color space. * * @example * toHwb('#ff0000') */ declare const toHwb: Directive; //#endregion //#region packages/helpers/types/colors.d.ts declare const CSS_COLOR_FUNCTIONS: { readonly rgb: "rgb"; readonly rgba: "rgba"; readonly hsl: "hsl"; readonly hsla: "hsla"; readonly hwb: "hwb"; readonly lab: "lab"; readonly lch: "lch"; readonly oklab: "oklab"; readonly oklch: "oklch"; readonly color: "color"; }; type CssColorFunction = (typeof CSS_COLOR_FUNCTIONS)[keyof typeof CSS_COLOR_FUNCTIONS]; type RGB = `rgb(${number} ${number} ${number})` | `rgb(${number}, ${number}, ${number})`; type RGBA = `rgba(${number} ${number} ${number} / ${number})` | `rgba(${number}, ${number}, ${number}, ${number})`; type HEX = `#${string}`; type HSL = `hsl(${number} ${number}% ${number}%)` | `hsl(${number}, ${number}%, ${number}%)`; type HSLA = `hsla(${number} ${number}% ${number}% / ${number})` | `hsla(${number}, ${number}%, ${number}%, ${number})`; type OKLAB = `oklab(${number}% ${number} ${number})`; type OKLCH = `oklch(${number}% ${number} ${number})`; type CSSVar = `var(--${T})`; type Color = RGB | RGBA | HEX | HSL | HSLA | OKLAB | OKLCH | CSSVar | string; //#endregion //#region packages/helpers/types/units.d.ts declare const CSS_LENGTH_UNITS: { readonly px: "px"; readonly rem: "rem"; readonly em: "em"; readonly '%': "%"; readonly vw: "vw"; readonly vh: "vh"; readonly vmin: "vmin"; readonly vmax: "vmax"; readonly ex: "ex"; readonly ch: "ch"; readonly cm: "cm"; readonly mm: "mm"; readonly in: "in"; readonly pt: "pt"; readonly pc: "pc"; readonly cap: "cap"; readonly ic: "ic"; readonly lh: "lh"; readonly rlh: "rlh"; }; type CssLengthUnit = (typeof CSS_LENGTH_UNITS)[keyof typeof CSS_LENGTH_UNITS]; type CssLength = `${number}${CssLengthUnit}`; declare const CSS_ANGLE_UNITS: { readonly deg: "deg"; readonly rad: "rad"; readonly grad: "grad"; readonly turn: "turn"; }; type CssAngleUnit = (typeof CSS_ANGLE_UNITS)[keyof typeof CSS_ANGLE_UNITS]; type CssAngle = `${number}${CssAngleUnit}`; declare const CSS_TIME_UNITS: { readonly s: "s"; readonly ms: "ms"; }; type CssTimeUnit = (typeof CSS_TIME_UNITS)[keyof typeof CSS_TIME_UNITS]; type CssTime = `${number}${CssTimeUnit}`; declare const CSS_RESOLUTION_UNITS: { readonly dpi: "dpi"; readonly dpcm: "dpcm"; readonly dppx: "dppx"; }; type CssResolutionUnit = (typeof CSS_RESOLUTION_UNITS)[keyof typeof CSS_RESOLUTION_UNITS]; type CssResolution = `${number}${CssResolutionUnit}`; declare const CSS_FREQUENCY_UNITS: { readonly Hz: "Hz"; readonly kHz: "kHz"; }; type CssFrequencyUnit = (typeof CSS_FREQUENCY_UNITS)[keyof typeof CSS_FREQUENCY_UNITS]; type CssFrequency = `${number}${CssFrequencyUnit}`; type NumericValue = `${number}`; //#endregion export { type CSSVar, type CSS_ANGLE_UNITS, type CSS_COLOR_FUNCTIONS, type CSS_FREQUENCY_UNITS, type CSS_LENGTH_UNITS, type CSS_RESOLUTION_UNITS, type CSS_TIME_UNITS, type Color, type CssAngle, type CssAngleUnit, type CssColorFunction, type CssFrequency, type CssFrequencyUnit, type CssLength, type CssLengthUnit, type CssResolution, type CssResolutionUnit, type CssTime, type CssTimeUnit, type HEX, type HSL, type HSLA, type NumericValue, type OKLAB, type OKLCH, type RGB, type RGBA, autoGrid, black, checkerboard, complement, darken, dotPattern, grayscale, grid, horizontalLines, lerp, lighten, mix, negate, opacity, paper, perfectBorder, pxToRem, ratio, remToPx, saturate, shade, tint, toHsl, toHwb, toOklab, toOklch, toRgb, verticalLines, white };