import { LitElement } from 'lit';
/**
 * Spacer component for adding flexible spacing
 *
 * @slot - Optional content
 *
 * @cssprop --spacer-size - Custom spacer size
 *
 * @example
 * ```html
 * <ui-spacer size="lg"></ui-spacer>
 * <ui-spacer size="xl" axis="x"></ui-spacer>
 * ```
 */
export declare class UISpacer extends LitElement {
    static styles: import("lit").CSSResult;
    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
    axis: 'x' | 'y';
    flex: boolean;
    render(): import("lit-html").TemplateResult<1>;
}
/**
 * Box component for applying padding/margin utilities
 *
 * @slot - Content
 *
 * @cssprop --box-padding - Custom padding
 * @cssprop --box-margin - Custom margin
 *
 * @example
 * ```html
 * <ui-box p="lg" m="md">Content with padding and margin</ui-box>
 * <ui-box px="xl" py="sm">Asymmetric padding</ui-box>
 * ```
 */
export declare class UIBox extends LitElement {
    static styles: import("lit").CSSResult;
    p?: string;
    px?: string;
    py?: string;
    pt?: string;
    pr?: string;
    pb?: string;
    pl?: string;
    m?: string;
    mx?: string;
    my?: string;
    mt?: string;
    mr?: string;
    mb?: string;
    ml?: string;
    w?: string;
    h?: string;
    maxW?: string;
    rounded?: string;
    shadow?: string;
    inline: boolean;
    render(): import("lit-html").TemplateResult<1>;
}
/**
 * Center component for centering content
 *
 * @slot - Content to center
 *
 * @example
 * ```html
 * <ui-center>Horizontally and vertically centered</ui-center>
 * <ui-center axis="x">Only horizontally centered</ui-center>
 * ```
 */
export declare class UICenter extends LitElement {
    static styles: import("lit").CSSResult;
    axis: 'x' | 'y' | 'both';
    inline: boolean;
    maxW?: string;
    render(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'ui-spacer': UISpacer;
        'ui-box': UIBox;
        'ui-center': UICenter;
    }
}
//# sourceMappingURL=spacing.d.ts.map