KeyValue

<KeyValue
  label="Personal user data"
  columns={[
    {
      name: 'key',
    },
    {
      name: 'value',
    },
  ]}
  data={[
    {
      key: 'Surname',
      age: 25,
      value: 'Ivanov',
    },
  ]}
/>

<KeyValue
  label="Books"
  columns={[
    {
      name: 'id',
      width: '10%',
    },
    {
      name: 'Book name',
      width: '90%',
    },
  ]}
  data={[
    {
      key: 1,
      author: 'Lewis Carroll',
      publicationYear: 1865,
      value: "Alice's Adventures in Wonderland",
    },
  ]}
/>

<KeyValue
  label="Geography"
  columns={[
    {
      name: 'Key',
    },
    {
      name: 'Value',
    },
  ]}
  data={[
    {
      key: 'Countries list',
      value: ['Japan', 'Canada', 'Russia', 'USA'],
    },
    {
      key: 'Continents list',
      value: [
        'Eurasia',
        'Africa',
        'North America',
        'South America',
        'Antarctica',
        'Australia',
      ],
    },
  ]}
/>

<KeyValue
  label="Geography"
  columns={[
    {
      name: 'Key',
    },
    {
      name: 'Value',
    },
  ]}
  data={[
    {
      key: 'Continents list',
      value: [
        'Australia',
        <Link href="https://en.wikipedia.org/wiki/Eurasia" target="_blank">
          Eurasia
        </Link>,
        'Africa',
        <Link
          href="https://en.wikipedia.org/wiki/North_America"
          target="_blank"
        >
          North America
        </Link>,
        'South America',
        <Link href="https://en.wikipedia.org/wiki/Antarctica" target="_blank">
          Antarctica
        </Link>,
      ],
    },
  ]}
/>