/**
 * @file stack.stylex.ts
 * @input Uses @stylexjs/stylex, spacing from theme
 * @output StyleX utility for stack (flex container) styling
 * @position Layout utility; used by HStack, VStack components
 *
 * SYNC: When modified, update /packages/core/src/Stack/Stack.doc.mjs
 */
import * as stylex from '@stylexjs/stylex';
import type { SpacingStep } from '../utils/types';
declare const alignItemsStyles: Readonly<{
    readonly center: Readonly<{
        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
    }>;
    readonly end: Readonly<{
        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "flex-end">;
    }>;
    readonly start: Readonly<{
        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "flex-start">;
    }>;
    readonly stretch: Readonly<{
        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "stretch">;
    }>;
}>;
/**
 * Cross-axis alignment options for stack items.
 * - For HStack: vertical alignment
 * - For VStack: horizontal alignment
 */
export type StackCrossAlignment = keyof typeof alignItemsStyles;
declare const justifyContentStyles: Readonly<{
    readonly start: Readonly<{
        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-start">;
    }>;
    readonly center: Readonly<{
        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
    }>;
    readonly end: Readonly<{
        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-end">;
    }>;
    readonly between: Readonly<{
        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-between">;
    }>;
    readonly around: Readonly<{
        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-around">;
    }>;
    readonly evenly: Readonly<{
        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-evenly">;
    }>;
}>;
/**
 * Main-axis alignment options for stack items.
 * - For HStack: horizontal alignment
 * - For VStack: vertical alignment
 */
export type StackMainAlignment = keyof typeof justifyContentStyles;
declare const directionStyles: Readonly<{
    readonly horizontal: Readonly<{
        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "row">;
    }>;
    readonly vertical: Readonly<{
        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
    }>;
}>;
/**
 * Stack direction.
 * - `horizontal`: Items flow left-to-right (HStack)
 * - `vertical`: Items flow top-to-bottom (VStack)
 */
export type StackDirection = keyof typeof directionStyles;
declare const wrapStyles: Readonly<{
    readonly nowrap: Readonly<{
        readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "nowrap">;
    }>;
    readonly wrap: Readonly<{
        readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "wrap">;
    }>;
    readonly 'wrap-reverse': Readonly<{
        readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "wrap-reverse">;
    }>;
}>;
/**
 * Flex wrap behavior.
 * - `nowrap`: Items stay on one line (default)
 * - `wrap`: Items wrap to next line
 * - `wrap-reverse`: Items wrap to previous line
 */
export type StackWrap = keyof typeof wrapStyles;
export { type SpacingStep };
export interface StackOptions {
    /**
     * Position of items along the cross-axis.
     * - For HStack: vertical alignment
     * - For VStack: horizontal alignment
     */
    crossAlign?: StackCrossAlignment;
    /**
     * Direction of the stack.
     */
    direction: StackDirection;
    /**
     * Spacing between items.
     * Accepts numeric spacing steps: 0, 0.5, 1, 1.5, 2, 3, 4, 5, 6, 8, 10.
     */
    gap?: SpacingStep;
    /**
     * Position of items along the main-axis.
     * - For HStack: horizontal alignment
     * - For VStack: vertical alignment
     */
    mainAlign?: StackMainAlignment;
    /**
     * Whether items should wrap to the next line.
     * - `nowrap`: Items stay on one line (default)
     * - `wrap`: Items wrap to next line
     * - `wrap-reverse`: Items wrap to previous line
     * @default 'nowrap'
     */
    wrap?: StackWrap;
}
/**
 * StyleX utility to add stack (flex container) styles to any element.
 *
 * @example
 * ```
 * import { stack } from '@astryxdesign/core/Layout';
 * import * as stylex from '@stylexjs/stylex';
 *
 * // Horizontal stack with numeric gap
 * <div {...stylex.props(...stack({ direction: 'horizontal', gap: 2 }))}>
 *   <Child />
 *   <Child />
 * </div>
 *
 * // Vertical stack with centered items
 * <div {...stylex.props(...stack({ direction: 'vertical', crossAlign: 'center' }))}>
 *   <Child />
 *   <Child />
 * </div>
 *
 * // Wrapping horizontal stack with larger gap
 * <div {...stylex.props(...stack({ direction: 'horizontal', gap: 4, wrap: 'wrap' }))}>
 *   <Child />
 *   <Child />
 *   <Child />
 * </div>
 * ```
 */
export declare function stack({ crossAlign, direction, gap, mainAlign, wrap, }: StackOptions): readonly [Readonly<{
    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
}>, Readonly<{
    readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
}> | Readonly<{
    readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "row">;
}>, false | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "0px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "0px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "8px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "8px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "12px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "12px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "16px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "16px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "20px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "20px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "24px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "24px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "4px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "4px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "2px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "2px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "6px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "6px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "32px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "32px">;
}> | Readonly<{
    readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "40px">;
    readonly rowGap: stylex.StyleXClassNameFor<"rowGap", "40px">;
}>, false | Readonly<{
    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "flex-end">;
}> | Readonly<{
    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "flex-start">;
}> | Readonly<{
    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
}> | Readonly<{
    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "stretch">;
}>, false | Readonly<{
    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-end">;
}> | Readonly<{
    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-start">;
}> | Readonly<{
    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
}> | Readonly<{
    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-between">;
}> | Readonly<{
    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-around">;
}> | Readonly<{
    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-evenly">;
}>, false | Readonly<{
    readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "nowrap">;
}> | Readonly<{
    readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "wrap">;
}> | Readonly<{
    readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "wrap-reverse">;
}>];
//# sourceMappingURL=stack.stylex.d.ts.map