Components

Everything ships as a django-components component, registered under an adminlte_* name. Render any of them with the {% component "name" ... %}{% endcomponent %} tag. Pass keyword props; any extra kwargs pass through as HTML attributes on the root element.

Widgets

Component	Key props
`adminlte_card`	`title`, `icon`, `theme`, `outline`, `collapsible`, `collapsed`, `removable`, `maximizable`, `body_class` — slots: `footer`, `tools`
`adminlte_small_box`	`title`, `text`, `icon`, `theme`, `url`, `url_text`
`adminlte_info_box`	`title`, `text`, `icon`, `theme`, `icon_theme`, `progress`, `progress_text`
`adminlte_alert`	`theme`, `title`, `icon`, `dismissable`
`adminlte_callout`	`theme`, `title`, `icon`
`adminlte_progress`	`value`, `theme`, `striped`, `animated`, `height`, `show_label`
`adminlte_progress_group`	`label`, `value`, `color`, `max`, `show_percentage`
`adminlte_timeline`	`items` ([{icon, icon_bg, title, url, body, footer}])
`adminlte_description_block`	`title`, `text`, `items` (label→value)
`adminlte_profile_card`	`name`, `title`, `image`, `socials`, `description`
`adminlte_ratings`	`value`, `max`, `color`
`adminlte_breadcrumb`	`items` ([{label, url, active}])
`adminlte_accordion`	`items` ([{title, content, expanded?, id?}]), `flush`, `always_open`
`adminlte_tabs`	`items` ([{title, icon?, content, active?}]), `variant`, `justified`, `fill`
`adminlte_toast`	`id`, `title`, `theme`, `icon`, `autohide`, `delay`
`adminlte_direct_chat`	`items`, `title`, `theme`, `send_url`

Forms

Labelled Bootstrap 5 controls with validation feedback. Bind a Django form field with field=form.x, or use them standalone with name/value/error.

Component	Key props
`adminlte_input`	`field`, `name`, `label`, `type`, `value` — slots: `prepend`, `append`
`adminlte_textarea`	`field`, `name`, `label`, `rows`
`adminlte_select`	`field`, `name`, `label`, `multiple` — default slot: `<option>` markup
`adminlte_input_switch`	`field`, `name`, `label`, `checked`, `value`
`adminlte_input_color`	`field`, `name`, `label`, `default`
`adminlte_input_file`	`field`, `name`, `label`, `multiple`
`adminlte_button`	`type`, `theme`, `outline`, `size`, `icon`, `label`

Tool components (plugin-backed)

These emit a data-* container with a JSON config; the shipped initializer lazily imports each library only when a matching element is on the page. See Charts & Plugins.

Component	Library / key props
`adminlte_chart`	ApexCharts — `type`, `series`, `categories`, `options`, `height`
`adminlte_datatable`	Tabulator — `columns`, `data` or `api_url`, `options`
`adminlte_vector_map`	jsVectorMap — `map`, `markers`, `regions`, `height`
`adminlte_editor`	Quill — `field`/`name`, `placeholder`, `quill_options`
`adminlte_sortable`	SortableJS — `options`, `group`, `tag`
`adminlte_modal`	Bootstrap — `id`, `title`, `size`, `theme`, `scrollable`, `centered` — slots: default, `footer`

Usage snippets

{# A collapsible outline card with a footer slot #}
{% component "adminlte_card" title="Sales" icon="bi bi-graph-up" theme="primary" outline=True collapsible=True %}
    Monthly revenue summary…
    {% fill "footer" %}Updated 5 min ago{% endfill %}
{% endcomponent %}

{# Stat boxes #}
{% component "adminlte_small_box" title="150" text="New orders" theme="primary" icon="bi bi-bag" url="#" %}{% endcomponent %}
{% component "adminlte_info_box" title="41,410" text="Bookmarks" icon="bi bi-bookmark" theme="info" progress=70 progress_text="70% increase in 30 days" %}{% endcomponent %}

{# Bind a Django form field — value repopulation + validation feedback come for free #}
{% component "adminlte_input" field=form.email type="email" label="Email" %}{% endcomponent %}

{# Data-driven tabs #}
{% component "adminlte_tabs" items=tabs variant="pills" %}{% endcomponent %}

Props passed as Python objects (series, items, columns, progress=70) come from your view's context — build the list/dict in the view and reference the variable in the tag.

AdminLTE 4 · Django port Edit on GitHub