AttachmentItem

apps/www/src/components/AttachmentItem.astro · 30 lines · group Models (product catalog)

Used by

Live sites: skattedosan.se.

Samples 4

skattedosan.se/en/models/model-a/shown inside <AttachmentsSection>

Attachments

MDX of this sample
<AttachmentsSection title="Attachments">
    <AttachmentItem
      fileName="Certificate"
      file="/C2Y-CU-001-01-44 ÄB16 Certifikat_typeA.pdf"
      downloadText="Download"
    />
    <AttachmentItem
      fileName="Technical specification"
      file="/TekniskspecifikationSkattedosan.pdf"
      downloadText="Download"
    />
  </AttachmentsSection>
skattedosan.se/en/models/model-c/shown inside <AttachmentsSection>

Attachments

MDX of this sample
<AttachmentsSection title="Attachments">
    <AttachmentItem
      fileName="Certificate"
      file="/C2Y-CU-001-01-45 ÄB16 Certifikat_typeC.pdf"
      downloadText="Download"
    />
    <AttachmentItem
      fileName="Technical specification"
      file="/TekniskspecifikationSkattedosan.pdf"
      downloadText="Download"
    />
  </AttachmentsSection>
skattedosan.se/models/model-a/history: commit 1396f74 (2026-08-18)shown inside <AttachmentsSection>

Attachments

MDX of this sample
<AttachmentsSection title="Attachments">
    <AttachmentItem
      fileName="Certificate"
      file="/C2Y-CU-001-01-44 ÄB16 Certifikat_typeA.pdf"
      downloadText="Download"
    />
    <AttachmentItem
      fileName="Technical specification"
      file="/TekniskspecifikationSkattedosan.pdf"
      downloadText="Download"
    />
  </AttachmentsSection>
skattedosan.se/models/model-c/history: commit 1396f74 (2026-08-18)shown inside <AttachmentsSection>

Attachments

MDX of this sample
<AttachmentsSection title="Attachments">
    <AttachmentItem
      fileName="Certificate"
      file="/C2Y-CU-001-01-45 ÄB16 Certifikat_typeC.pdf"
      downloadText="Download"
    />
    <AttachmentItem
      fileName="Technical specification"
      file="/TekniskspecifikationSkattedosan.pdf"
      downloadText="Download"
    />
  </AttachmentsSection>

Props

NameTypeRequiredDefaultDescription
fileNamestringyes
filestringyes
downloadTextstringyes

Source apps/www/src/components/AttachmentItem.astro @ gitt.one

---
import PaperClip from 'astro-heroicons/solid/PaperClip.astro';

interface Props {
  fileName: string;
  file: string;
  downloadText: string;
}

const { fileName, file, downloadText } = Astro.props;
---

<li
  class="border border-gray-200 rounded-md pl-3 pr-4 py-3 mb-1 flex items-center justify-between text-sm"
>
  <div class="w-0 flex-1 flex items-center">
    <PaperClip class="flex-shrink-0 h-5 w-5 text-gray-400" aria-hidden="true" />
    <span class="ml-2 flex-1 w-0 truncate">{fileName}</span>
  </div>
  <div class="ml-4 flex-shrink-0">
    <a
      href={file}
      download
      class="font-medium text-primary-600 hover:text-primary-500"
    >
      {downloadText}
    </a>
  </div>
</li>

Source links point to engine-astro@e857a859. Samples are cut from the sites' own content by scripts/gallery-extract.mjs; nothing is merged or removed yet.