import { Meta, Story, ArgsTable, Canvas } from '@storybook/addon-docs/blocks';
import ProductBundleDescription from '../ProductBundleDescription';
import { CollapsibleJsonSnippet } from '../../../tools/docTools';
import { productBundleMock } from '../../../../mocks/product/productBundles';

export const productBundleData = productBundleMock.bundle;

<Meta title="Components/Product Bundle Description" component={ProductBundleDescription} />

# ProductBundleDescription
<br />

## `ProductBundleDescriptions` are used to display a bundle description.
<br />

### Default
<Canvas>
    <Story name="Default">
        <ProductBundleDescription data={productBundleData} />
    </Story>
</Canvas>


## Usage Example
<CollapsibleJsonSnippet
    summary="productBundleData"
    code={productBundleData}
/>

```jsx
import ProductBundleDescription
from '@appdirect/sfb-theme-components/src/components/product-bundle-description/ProductBundleDescription';

<ProductBundleDescription data={productBundleData} />

```

## Props
<ArgsTable of={ProductBundleDescription} />
