type StackDirection = 'column' | 'row';
type StackGap = '0' | '4' | '8' | '12' | '16' | '20' | '24' | '32';
type StackAlign = 'start' | 'center' | 'end' | 'stretch';
/**
 * `<dt-stack>` — framework-agnostic flexbox stack web component.
 *
 * Provides vertical or horizontal flexbox layout with responsive behavior.
 * Row stacks automatically wrap to column on narrow views.
 *
 * ## Attributes
 * - `direction` — stack direction: `column` (default) or `row`
 * - `gap` — spacing between items: 0, 4, 8, 12, 16, 20, 24, 32 (default: 16)
 * - `align` — cross-axis alignment: `start`, `center`, `end`, `stretch` (default: stretch)
 *
 * ## Usage
 * ```html
 * <!-- Vertical stack (default) -->
 * <dt-stack>
 *   <dt-card>Item 1</dt-card>
 *   <dt-card>Item 2</dt-card>
 *   <dt-card>Item 3</dt-card>
 * </dt-stack>
 *
 * <!-- Horizontal row (wraps to column on narrow views) -->
 * <dt-stack direction="row" gap="24">
 *   <dt-button>Save</dt-button>
 *   <dt-button variant="secondary">Cancel</dt-button>
 * </dt-stack>
 *
 * <!-- Centered horizontal row -->
 * <dt-stack direction="row" align="center" gap="8">
 *   <dt-badge variant="success">Active</dt-badge>
 *   <span>System running</span>
 * </dt-stack>
 * ```
 */
export declare class DtStack extends HTMLElement {
    #private;
    static get observedAttributes(): string[];
    get direction(): StackDirection;
    set direction(val: StackDirection);
    get gap(): StackGap;
    set gap(val: StackGap);
    get align(): StackAlign;
    set align(val: StackAlign);
    connectedCallback(): void;
    attributeChangedCallback(name: string): void;
    constructor();
}
export {};
//# sourceMappingURL=dt-stack.d.ts.map