tessl/pypi-django-allauth

Integrated set of Django applications addressing authentication, registration, account management as well as 3rd party (social) account authentication.

—

Pending

Overview

Eval results

Files

Template System

Name: tessl/pypi-django-allauth
Author: tessl

Comprehensive template tag library with element-based UI framework, slot system for template composition, and customizable layouts for authentication UI. Provides a sophisticated system for building and customizing authentication interfaces.

Capabilities

Template Tags

Core template tags for UI composition and customization.

@register.tag(name="slot")
def do_slot(parser: Parser, token: Token) -> SlotNode:
    """
    Template tag for defining content slots.
    
    Usage:
    {% slot slot_name %}
        Default content here
    {% endslot %}
    
    Parameters:
    - parser: Django template parser
    - token: Template token
    
    Returns:
    SlotNode instance
    """

@register.tag(name="element")
def do_element(parser: Parser, token: Token) -> ElementNode:
    """
    Template tag for rendering UI elements with layout support.
    
    Usage:
    {% element "button" type="submit" class="btn-primary" %}
        Button content
    {% endelement %}
    
    Parameters:
    - parser: Django template parser
    - token: Template token
    
    Returns:
    ElementNode instance
    """

@register.tag(name="setvar")
def do_setvar(parser: Parser, token: Token) -> SetVarNode:
    """
    Template tag for setting template variables.
    
    Usage:
    {% setvar variable_name %}
        Variable content
    {% endsetvar %}
    
    Parameters:
    - parser: Django template parser
    - token: Template token
    
    Returns:
    SetVarNode instance
    """

Template Nodes

Template node classes implementing the tag functionality.

class SlotNode(Node):
    """
    Template node for slot functionality.
    """
    
    def __init__(self, name: str, nodelist: NodeList): ...
    
    def render(self, context: Context) -> str:
        """
        Render slot content with context.
        
        Parameters:
        - context: Template context
        
        Returns:
        Rendered HTML string
        """

class ElementNode(Node):
    """
    Template node for element rendering with layout awareness.
    """
    
    def __init__(self, nodelist: NodeList, element: FilterExpression, kwargs: Dict[str, FilterExpression]): ...
    
    def render(self, context: Context) -> str:
        """
        Render element with layout-specific template.
        
        Parameters:
        - context: Template context
        
        Returns:
        Rendered HTML string
        """

class SetVarNode(Node):
    """
    Template node for variable setting.
    """
    
    def __init__(self, nodelist: NodeList, var: str): ...
    
    def render(self, context: Context) -> str:
        """
        Set variable in template context.
        
        Parameters:
        - context: Template context
        
        Returns:
        Empty string (sets variable as side effect)
        """

Utility Functions

Template utility functions for parsing and processing.

def parse_tag(token: Token, parser: Parser) -> Tuple[str, List[FilterExpression], Dict[str, FilterExpression]]:
    """
    Parse template tag arguments into positional and keyword arguments.
    
    Parameters:
    - token: Template token to parse
    - parser: Template parser instance
    
    Returns:
    Tuple of (tag_name, args, kwargs)
    """

Element System

The element system provides a flexible way to render UI components with layout-specific templates.

class ElementRenderer:
    """
    Renderer for UI elements with layout support.
    """
    
    def __init__(self, element_name: str, layout: str = None): ...
    
    def render(self, context: Context, attrs: Dict[str, Any] = None, slots: Dict[str, List[str]] = None) -> str:
        """
        Render element with given context and attributes.
        
        Parameters:
        - context: Template context
        - attrs: Element attributes
        - slots: Slot content dictionary
        
        Returns:
        Rendered HTML string
        """
    
    def get_template_names(self) -> List[str]:
        """
        Get template names to try for this element.
        
        Returns:
        List of template names in priority order
        """

def render_element(element_name: str, context: Context, **kwargs) -> str:
    """
    Render element with context and attributes.
    
    Parameters:
    - element_name: Name of element to render
    - context: Template context
    - kwargs: Element attributes
    
    Returns:
    Rendered HTML string
    """

Layout System

Layout detection and management for responsive UI templates.

class LayoutManager:
    """
    Manager for detecting and applying layouts.
    """
    
    def get_current_layout(self, context: Context) -> Optional[str]:
        """
        Get current layout from template context.
        
        Parameters:
        - context: Template context
        
        Returns:
        Layout name or None
        """
    
    def get_element_template(self, element_name: str, layout: str = None) -> str:
        """
        Get template path for element with layout.
        
        Parameters:
        - element_name: Element name
        - layout: Optional layout name
        
        Returns:
        Template path string
        """

def detect_layout_from_extends(context: Context) -> Optional[str]:
    """
    Detect layout from {% extends %} tag in template context.
    
    Parameters:
    - context: Template context
    
    Returns:
    Layout name or None
    """

Built-in Elements

Pre-defined UI elements for common authentication interface components.

# Form Elements
FORM_ELEMENTS = {
    'form': 'Form container with CSRF and action handling',
    'field': 'Form field with label, input, and error display',
    'input': 'Form input with type and validation',
    'button': 'Form button with type and styling',
    'submit': 'Submit button with loading states',
}

# Navigation Elements  
NAVIGATION_ELEMENTS = {
    'nav': 'Navigation container',
    'menu': 'Menu with items and active states',
    'breadcrumb': 'Breadcrumb navigation',
    'pagination': 'Pagination controls',
}

# Content Elements
CONTENT_ELEMENTS = {
    'card': 'Content card with header and body',
    'alert': 'Alert/message with dismissal',
    'modal': 'Modal dialog with backdrop',
    'tabs': 'Tabbed content interface',
}

# Authentication Elements
AUTH_ELEMENTS = {
    'login_form': 'Complete login form',
    'signup_form': 'Complete registration form',
    'password_reset_form': 'Password reset request form',
    'social_login': 'Social authentication buttons',
    'mfa_form': 'Multi-factor authentication form',
}

Usage Examples

Basic Element Usage

<!-- Basic button element -->
{% load allauth %}

{% element "button" type="submit" class="btn btn-primary" %}
    Sign In
{% endelement %}

<!-- Form field with validation -->
{% element "field" name="email" type="email" required=True %}
    {% slot label %}Email Address{% endslot %}
    {% slot help_text %}We'll never share your email{% endslot %}
{% endelement %}

<!-- Alert message -->
{% element "alert" type="success" dismissible=True %}
    Your account has been created successfully!
{% endelement %}

Slot System

<!-- Define slots in parent template -->
{% element "card" %}
    {% slot header %}
        <h3>Login to Your Account</h3>
    {% endslot %}
    
    {% slot body %}
        {% element "login_form" %}
        {% endelement %}
    {% endslot %}
    
    {% slot footer %}
        <p>Don't have an account? <a href="{% url 'account_signup' %}">Sign up</a></p>
    {% endslot %}
{% endelement %}

Layout-Specific Templates

<!-- Base template with layout -->
{% extends "allauth/layouts/bootstrap5.html" %}

{% block content %}
    <!-- Elements will automatically use bootstrap5-specific templates -->
    {% element "form" action="{% url 'account_login' %}" method="post" %}
        {% element "field" name="login" %}
        {% element "field" name="password" type="password" %}
        {% element "submit" %}Login{% endelement %}
    {% endelement %}
{% endblock %}

Custom Element Templates

<!-- templates/allauth/elements/custom_button.html -->
<button type="{{ attrs.type|default:'button' }}" 
        class="custom-btn {{ attrs.class|default:'' }}"
        {% if attrs.disabled %}disabled{% endif %}>
    {{ slots.default|join:'' }}
</button>

<!-- templates/allauth/elements/custom_button__mobile.html -->
<button type="{{ attrs.type|default:'button' }}" 
        class="mobile-btn {{ attrs.class|default:'' }}"
        {% if attrs.disabled %}disabled{% endif %}>
    {{ slots.default|join:'' }}
</button>

Variable Setting

<!-- Set variables for reuse -->
{% setvar page_title %}User Dashboard{% endsetvar %}
{% setvar sidebar_active %}profile{% endsetvar %}

<title>{{ page_title }}</title>

<nav class="sidebar">
    <a href="#" {% if sidebar_active == 'profile' %}class="active"{% endif %}>
        Profile
    </a>
</nav>

Complete Authentication Forms

<!-- Login page with full element system -->
{% extends "allauth/layouts/base.html" %}
{% load allauth %}

{% block content %}
{% element "card" class="auth-card" %}
    {% slot header %}
        <h2>Sign In</h2>
    {% endslot %}
    
    {% slot body %}
        {% if form.errors %}
            {% element "alert" type="danger" %}
                Please correct the errors below.
            {% endelement %}
        {% endif %}
        
        {% element "form" action="{% url 'account_login' %}" method="post" %}
            {% element "field" name="login" %}
                {% slot label %}Email or Username{% endslot %}
            {% endelement %}
            
            {% element "field" name="password" type="password" %}
                {% slot label %}Password{% endslot %}
            {% endelement %}
            
            {% if form.remember %}
                {% element "field" name="remember" type="checkbox" %}
                    {% slot label %}Remember me{% endslot %}
                {% endelement %}
            {% endif %}
            
            {% element "submit" class="btn-primary btn-block" %}
                Sign In
            {% endelement %}
        {% endelement %}
        
        <hr>
        
        {% element "social_login" %}
        {% endelement %}
    {% endslot %}
    
    {% slot footer %}
        <div class="auth-links">
            <a href="{% url 'account_reset_password' %}">Forgot Password?</a>
            <a href="{% url 'account_signup' %}">Create Account</a>
        </div>
    {% endslot %}
{% endelement %}
{% endblock %}

Social Authentication Elements

<!-- Social login buttons -->
{% load socialaccount %}

{% element "social_login" %}
    {% get_providers as socialaccount_providers %}
    {% for provider in socialaccount_providers %}
        {% element "button" class="btn-social btn-{{ provider.id }}" %}
            {% slot icon %}
                <i class="fab fa-{{ provider.id }}"></i>
            {% endslot %}
            Continue with {{ provider.name }}
        {% endelement %}
    {% endfor %}
{% endelement %}

MFA Elements

<!-- TOTP authentication form -->
{% element "mfa_form" method="totp" %}
    {% slot header %}
        <h3>Enter Authentication Code</h3>
        <p>Enter the 6-digit code from your authenticator app.</p>
    {% endslot %}
    
    {% element "field" name="code" type="text" maxlength="6" %}
        {% slot label %}Authentication Code{% endslot %}
    {% endelement %}
    
    {% element "submit" %}Verify{% endelement %}
    
    {% slot footer %}
        <a href="{% url 'mfa_recovery_codes' %}">Use recovery code instead</a>
    {% endslot %}
{% endelement %}

Responsive Layout Support

<!-- Different layouts for different devices -->
{% extends "allauth/layouts/responsive.html" %}

{% block content %}
    <!-- Desktop layout -->
    <div class="d-none d-md-block">
        {% element "form" class="wide-form" %}
            <!-- Wide form layout -->
        {% endelement %}
    </div>
    
    <!-- Mobile layout -->
    <div class="d-md-none">
        {% element "form" class="compact-form" %}
            <!-- Compact form layout -->
        {% endelement %}
    </div>
{% endblock %}

Custom Template Tags

# In your app's templatetags/custom_allauth.py
from django import template
from allauth.templatetags.allauth import ElementNode

register = template.Library()

@register.tag(name="custom_element")
def do_custom_element(parser, token):
    """Custom element tag with additional processing."""
    # Parse token and create custom ElementNode
    return CustomElementNode()

class CustomElementNode(ElementNode):
    def render(self, context):
        # Custom rendering logic
        return super().render(context)

Settings Configuration

# In Django settings.py

# Template settings
TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            BASE_DIR / 'templates',
        ],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                # ... standard context processors
                'allauth.templatetags.context_processors.allauth',
            ],
        },
    },
]

# Allauth template settings
ACCOUNT_TEMPLATE_EXTENSION = 'html'  # Template file extension

# Layout settings
ALLAUTH_LAYOUTS = {
    'bootstrap5': 'allauth/layouts/bootstrap5.html',
    'bootstrap4': 'allauth/layouts/bootstrap4.html',
    'tailwind': 'allauth/layouts/tailwind.html',
    'custom': 'allauth/layouts/custom.html',
}

# Element settings
ALLAUTH_ELEMENTS = {
    'button': 'allauth/elements/button.html',
    'field': 'allauth/elements/field.html',
    'form': 'allauth/elements/form.html',
    # ... other elements
}

Template Customization

<!-- Override default templates -->
<!-- templates/allauth/elements/button.html -->
<button type="{{ attrs.type|default:'button' }}" 
        class="custom-button {{ attrs.class|default:'' }}"
        {% for key, value in attrs.items %}
            {% if key not in 'type,class' %}{{ key }}="{{ value }}"{% endif %}
        {% endfor %}>
    {% if slots.icon %}
        <span class="icon">{{ slots.icon|join:'' }}</span>
    {% endif %}
    <span class="text">{{ slots.default|join:'' }}</span>
</button>

<!-- Layout-specific override -->
<!-- templates/allauth/elements/button__mobile.html -->
<button type="{{ attrs.type|default:'button' }}" 
        class="mobile-button {{ attrs.class|default:'' }}"
        data-mobile="true">
    {{ slots.default|join:'' }}
</button>

Install with Tessl CLI