import { createComponent } from '@graphprotocol/gds-css'

export const DescriptionListMeta = createComponent('DescriptionList', {
  cssProps: {
    /** @default 'medium' */
    size: {
      type: 'values',
      values: ['small', 'medium', 'large'],
      defaultValue: 'medium',
    },
    /** @default 'vertical' */
    orientation: {
      type: 'values',
      values: ['horizontal', 'vertical'],
      defaultValue: 'vertical',
    },
  },
})

export const DescriptionListItemMeta = createComponent('DescriptionListItem', {
  cssProps: {
    /** @default 'default' */
    variant: {
      type: 'values',
      values: ['default', 'caption', 'mono'],
      defaultValue: 'default',
    },
  },
})
