import { Playground, Props } from "@slytrunk/docs";
import View from "./View";

# View

Base UI component.

By default Views will stack vertically, use the `row` prop to lay them out horizontally.

<Props of={View} />

## Basic Usage

<Playground>
  <View p={2} style={{ backgroundColor: "blue" }} />
  <View p={4} style={{ backgroundColor: "red" }} />
</Playground>

## Rows

<Playground>
  <View row>
    <View p={2} style={{ backgroundColor: "red" }} />
    <View p={2} style={{ backgroundColor: "blue" }} />
    <View p={2} style={{ backgroundColor: "red" }} />
    <View p={2} style={{ backgroundColor: "blue" }} />
  </View>
</Playground>