import { Meta, ColorPalette, ColorItem } from '@storybook/blocks';
import * as radixColors from '@radix-ui/colors';
import * as lightColors from '../lib/color/light';

<Meta title="Light Color" />
<h1>Light Color</h1>
<ColorPalette>

<ColorItem title="slate" subtitle="slate" colors={lightColors.slate} />
<ColorItem title="olive" subtitle="olive" colors={lightColors.olive} />

<ColorItem title="tomato" subtitle="tomato" colors={lightColors.tomato} />
<ColorItem title="red" subtitle="red" colors={lightColors.red} />
<ColorItem title="ruby" subtitle="ruby" colors={lightColors.ruby} />
<ColorItem title="crimson" subtitle="crimson" colors={lightColors.crimson} />
<ColorItem title="pink" subtitle="pink" colors={lightColors.pink} />

<ColorItem title="plum" subtitle="plum" colors={lightColors.plum} />
<ColorItem title="purple" subtitle="purple" colors={lightColors.purple} />
<ColorItem title="violet" subtitle="violet" colors={lightColors.violet} />
<ColorItem title="iris" subtitle="iris" colors={lightColors.iris} />
<ColorItem title="indigo" subtitle="indigo" colors={lightColors.indigo} />

<ColorItem title="blue" subtitle="blue" colors={lightColors.blue} />
<ColorItem title="cyan" subtitle="cyan" colors={lightColors.cyan} />
<ColorItem title="teal" subtitle="teal" colors={lightColors.teal} />
<ColorItem title="jade" subtitle="jade" colors={lightColors.jade} />
<ColorItem title="green" subtitle="green" colors={lightColors.green} />

<ColorItem title="grass" subtitle="grass" colors={lightColors.grass} />
<ColorItem title="brown" subtitle="brown" colors={lightColors.brown} />
<ColorItem title="bronze" subtitle="bronze" colors={lightColors.bronze} />
<ColorItem title="gold" subtitle="gold" colors={lightColors.gold} />
<ColorItem title="sky" subtitle="sky" colors={lightColors.sky} />

<ColorItem title="mint" subtitle="mint" colors={lightColors.mint} />
<ColorItem title="lime" subtitle="lime" colors={lightColors.lime} />
<ColorItem title="yellow" subtitle="yellow" colors={lightColors.yellow} />
<ColorItem title="amber" subtitle="amber" colors={lightColors.amber} />
<ColorItem title="orange" subtitle="orange" colors={lightColors.orange} />

</ColorPalette>