import { Meta } from '@storybook/addon-docs/blocks'

import { Colors } from '../Colors'

import {
  base,
  scandic,
  scandicGo,
  downtownCamper,
  haymarket,
  marski,
  hotelNorge,
  grandHotel,
  theDock,
} from '../../../lib/tokens'

<Meta title="Tokens/Colors" />

# Colors

Select a theme to view all available color tokens. Click on any value to copy it to your clipboard.

<Colors
  themes={[
    { name: 'base', displayName: 'Base', theme: base },
    { name: 'scandic', displayName: 'Scandic', theme: scandic },
    { name: 'scandicGo', displayName: 'Scandic Go', theme: scandicGo },
    {
      name: 'downtownCamper',
      displayName: 'Downtown Camper',
      theme: downtownCamper,
    },
    { name: 'haymarket', displayName: 'Haymarket', theme: haymarket },
    { name: 'marski', displayName: 'Marski', theme: marski },
    { name: 'hotelNorge', displayName: 'Hotel Norge', theme: hotelNorge },
    { name: 'grandHotel', displayName: 'Grand Hotel', theme: grandHotel },
    { name: 'theDock', displayName: 'The Dock', theme: theDock },
  ]}
  defaultThemeName="scandic"
/>
