1 | import { type HTMLChakraProps, type SystemStyleObject } from "../../styled-system";
|
2 | import type { StackDirection } from "./get-separator-style";
|
3 | interface StackOptions {
|
4 | /**
|
5 | * Shorthand for `alignItems` style prop
|
6 | * @type SystemStyleObject["alignItems"]
|
7 | */
|
8 | align?: SystemStyleObject["alignItems"];
|
9 | /**
|
10 | * Shorthand for `justifyContent` style prop
|
11 | * @type SystemStyleObject["justifyContent"]
|
12 | */
|
13 | justify?: SystemStyleObject["justifyContent"];
|
14 | /**
|
15 | * Shorthand for `flexWrap` style prop
|
16 | * @type SystemStyleObject["flexWrap"]
|
17 | */
|
18 | wrap?: SystemStyleObject["flexWrap"];
|
19 | /**
|
20 | * The direction to stack the items.
|
21 | * @default "column"
|
22 | */
|
23 | direction?: StackDirection;
|
24 | /**
|
25 | * If `true`, each stack item will show a separator
|
26 | * @type React.ReactElement
|
27 | */
|
28 | separator?: React.ReactElement;
|
29 | }
|
30 | export interface StackProps extends HTMLChakraProps<"div", StackOptions> {
|
31 | }
|
32 | /**
|
33 | * Stacks help you easily create flexible and automatically distributed layouts
|
34 | *
|
35 | * You can stack elements in the horizontal or vertical direction,
|
36 | * and apply a space or/and separator between each element.
|
37 | *
|
38 | * It uses `display: flex` internally and renders a `div`.
|
39 | *
|
40 | * @see Docs https://chakra-ui.com/stack
|
41 | *
|
42 | */
|
43 | export declare const Stack: import("react").ForwardRefExoticComponent<StackProps & import("react").RefAttributes<HTMLDivElement>>;
|
44 | export {};
|