import React from 'react';

/**
 * Supported visual weights for the Dirham symbol SVG component.
 *
 * Because the Dirham symbol is not yet in standard fonts (until Unicode 18.0),
 * weight simulation is applied via SVG stroke to match surrounding text weight,
 * similar to how $, €, £ adapt to their font's weight.
 */
type DirhamWeight = "thin" | "extralight" | "light" | "regular" | "medium" | "semibold" | "bold" | "extrabold" | "black";

interface DirhamSymbolProps extends Omit<React.SVGProps<SVGSVGElement>, "children"> {
    /**
     * Size of the symbol in pixels. Sets both width and height.
     * @default 24
     */
    size?: number | string;
    /**
     * Color of the symbol. Uses `currentColor` by default to inherit text color.
     * @default "currentColor"
     */
    color?: string;
    /**
     * Accessible label for screen readers.
     * @default "UAE Dirham"
     */
    "aria-label"?: string;
    /**
     * Visual weight of the symbol. Simulates font-weight via SVG stroke
     * so the symbol matches surrounding text weight.
     *
     * @example
     * ```tsx
     * <h1 style={{ fontWeight: 700 }}>
     *   Price: 100 <DirhamSymbol size="1em" weight="bold" />
     * </h1>
     * ```
     *
     * @default "regular"
     */
    weight?: DirhamWeight;
}
declare const DirhamSymbol: React.NamedExoticComponent<Omit<DirhamSymbolProps, "ref"> & React.RefAttributes<SVGSVGElement>>;

interface DirhamIconProps extends Omit<React.HTMLProps<HTMLElement>, "children" | "size"> {
    /**
     * Font size of the icon. Applied as the CSS `font-size` property.
     * @default "inherit"
     */
    size?: number | string;
    /**
     * Color of the icon. Applied as the CSS `color` property.
     * @default "currentColor"
     */
    color?: string;
    /**
     * Accessible label for screen readers.
     * @default "UAE Dirham"
     */
    "aria-label"?: string;
    /**
     * HTML tag to render.
     * @default "i"
     */
    as?: "i" | "span";
}
declare const DirhamIcon: React.NamedExoticComponent<Omit<DirhamIconProps, "ref"> & React.RefAttributes<HTMLElement>>;

interface DirhamPriceProps extends Omit<React.HTMLProps<HTMLSpanElement>, "children"> {
    /**
     * Numeric amount to display.
     */
    amount: number;
    /**
     * Locale string for number formatting.
     * @default "en-AE"
     */
    locale?: string;
    /**
     * Number of decimal places.
     * @default 2
     */
    decimals?: number;
    /**
     * Use ISO currency code (AED) instead of the symbol.
     * @default false
     */
    useCode?: boolean;
    /**
     * Number notation style.
     * @default "standard"
     */
    notation?: "standard" | "compact";
    /**
     * Size of the Dirham symbol when using SVG variant.
     * @default "1em"
     */
    symbolSize?: number | string;
    /**
     * Visual weight of the SVG symbol.
     * @default "regular"
     */
    weight?: DirhamWeight;
    /**
     * Accessible label for the currency symbol.
     * @default "UAE Dirham"
     */
    "aria-label"?: string;
    /**
     * Additional CSS class name(s) to apply to the root `<span>` element.
     * Useful for custom styling via Tailwind, CSS modules, etc.
     *
     * @example
     * ```tsx
     * <DirhamPrice amount={100} className="text-green-500 font-bold" />
     * ```
     */
    className?: string;
}
declare const DirhamPrice: React.NamedExoticComponent<Omit<DirhamPriceProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

interface DirhamInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "onChange" | "type"> {
    /**
     * Controlled numeric value.
     */
    value?: number;
    /**
     * Default numeric value (uncontrolled mode).
     */
    defaultValue?: number;
    /**
     * Called when the numeric value changes.
     * Receives the parsed number, or `undefined` when the input is cleared.
     */
    onChange?: (value: number | undefined) => void;
    /**
     * Locale for number formatting.
     * @default "en-AE"
     */
    locale?: string;
    /**
     * Maximum decimal places allowed.
     * @default 2
     */
    decimals?: number;
    /**
     * Minimum allowed value.
     */
    min?: number;
    /**
     * Maximum allowed value.
     */
    max?: number;
    /**
     * Whether to show the Dirham symbol inside the input.
     * @default true
     */
    showSymbol?: boolean;
    /**
     * Use ISO code "AED" instead of the symbol.
     * @default false
     */
    useCode?: boolean;
    /**
     * Size of the Dirham symbol.
     * @default "1em"
     */
    symbolSize?: number | string;
    /**
     * Weight of the Dirham symbol.
     * @default "regular"
     */
    weight?: DirhamWeight;
    /**
     * Accessible label for the input.
     * @default "Amount in AED"
     */
    "aria-label"?: string;
    /**
     * Additional CSS class name(s) for the wrapper element.
     */
    className?: string;
    /**
     * Additional inline styles for the wrapper element.
     */
    style?: React.CSSProperties;
    /**
     * Additional CSS class name(s) for the `<input>` element.
     */
    inputClassName?: string;
    /**
     * Additional inline styles for the `<input>` element.
     */
    inputStyle?: React.CSSProperties;
    /**
     * Called on blur after value is clamped/formatted.
     */
    onBlur?: React.FocusEventHandler<HTMLInputElement>;
    /**
     * Called on focus.
     */
    onFocus?: React.FocusEventHandler<HTMLInputElement>;
    /**
     * Select all text on focus.
     * @default true
     */
    selectOnFocus?: boolean;
}
declare const DirhamInput: React.NamedExoticComponent<DirhamInputProps & React.RefAttributes<HTMLInputElement>>;

interface AnimatedDirhamPriceProps extends Omit<React.HTMLProps<HTMLSpanElement>, "children"> {
    /**
     * Target numeric amount to animate to.
     */
    amount: number;
    /**
     * Animation duration in milliseconds.
     * @default 600
     */
    duration?: number;
    /**
     * Easing function.
     * @default "easeOut"
     */
    easing?: "linear" | "easeIn" | "easeOut" | "easeInOut";
    /**
     * Locale for number formatting.
     * @default "en-AE"
     */
    locale?: string;
    /**
     * Number of decimal places.
     * @default 2
     */
    decimals?: number;
    /**
     * Use ISO code "AED" instead of the symbol.
     * @default false
     */
    useCode?: boolean;
    /**
     * Number notation style.
     * @default "standard"
     */
    notation?: "standard" | "compact";
    /**
     * Size of the Dirham symbol.
     * @default "1em"
     */
    symbolSize?: number | string;
    /**
     * Weight of the Dirham symbol.
     * @default "regular"
     */
    weight?: DirhamWeight;
    /**
     * Accessible label.
     * @default "UAE Dirham"
     */
    "aria-label"?: string;
    /**
     * CSS class name(s).
     */
    className?: string;
}
declare const AnimatedDirhamPrice: React.NamedExoticComponent<Omit<AnimatedDirhamPriceProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

interface UseDirhamRateResult {
    /** The exchange rate (AED → target currency). `undefined` while loading. */
    rate: number | undefined;
    /** Whether rates are currently being fetched. */
    loading: boolean;
    /** Error message if the fetch failed. */
    error: string | undefined;
    /** Re-fetch the exchange rates (clears cache). */
    refetch: () => void;
    /** Convert an AED amount to the target currency using the fetched rate. */
    convert: (amount: number) => number | undefined;
    /** Convert from the target currency back to AED using the fetched rate. */
    convertBack: (amount: number) => number | undefined;
}
/**
 * React hook that fetches and caches the AED exchange rate for a given currency.
 *
 * @example
 * ```tsx
 * import { useDirhamRate } from "dirham/react";
 *
 * function PriceConverter() {
 *   const { rate, loading, convert } = useDirhamRate("USD");
 *
 *   if (loading) return <span>Loading...</span>;
 *   return <span>100 AED = {convert(100)} USD</span>;
 * }
 * ```
 */
declare function useDirhamRate(currency: string): UseDirhamRateResult;

export { AnimatedDirhamPrice, type AnimatedDirhamPriceProps, DirhamIcon, type DirhamIconProps, DirhamInput, type DirhamInputProps, DirhamPrice, type DirhamPriceProps, DirhamSymbol, type DirhamSymbolProps, type UseDirhamRateResult, useDirhamRate };