import { Meta, ColorPalette, ColorItem } from '@storybook/blocks';
import * as radixColors from '@radix-ui/colors';
import * as darkColors from '../lib/color/dark';

<Meta title="Dark Color" />
<h1>Dark Color</h1>
<ColorPalette>

<ColorItem title="slateDark" subtitle="slateDark" colors={darkColors.slateDark} />
<ColorItem title="oliveDark" subtitle="oliveDark" colors={darkColors.oliveDark} />

<ColorItem title="tomatoDark" subtitle="tomatoDark" colors={darkColors.tomatoDark} />
<ColorItem title="redDark" subtitle="redDark" colors={darkColors.redDark} />
<ColorItem title="rubyDark" subtitle="rubyDark" colors={darkColors.rubyDark} />
<ColorItem title="crimsonDark" subtitle="crimsonDark" colors={darkColors.crimsonDark} />
<ColorItem title="pinkDark" subtitle="pinkDark" colors={darkColors.pinkDark} />

<ColorItem title="plumDark" subtitle="plumDark" colors={darkColors.plumDark} />
<ColorItem title="purpleDark" subtitle="purpleDark" colors={darkColors.purpleDark} />
<ColorItem title="violetDark" subtitle="violetDark" colors={darkColors.violetDark} />
<ColorItem title="irisDark" subtitle="irisDark" colors={darkColors.irisDark} />
<ColorItem title="indigoDark" subtitle="indigoDark" colors={darkColors.indigoDark} />

<ColorItem title="blueDark" subtitle="blueDark" colors={darkColors.blueDark} />
<ColorItem title="cyanDark" subtitle="cyanDark" colors={darkColors.cyanDark} />
<ColorItem title="tealDark" subtitle="tealDark" colors={darkColors.tealDark} />
<ColorItem title="jadeDark" subtitle="jadeDark" colors={darkColors.jadeDark} />
<ColorItem title="greenDark" subtitle="greenDark" colors={darkColors.greenDark} />

<ColorItem title="grassDark" subtitle="grassDark" colors={darkColors.grassDark} />
<ColorItem title="brownDark" subtitle="brownDark" colors={darkColors.brownDark} />
<ColorItem title="bronzeDark" subtitle="bronzeDark" colors={darkColors.bronzeDark} />
<ColorItem title="goldDark" subtitle="goldDark" colors={darkColors.goldDark} />
<ColorItem title="skyDark" subtitle="skyDark" colors={darkColors.skyDark} />

<ColorItem title="mintDark" subtitle="mintDark" colors={darkColors.mintDark} />
<ColorItem title="limeDark" subtitle="limeDark" colors={darkColors.limeDark} />
<ColorItem title="yellowDark" subtitle="yellowDark" colors={darkColors.yellowDark} />
<ColorItem title="amberDark" subtitle="amberDark" colors={darkColors.amberDark} />
<ColorItem title="orangeDark" subtitle="orangeDark" colors={darkColors.orangeDark} />

</ColorPalette>
