DistributionDonut

<DistributionDonut
  centerLabel="Источники"
  centerValue={128}
  items={[
    {
      key: 'direct',
      label: 'Яндекс Директ',
      value: 84,
      color: 'var(--chart-distribution-1)'
    },
    {
      key: 'organic',
      label: 'Органика',
      value: 31,
      color: 'var(--chart-distribution-2)'
    },
    {
      key: 'social',
      label: 'Соцсети',
      value: 9,
      color: 'var(--chart-distribution-3)'
    },
    {
      key: 'other',
      label: 'Другое',
      value: 4,
      color: 'var(--chart-distribution-4)'
    }
  ]}
/>

<DistributionDonut
  layout="side"
  centerLabel="Звонки"
  items={[
    {
      key: 'target',
      label: 'Целевые',
      value: 31,
      color: 'var(--intent-success-bg-strong)'
    },
    {
      key: 'doubt',
      label: 'Сомнительные',
      value: 8,
      color: 'var(--intent-warning-bg-strong)'
    },
    {
      key: 'spam',
      label: 'Спам',
      value: 3,
      color: 'var(--intent-critical-bg-strong)'
    }
  ]}
/>