import { default as React } from 'react';
import { default as IStackProps } from './IStackProps';
/**
 * A stack component that arranges its children in a vertical or horizontal layout
 * @param props {@link IStackProps} - Props for the Stack component
 * @returns The rendered Stack component
 *
 * @example
 * ```tsx
 * function App() {
 *   return (
 *     <Stack>
 *       <Text>Item 1</Text>
 *       <Text>Item 2</Text>
 *     </Stack>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Responsive stack
 * function App() {
 *   return (
 *     <Stack responsive={{ sm: { direction: 'column' }, md: { direction: 'row' } }}>
 *       <Text>Item 1</Text>
 *       <Text>Item 2</Text>
 *     </Stack>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Wrap content
 * function App() {
 *   return (
 *     <Stack isWrap>
 *       <Text>Item 1</Text>
 *       <Text>Item 2</Text>
 *     </Stack>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Custom element
 * // A list Stack renders only the container: pass <li> children yourself
 * function App() {
 *   return (
 *     <Stack as="ul">
 *       <li>
 *         <Text>Item 1</Text>
 *       </li>
 *       <li>
 *         <Text>Item 2</Text>
 *       </li>
 *     </Stack>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Direction - Supported values: column, row, rowReverse, columnReverse
 * function App() {
 *   return (
 *     <Stack direction="row">
 *       <Text>Item 1</Text>
 *       <Text>Item 2</Text>
 *     </Stack>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Spacing
 * function App() {
 *   return (
 *     <Stack spacing="2">
 *       <Text>Item 1</Text>
 *       <Text>Item 2</Text>
 *     </Stack>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Justify
 * function App() {
 *   return (
 *     <Stack justify="center">
 *       <Text>Item 1</Text>
 *       <Text>Item 2</Text>
 *     </Stack>
 *   );
 * }
 * ```
 */
declare const Stack: React.FC<IStackProps>;
export default Stack;