import { type TextStyle, type ViewStyle } from "react-native";
import { type SwatchSize } from "./swatch.shared.js";
export interface SwatchSkin {
    /** Block edge per size, in px (the block's HEIGHT when `block` stretches its width). */
    box: Record<SwatchSize, number>;
    /** Corner radius of the block per size, in px (ignored when `circle` is set). */
    radius: Record<SwatchSize, number>;
    /** Extra shape refinement on the block (iOS: the continuous superellipse corner curve). */
    shape: ViewStyle;
    /** Gap between the block and its label column (the label under the block). */
    gap: number;
    /** Gap between the block and its label column when `inline` puts the label beside it. */
    inlineGap: number;
    /** Gap between the label column's lines (a tight name/value/detail lockup). */
    lineGap: number;
    /** The name line's type; color comes from the shell. */
    name: TextStyle;
    /** The primary mono value line's type; family and color come from the shell. */
    value: TextStyle;
    /** The secondary mono detail line's type; family and color come from the shell. */
    detail: TextStyle;
    /** The `centered` lockup's gap: the label column centred under the chip, 10 px below it. */
    centeredGap: number;
    /** The `glow` shadow, the fill's own ambient light under the chip at `alpha` of the fill. */
    glow: {
        offsetY: number;
        blur: number;
        spread: number;
        alpha: number;
    };
    /**
     * The `tile`: the labelled colour tile, its name inside the fill. Its height per size (a
     * bottom-aligned name at the default, a centred one `small`), its inset and its name type.
     */
    tile: {
        height: {
            default: number;
            small: number;
        };
        inset: number;
        name: TextStyle;
    };
    /** The `bar`: the parent's width at this height and corner, its edge the hairline. */
    bar: {
        height: number;
        radius: number;
    };
    /**
     * `steps`: one bar of colour steps. Flush, the bar is clipped at `flushRadius` at the size's
     * height; `segmented`, the steps stand `segmentGap` apart in a `segmentedHeight` bar, each at
     * the `innerRadius` corner but for the bar's two outer ends at `endRadius`.
     */
    steps: {
        flushRadius: number;
        segmentedHeight: number;
        segmentGap: number;
        innerRadius: number;
        endRadius: number;
    };
    /** The `compact` lockup: the stretched chip's height, the mono name and value, their gaps. */
    compact: {
        box: number;
        gap: number;
        lineGap: number;
        name: TextStyle;
        value: TextStyle;
    };
    /** The palette picker's disc edge, in px. */
    picker: number;
    /**
     * The palette picker's hover growth: the disc scales by `scale` over `duration` ms on
     * `easing`. Web only (null on native, where the kit declares no pointer hover yet).
     */
    pickerHover: {
        scale: number;
        duration: number;
        easing: string;
    } | null;
}
export declare const webSkin: SwatchSkin;
export declare const iosSkin: SwatchSkin;
export declare const androidSkin: SwatchSkin;
//# sourceMappingURL=swatch.styles.d.ts.map