import { ComponentInfo, Link, Preview, Tagline } from "@stories/components";
import { LI, UL } from "@components/html";
import { Meta, Story } from "@storybook/addon-docs";

<Meta
    title="Html elements/List"
    id="html-list"
/>

# List

<Tagline>A specialized <Link href="?path=/docs/box--default-story">box</Link> component for HTML ul/ol/li element.</Tagline>

<ComponentInfo
    usage={"import { UL, OL, LI } from \"@sharegate/orbit-ui\";"}
    githubPath="/packages/components/src/html/src"
/>

## Usage

Accepts all the HTML attributes of [ul](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ul), [ol](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol) and [li](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li) elements with the addition of [Orbit styled component props](?path=/docs/styling--page).

<Preview>
    <Story name="example">
        <UL color="alias-tertiary">
            <LI>Explore</LI>
            <LI>Discover</LI>
            <LI color="accent-6">Colonize</LI>
        </UL>
    </Story>
</Preview>
