RelatedContent. A semantic list of related articles or resources.
- Discovery
- Static
- Stability · Initial
- ::postkit-related-content
Usage.
<RelatedContent
title="Continue reading"
items='[{"title":"Authoring with portable directives","description":"Add rich semantics without coupling content to React.","meta":"7 min read","href":"#component-preview"},{"title":"Composing a host-owned theme","description":"Layer Postkit recipes into an existing Chakra system.","meta":"5 min read","href":"#component-preview"}]'
/>Props. Always in step with the code.
| Prop | Type | Default | Description |
|---|---|---|---|
| itemsRequired | JSON string | None | A JSON array of related content links. |
| title | string | "Related content" | The related-content heading. |
| Appearance | |||
| size | "sm" | "md" | "lg" | "md" | The component density and type scale. |
| variant | "outline" | "subtle" | "plain" | "subtle" | The component visual treatment. |
Every component also takes unstyled and the part-styling props. Change a default for your whole site with defaults in createPostkit. Part styles
Anatomy. Every part is yours to restyle.
Every part
- root
- title
- list
- item
- link
- itemTitle
- description
- meta
Renderers. One component, everywhere you publish.
- Headless @postkit/reactSupported
- Chakra @postkit/chakraSupported
- Email @postkit/emailAs text
- Astro @postkit/astroStatic
- Web components @postkit/elementsPlanned