2022-11-04 15:40:46 +00:00
|
|
|
import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
|
|
|
|
import { Examples, Example, Note, Title,CustomArgsTable } from '@calcom/storybook/components'
|
2022-11-23 02:55:25 +00:00
|
|
|
import { Icon } from "@calcom/ui";
|
2022-11-04 15:40:46 +00:00
|
|
|
|
|
|
|
import { Breadcrumb } from './Breadcrumb';
|
|
|
|
|
|
|
|
<Meta title="UI/Breadcrumbs" component={Breadcrumb} />
|
|
|
|
|
|
|
|
<Title title="Breadcrumbs" suffix="Brief" subtitle="Version 2.0 — Last Update: 22 Aug 2022"/>
|
|
|
|
|
|
|
|
|
|
|
|
## Structure
|
|
|
|
|
|
|
|
<CustomArgsTable of={Breadcrumb} />
|
|
|
|
|
|
|
|
|
|
|
|
<Examples title="Breadcrumb style"
|
|
|
|
>
|
|
|
|
<Example title="Primary">
|
|
|
|
<Breadcrumb>
|
|
|
|
<BreadcrumbItem href="/">Home</BreadcrumbItem>
|
|
|
|
<BreadcrumbItem href="/">Test</BreadcrumbItem>
|
|
|
|
</Breadcrumb>
|
|
|
|
</Example>
|
|
|
|
</Examples>
|
|
|
|
|
|
|
|
## Usage
|
|
|
|
When hovering over the button, there should be a tooltip to explain the context of the button, so the user can understand the result of action.
|