import React from 'react';

import {
  SummaryList,
  SummaryListItem,
  SummaryListItemAction,
  SummaryListItemKey,
  SummaryListItemValue,
} from '@digigov/ui/content/SummaryList';

import { Link } from '@digigov/ui/navigation/Link';
import { VisuallyHidden } from '@digigov/ui/utils/VisuallyHidden';
export const RowVariations = (_: any) => (
  <>
    <SummaryList>
      <SummaryListItem>
        <SummaryListItemKey>Διεύθυνση</SummaryListItemKey>
        <SummaryListItemValue>Συντάγματος 15, Αθήνα</SummaryListItemValue>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
      <SummaryListItem>
        <SummaryListItemKey>Όνομα</SummaryListItemKey>
        <SummaryListItemValue>Κατερίνα</SummaryListItemValue>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
    </SummaryList>

    <SummaryList>
      <SummaryListItem>
        <SummaryListItemKey>Διεύθυνση</SummaryListItemKey>
        <SummaryListItemValue>Συντάγματος 15, Αθήνα</SummaryListItemValue>
      </SummaryListItem>
      <SummaryListItem>
        <SummaryListItemKey>Όνομα</SummaryListItemKey>
        <SummaryListItemValue>Κατερίνα</SummaryListItemValue>
      </SummaryListItem>
    </SummaryList>

    <SummaryList>
      <SummaryListItem>
        <SummaryListItemKey>Διεύθυνση</SummaryListItemKey>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
      <SummaryListItem>
        <SummaryListItemKey>Όνομα</SummaryListItemKey>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
    </SummaryList>

    <SummaryList>
      <SummaryListItem>
        <SummaryListItemValue>Συντάγματος 15, Αθήνα</SummaryListItemValue>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
      <SummaryListItem>
        <SummaryListItemValue>Κατερίνα</SummaryListItemValue>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
    </SummaryList>

    <SummaryList>
      <SummaryListItem>
        <SummaryListItemKey>Διεύθυνση</SummaryListItemKey>
      </SummaryListItem>
      <SummaryListItem>
        <SummaryListItemKey>Όνομα</SummaryListItemKey>
      </SummaryListItem>
    </SummaryList>

    <SummaryList>
      <SummaryListItem>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
      <SummaryListItem>
        <SummaryListItemAction>
          <Link href="#">
            Αλλαγή<VisuallyHidden>Διεύθυνσης</VisuallyHidden>
          </Link>
        </SummaryListItemAction>
      </SummaryListItem>
    </SummaryList>
  </>
);

export default RowVariations;