<Docs title="For Grid">
	<div style="width: 326px; max-width: 100%">
		<ProductTeaser {...dummy} layout="grid" />
	</div>
</Docs>

<Docs title="For Grid, new product">
	<div style="width: 326px; max-width: 100%">
		<ProductTeaser {...dummy} isNew={true} layout="grid" />
	</div>
</Docs>

<Docs title="For Product Detail Header">
	<div style="width: 652px; max-width: 100%">
		<ProductTeaser {...dummy} layout="detail" />
	</div>
</Docs>

<Docs title="For Slider, inactive slide">
	<div style="width: 468px; max-width: 100%">
		<ProductTeaser {...dummy} layout="slider" />
	</div>
</Docs>

<Docs title="For Slider, active slide">
	<div style="width: 468px; max-width: 100%">
		<ProductTeaser {...dummy} layout="slider" isActive />
	</div>
</Docs>