ResourceListPage
Implemented BlocksResource list with usage guidance, additional content and pagination.
Kumo reference: kumo-ui.com/blocks/resource-list/
Presentation commands show demo feedback. Read the interaction guide to connect real actions.
Basic
Databases
Manage your resources and configuration.
production-kv
Created in the demo workspace.
staging-kv
Created in the demo workspace.
Showing 1-2 of 2
Show template
{% load wdj %}
{% wdj_component "wdj/components/resource_list.html" title="Databases" icon="database" description="Manage your resources and configuration." %}
{% wdj_component "wdj/components/card.html" title="production-kv" %}
<p class="text-base text-kumo-subtle">Created in the demo workspace.</p>
{% endwdj_component %}
{% wdj_component "wdj/components/card.html" title="staging-kv" %}
<p class="text-base text-kumo-subtle">Created in the demo workspace.</p>
{% endwdj_component %}
{% include "wdj/components/pagination.html" with page=1 per_page=10 total_count=2 only %}
{% endwdj_component %}Quick start
API keys
Manage your resources and configuration.
production-kv
Created in the demo workspace.
staging-kv
Created in the demo workspace.
Showing 1-2 of 2
Show template
{% load wdj %}
{% wdj_component "wdj/components/resource_list.html" title="API keys" usage_code="curl https://api.example.com" usage_lang="bash" description="Manage your resources and configuration." %}
{% wdj_component "wdj/components/card.html" title="production-kv" %}
<p class="text-base text-kumo-subtle">Created in the demo workspace.</p>
{% endwdj_component %}
{% wdj_component "wdj/components/card.html" title="staging-kv" %}
<p class="text-base text-kumo-subtle">Created in the demo workspace.</p>
{% endwdj_component %}
{% include "wdj/components/pagination.html" with page=1 per_page=10 total_count=2 only %}
{% endwdj_component %}Additional content
KV namespaces
Manage your resources and configuration.
production-kv
Created in the demo workspace.
staging-kv
Created in the demo workspace.
Showing 1-2 of 2
Show template
{% load wdj %}
{% wdj_component "wdj/components/resource_list.html" title="KV namespaces" icon="database" usage_code="value = store.get(key)" usage_lang="python" additional_title="Learn more" additional_description="Read the documentation for your storage backend." description="Manage your resources and configuration." %}
{% wdj_component "wdj/components/card.html" title="production-kv" %}
<p class="text-base text-kumo-subtle">Created in the demo workspace.</p>
{% endwdj_component %}
{% wdj_component "wdj/components/card.html" title="staging-kv" %}
<p class="text-base text-kumo-subtle">Created in the demo workspace.</p>
{% endwdj_component %}
{% include "wdj/components/pagination.html" with page=1 per_page=10 total_count=2 only %}
{% endwdj_component %}API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | unset | Title; pass the documented value shown in the examples. |
| description | string | unset | Description; pass the documented value shown in the examples. |
| icon | string | unset | Icon; pass the documented value shown in the examples. |
| slot | string / HTML slot | unset | Rich HTML supplied by the wdj_component block tag, rendered in an isolated context. |
| usage | string / HTML slot | unset | Usage; pass the documented value shown in the examples. |
| usage_code | string | unset | Usage code; pass the documented value shown in the examples. |
| usage_title | string | unset | Usage title; pass the documented value shown in the examples. |
| usage_lang | string | unset | Usage lang; pass the documented value shown in the examples. |
| additional_content | string / HTML slot | unset | Additional content; pass the documented value shown in the examples. |
| additional_title | string | unset | Additional title; pass the documented value shown in the examples. |
| additional_description | string | unset | Additional description; pass the documented value shown in the examples. |
| attrs | dict | {} | Dictionary of escaped native, HTMX or Alpine attributes. Literal Tailwind classes only. |
| class | string | "" | Class; pass the documented value shown in the examples. |