UNPKG

1.43 kBTypeScriptView Raw
1import { type HTMLChakraProps, type SystemStyleObject } from "../../styled-system";
2import type { StackDirection } from "./get-separator-style";
3interface 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}
30export 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 */
43export declare const Stack: import("react").ForwardRefExoticComponent<StackProps & import("react").RefAttributes<HTMLDivElement>>;
44export {};