import type React from 'react';
import type { GradientConfig, NoiseConfig, OverlayConfig, TextureConfig, VignetteConfig } from './types.js';
/**
 * <cx-flavour> uses `position: absolute; inset: 0` — the parent container MUST have `position: relative` (or absolute/fixed/sticky) or the flavour will collapse to zero size.
 * All layers (gradient, noise, texture, overlay, vignette) are purely decorative (`aria-hidden="true"`, `pointer-events: none`).
 * Dark mode is handled automatically via CSS custom properties — textures invert, blend modes adapt, vignette softens, gloss dims.
 * Override dark mode adaptation via: `--cx-flavour-texture-invert` (0 or 1), `--cx-flavour-texture-blend` (multiply or soft-light), `--cx-flavour-vignette-opacity` (0–1), `--cx-flavour-gloss-start`/`--cx-flavour-gloss-mid` (rgba).
 * Presets: matte, aurora, gloss, grain, paper, linen, neon, blueprint, film — each pre-configures layers.
 * Custom layers override preset defaults: `<Flavour preset="aurora" noise={...} />` replaces Aurora's noise.
 * Animation (`animate` prop): subtle hue-rotate + layer pulse, respects `prefers-reduced-motion`. Control speed via `--cx-flavour-anim-duration` (default 8s).
 *
 * @csspart base
 */
export interface FlavourOwnProps {
    /**
     * Unique identifier for the element.
     * @example 'example-id'
     */
    id?: string;
    /**
     * Named preset configuration combining gradient, noise, and texture settings. Allowed values: `matte`, `aurora`, `gloss`, `grain`, `paper`, `linen`, `neon`, `blueprint`, `film`.
     * @example 'matte'
     */
    preset?: 'matte' | 'aurora' | 'gloss' | 'grain' | 'paper' | 'linen' | 'neon' | 'blueprint' | 'film';
    /**
     * Gradient layer configuration with kind, angle, and color stops.
     * @example { angle: 135, stops: [{ color: '#7c3aed', position: 0 }] }
     */
    gradient?: GradientConfig;
    /**
     * Noise layer configuration with frequency, octaves, seed, opacity, and blend mode.
     * @example { opacity: 0.12 }
     */
    noise?: NoiseConfig;
    /**
     * Texture layer configuration with kind, opacity, scale, and blend mode.
     * @example { kind: 'paper', opacity: 0.15 }
     */
    texture?: TextureConfig;
    /**
     * Overlay layer configuration with color, opacity, and blend mode.
     * @example { color: '#000000', opacity: 0.2 }
     */
    overlay?: OverlayConfig;
    /**
     * Vignette layer configuration with strength and radius.
     * @example { strength: 0.25, radius: 0.5 }
     */
    vignette?: VignetteConfig;
    /**
     * Overall opacity of the decorative layers (0–1).
     * @example 1
     */
    opacity?: number;
    /**
     * Border radius for the flavour container. Allowed values: `none`, `sm`, `md`, `lg`, `xl`, `2xl`, `full`.
     * @example 'none'
     */
    radius?: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
    /**
     * Enables animated hue-rotate gradient + pulse layers.
     * @defaultValue false
     * @example true
     */
    animate?: boolean;
    /** CSS class applied to the Custom Element host.
     * @example 'my-component'
     */
    className?: string;
    /** Inline styles applied to the Custom Element host.
     * @example { marginTop: 8 }
     */
    style?: React.CSSProperties;
}
/**
 * Props for `<Flavour>`: the component's own API plus every standard DOM
 * attribute and native React event handler, forwarded verbatim to the
 * `<cx-flavour>` host — `id`, `data-*`, `aria-*`, `title`, `tabIndex`,
 * `slot`, `onMouseEnter`, and the rest. Own props always win over a
 * same-named DOM attribute.
 */
export type FlavourProps = FlavourOwnProps & Omit<React.HTMLAttributes<HTMLElement>, keyof FlavourOwnProps | 'children' | 'dangerouslySetInnerHTML'>;
export declare const Flavour: React.ForwardRefExoticComponent<FlavourOwnProps & Omit<React.HTMLAttributes<HTMLElement>, "children" | "dangerouslySetInnerHTML" | keyof FlavourOwnProps> & React.RefAttributes<HTMLElement>>;