// @delay-test-snapshot

import React from 'react';
import Markdown from '@digigov/ui/content/Markdown';
import { SectionBreak } from '@digigov/ui/layouts';
import Grid from '@digigov/ui/layouts/Grid';

const markdownExamples = [
  '## Παράδειγμα h2',
  'Προς:<sup>(1)</sup>',
  '[εδώ](http://www.astynomia.gr/index.php?option=ozo_content&perform=view&id=139&Itemid=132&lang)',
  '[https://pki.aped.gov.gr/repository](https://pki.aped.gov.gr/repository)',
  '**Σημαντικό:**',
  `Μπορείτε να αιτηθείτε για απόσπασμα Ληξιαρχικής Πράξης που:
  * εκδόθηκε μετά τις 08/05/2013
  * μεταβλήθηκε ή εκδόθηκε απόσπασμά της μετά το 2018
  * εκδόθηκε από το Ειδικό Ληξιαρχείο Αθηνών μετά τις 22/01/2018 και αφορά γεγονότα που τελέστηκαν στο εξωτερικό\n\n`,
  `Εάν είστε εκπαιδευτική κατηγορία ατόμων που πρέπει να προσκομίσουν δήλωση
  αποτελέσματος για ευτικός (δημοσίου ή ιδιωτικού σχολείου) ή ανήκετε
  σε κάποια άλλη κα την πρόσβαση σε σχολική μονάδα,
  συμπληρώστε το πεδίο **Όνομα σχολείου**, διαφορετικά αφήστε το κενό.`,
];

export const Default = (_: any) => {
  return (
    <>
      {markdownExamples.map((markdown, index) => (
        <Grid container key={index} spacing={4}>
          <Grid item xs={12} sm={6}>
            {markdown}
          </Grid>
          <Grid item xs={12} sm={6}>
            <Markdown content={markdown} />
          </Grid>
          <Grid item xs={12}>
            <SectionBreak />
          </Grid>
        </Grid>
      ))}
    </>
  );
};

export default Default;