Textarea

template 1 required9 optional4 slots1 a11y rule

Preview

Usage

views.py
python
from djust import LiveView


class MyView(LiveView):
    template_name = "my_template.html"

    def mount(self, request, **kwargs):
        self.name = 'gallery_textarea'
my_template.html
django
{% load theme_components %}
{% theme_textarea name=name label='Textarea' placeholder='Write something...' rows=4 %}

Props

NameTypeRequiredDefault
namestrrequired
labelOptional[str]
placeholderstr
rowsint4
css_prefixstr
attrsdict
slot_labelstr
slot_textareastr
slot_help_textstr
slot_errorstr

Accessibility

RequirementElementAttributeValue
Label must reference textarea via for attributelabelfor(present)

Slots

slot_label slot_textarea slot_help_text slot_error
Source & styles
FilePathNotes
templatedjust_theming/components/textarea.htmlCopy it to the same path in your project, or per theme under djust_theming/themes/<theme>/components/.
Template source — textarea.html
django
<div class="{{ css_prefix }}textarea-group {% if attrs.class %}{{ attrs.class }}{% endif %}">
    {% if slot_label %}
    {{ slot_label|safe }}
    {% elif label %}
    <label for="{{ name }}" class="{{ css_prefix }}textarea-label">{{ label }}</label>
    {% endif %}
    {% if slot_textarea %}
    {{ slot_textarea|safe }}
    {% else %}
    <textarea
        name="{{ name }}"
        id="{{ name }}"
        placeholder="{{ placeholder }}"
        rows="{{ rows }}"
        class="{{ css_prefix }}textarea"
        {% if attrs.required %}required{% endif %}
        {% if attrs.disabled %}disabled{% endif %}
        {% if attrs.readonly %}readonly{% endif %}
    >{% if attrs.value %}{{ attrs.value }}{% endif %}</textarea>
    {% endif %}
    {% if slot_help_text %}
    <div class="{{ css_prefix }}textarea-help">{{ slot_help_text|safe }}</div>
    {% endif %}
    {% if slot_error %}
    <div class="{{ css_prefix }}textarea-error" role="alert">{{ slot_error|safe }}</div>
    {% endif %}
</div>