Skip to main content

KickstarterLinks

Renders kickstarter resource links (Documentation, Demo, Installation, Source Code) with icons. Supports inline (horizontal buttons) and sidebar (vertical list) layouts.

Props

PropTypeRequiredDefaultDescription
kickstarter_linksobjectNo-Links object with documentation_link, demo_link, installation_link, sourcecode_link
kickstarter_links.documentation_linkLinkNo-Documentation link
kickstarter_links.demo_linkLinkNo-Demo link
kickstarter_links.installation_linkLinkNo-Installation link
kickstarter_links.sourcecode_linkLinkNo-Source code link
kickstarter_links.$objectNo-CSLP mappings for each link
layout'inline' | 'sidebar'No'inline'Layout mode: inline = horizontal buttons, sidebar = vertical list

Usage

import KickstarterLinks from '@/components/molecules/KickstarterLinks';

// Sidebar layout (right sidebar, matches TableOfContents style)
<KickstarterLinks
  kickstarter_links={kickstart.kickstarter_links}
  layout="sidebar"
/>

// Inline layout (horizontal buttons below title)
<KickstarterLinks
  kickstarter_links={kickstart.kickstarter_links}
  layout="inline"
/>

Features

  • Four link types: Documentation, Demo, Installation, Source Code
  • Icons: Uses Icons atom (description, play_arrow, arrow_outward, code)
  • Layout modes: Inline (flex wrap) or sidebar (vertical nav list)
  • CSLP support: Pass-through for Contentstack Live Preview
  • External links: Automatically opens in new tab with security attributes

Notes

  • Returns null if no kickstarter_links or all links are empty
  • Link type uses link.title when present, otherwise defaults to label
  • Used only on Kickstart page