import { type FC, type ReactNode } from 'react';
/**
 * Font configuration options (matches Next.js API)
 */
export interface FontOptions {
    /**
     * The font family name
     */
    fontFamily: string;
    /**
     * Font display strategy
     * @default 'swap'
     */
    display?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';
    /**
     * Font weight(s)
     */
    weight?: string | string[];
    /**
     * Font style
     */
    style?: string | string[];
    /**
     * Font source URLs for different formats
     */
    src?: {
        woff2?: string;
        woff?: string;
        ttf?: string;
        eot?: string;
    };
    /**
     * Preload the font
     * @default true
     */
    preload?: boolean;
    /**
     * Fallback font family
     */
    fallback?: string[];
    /**
     * Variable font name for CSS variables (if using variable fonts)
     */
    variable?: string;
    /**
     * Next.js compatibility - adjust font feature settings
     */
    fontFeatureSettings?: string;
    /**
     * Next.js compatibility - optimize font loading
     */
    preloadOnly?: boolean;
    /**
     * Next.js compatibility - subset of the font
     */
    subsets?: string[];
    /**
     * Next.js compatibility - font axes for variable fonts
     */
    axes?: string[];
    /**
     * Next.js compatibility - adjusts font features
     */
    adjustFontFallback?: boolean | 'Arial' | 'Times New Roman';
}
/**
 * Font component props
 */
export interface FontProps {
    /**
     * Font options or an array of font options for multiple font families
     */
    options: FontOptions | FontOptions[];
    /**
     * Optional children to render after fonts are loaded
     */
    children?: ReactNode;
    /**
     * Override the default implementation for the <style> tag
     * Only use this if you need to customize how the styles are inserted
     */
    styleTagRenderer?: (css: string) => ReactNode;
}
/**
 * Font component for loading and managing web fonts.
 * API compatible with Next.js Font API but implemented for client-side.
 *
 * @example
 * ```tsx
 * // Single font
 * <Font
 *   options={{
 *     fontFamily: 'Open Sans',
 *     weight: ['400', '700'],
 *     src: {
 *       woff2: '/fonts/open-sans.woff2'
 *     },
 *     variable: 'font-open-sans',
 *     fallback: ['system-ui', 'sans-serif']
 *   }}
 * />
 *
 * // Multiple fonts
 * <Font
 *   options={[
 *     {
 *       fontFamily: 'Open Sans',
 *       weight: '400',
 *       src: { woff2: '/fonts/open-sans-regular.woff2' }
 *     },
 *     {
 *       fontFamily: 'Open Sans',
 *       weight: '700',
 *       src: { woff2: '/fonts/open-sans-bold.woff2' }
 *     }
 *   ]}
 * />
 * ```
 */
export declare const Font: FC<FontProps>;
/**
 * Similar to Next.js Font API, creates an object that can be imported and used
 * as a className to apply a font. This is for API compatibility.
 *
 * @param fontOptions Font configuration options
 * @returns An object with className and variable properties
 *
 * @example
 * ```tsx
 * // In a font definition file
 * import { createLocalFont } from '@databuddy/nextless';
 *
 * export const openSans = createLocalFont({
 *   fontFamily: 'Open Sans',
 *   src: { woff2: '/fonts/open-sans.woff2' },
 *   variable: 'font-open-sans'
 * });
 *
 * // In a component
 * import { openSans } from '@/fonts';
 *
 * export default function MyComponent() {
 *   return (
 *     <div className={openSans.className}>
 *       This text uses Open Sans
 *     </div>
 *   );
 * }
 * ```
 */
export declare const createLocalFont: (fontOptions: FontOptions) => {
    className: string;
    style: {
        fontFamily: string;
    };
    variable: string | undefined;
};
export default Font;