WUI logo

Slider

The Stack component is a layout element that arranges child components in a vertical or horizontal stack with consistent spacing. It simplifies the creation of flexible and responsive layouts by managing the alignment, spacing, and distribution of its children. This component is ideal for organizing content in a structured and visually appealing manner.

Source@welcome-ui/stack
OverviewProps
import * as React from 'react'
import { Stack } from '@welcome-ui/stack'


const Example = () => {
  return (
    <Stack>
      <div>Foo</div>
      <div>Bar</div>
      <div>Baz</div>
    </Stack>
  )
}


export default Example

Installation

1

Run the following command:

yarn add @welcome-ui/stack
2

Import component:

import { Slider } from '@welcome-ui/stack'

Examples

The default use of Stack will stack its children vertically.

Spacing and direction

You can change the direction & the spacing.

Childs

It will ensure that its children are lis when is rendered as an ul or an ol.

ShapeBreadcrumb