import { ArgsTable, Meta, Story } from "@storybook/addon-docs";
import { ComponentInfo, Preview, Tagline } from "@stories/components";
import { Content, InnerContent } from "@components/placeholders";

<Meta
    title="Placeholders/Content"
    id="content"
/>

# Content

<Tagline>A placeholder for a content section.</Tagline>

<ComponentInfo
    usage={"import { Content } from \"@sharegate/orbit-ui\";"}
    githubPath="/packages/components/src/placeholders/src"
/>

## Usage

A content placeholder component *provides no specific styling by itself, but receives styling from the parent container*. In addition, a content placeholder will be automatically placed within the container's layout according to Orbit guidelines.

<Preview>
    <Story name="example">
        <Content>The Earth is the cradle of humanity, but mankind cannot stay in the cradle forever.</Content>
    </Story>
</Preview>

## API

### Content

<ComponentInfo
    usage={"import { Content } from \"@sharegate/orbit-ui\";"}
    inherits={[InnerContent.defaultElement, "styled-component"]}
    compact
/>

<ArgsTable of={InnerContent} sort="alpha" />
