accrete 0.0.99__tar.gz → 0.0.101__tar.gz

{accrete-0.0.99 → accrete-0.0.101}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.3
 Name: accrete
-Version: 0.0.99
+Version: 0.0.101
 Summary: Django Shared Schema Multi Tenant
 Author-email: Benedikt Jilek <benedikt.jilek@pm.me>
 License: Copyright (c) 2023 Benedikt Jilek

{accrete-0.0.99 → accrete-0.0.101}/accrete/contrib/ui/__init__.py

@@ -29,3 +29,5 @@ from .elements import (
     TableFieldType,
     Icon
 )
+
+from . import components

accrete-0.0.101/accrete/contrib/ui/components/__init__.py

@@ -0,0 +1 @@
+from .search_select import ModelSearchSelectOptions

accrete-0.0.101/accrete/contrib/ui/components/search_select.py

@@ -0,0 +1,18 @@
+from dataclasses import dataclass
+
+from django.db.models import QuerySet
+from django.template.loader import render_to_string
+from django.utils.safestring import mark_safe
+
+
+@dataclass
+class ModelSearchSelectOptions:
+
+    queryset: QuerySet
+    template: str = 'ui/components/model_search_select_options.html'
+
+    def get_context(self):
+        return {'options': self.queryset}
+
+    def __str__(self):
+        return mark_safe(render_to_string(self.template, self.get_context()))

accrete-0.0.101/accrete/contrib/ui/forms/widgets.py

@@ -0,0 +1,101 @@
+from django.forms import widgets
+from django.shortcuts import resolve_url
+
+
+class ModelSearchSelect(widgets.NumberInput):
+    template_name = 'ui/widgets/model_search_select.html'
+    option_template_name = 'ui/widgets/model_search_select_options.html'
+    input_type = 'number'
+
+    def __init__(
+        self,
+        search_url: str,
+        search_parameter: str = 'search',
+        limit: int | None = 5,
+        hx_trigger_on_change: bool = False,
+        choices=()
+    ):
+        super().__init__()
+        self.search_url = search_url
+        self.search_parameter = search_parameter
+        self.limit = limit
+        self.hx_trigger_on_change = hx_trigger_on_change
+        self.choices = choices
+
+    def get_context(self, name, value, attrs):
+        qs = self.choices.queryset
+        if self.limit:
+            qs = qs[:self.limit]
+
+        context = {
+            "widget": {
+                "name": name,
+                "is_hidden": self.is_hidden,
+                "required": self.is_required,
+                "value": self.format_value(value or ''),
+                'value_display': self.value_display(value),
+                "attrs": self.build_attrs(self.attrs, attrs),
+                "template_name": self.template_name,
+                'search_url': self.search_url,
+                'search_parameter': self.search_parameter,
+                'hx_trigger_on_change': self.hx_trigger_on_change
+            },
+            'options': qs
+        }
+        return context
+
+    def format_value(self, value):
+        res = super().format_value(value)
+        return res or ''
+
+    def value_display(self, value):
+        if value is None:
+            return ''
+        try:
+            value = int(value)
+        except ValueError:
+            return ''
+        return str(self.choices.queryset.get(pk=value))
+
+
+class ModelSearchSelectMulti(widgets.SelectMultiple):
+    template_name = 'ui/widgets/model_search_select_multi.html'
+    option_template_name = 'ui/widgets/model_search_select_options.html'
+    input_type = 'number'
+
+    def __init__(
+        self,
+        search_url: str,
+        search_parameter: str = 'search',
+        limit: int | None = 5,
+        hx_trigger_on_change: bool = False,
+        choices=()
+    ):
+        super().__init__()
+        self.search_url = search_url
+        self.search_parameter = search_parameter
+        self.limit = limit
+        self.hx_trigger_on_change = hx_trigger_on_change
+        self.choices = choices
+
+    def get_context(self, name, value, attrs):
+        qs = self.choices.queryset
+        if self.limit:
+            qs = qs[:self.limit]
+
+        context = {
+            "widget": {
+                "name": name,
+                "is_hidden": self.is_hidden,
+                "required": self.is_required,
+                "value": self.format_value(value),
+                "attrs": self.build_attrs(self.attrs, attrs),
+                "template_name": self.template_name,
+                'search_url': resolve_url(self.search_url),
+                'search_parameter': self.search_parameter,
+                'hx_trigger_on_change': self.hx_trigger_on_change
+            },
+            'options': qs,
+            'selected': self.choices.queryset.filter(pk__in=value) if value else qs.none()
+        }
+        return context

accrete-0.0.101/accrete/contrib/ui/templates/django/forms/widgets/date.html

@@ -0,0 +1,9 @@
+<div class="field">
+    <p class="control">
+        <input class="{% if widget.type != 'checkbox' %}input{% endif %} is-fullwidth"
+               name="{{ widget.name }}" type="{{ widget.type }}"
+               {% if widget.value != None %} value="{{ widget.value|stringformat:'s' }}"{% endif %}
+               {% include "django/forms/widgets/attrs.html" %}
+        >
+    </p>
+</div>

accrete-0.0.101/accrete/contrib/ui/templates/ui/components/model_search_select_multi_selected_options.html

@@ -0,0 +1,3 @@
+{% for obj in selected %}
+    <option selected value="{{ obj.pk }}"></option>
+{% endfor %}

accrete-0.0.101/accrete/contrib/ui/templates/ui/components/model_search_select_multi_tags.html

@@ -0,0 +1,6 @@
+{% for obj in selected %}
+    <span class="tag" style="white-space: normal; height: fit-content">
+        {{ obj }}
+        <button class="delete is-small" type="button" data-value="{{ obj.pk }}"></button>
+    </span>
+{% endfor %}

accrete-0.0.101/accrete/contrib/ui/templates/ui/components/model_search_select_options.html

@@ -0,0 +1,3 @@
+{% for option in options %}
+    <button type="button" class="dropdown-item px-1" value="{{ option.pk }}" style="word-wrap: break-word; width: 100%; white-space: normal">{{ option }}</button>
+{% endfor %}

{accrete-0.0.99 → accrete-0.0.101}/accrete/contrib/ui/templates/ui/layout.html

@@ -11,7 +11,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     {% block favicon %}<link rel="icon" type="image/svg" href="{% static 'icons/accrete.svg' %}"/>{% endblock %}
     {% block style %}
-        <link rel="stylesheet" type="text/css" href="{% static "css/accrete.css" %}?v=0.0.93">
+        <link rel="stylesheet" type="text/css" href="{% static "css/accrete.css" %}?v=0.0.100">
         <link rel="stylesheet" type="text/css" href="{% static "css/icons.css" %}">
         <link rel="stylesheet" type="text/css" href="{% static "css/fa.css" %}">
     {% endblock %}

{accrete-0.0.99 → accrete-0.0.101}/accrete/contrib/ui/templates/ui/partials/modal_form.html

@@ -3,6 +3,7 @@
 <div id="modal-{{ form_id }}" class="modal {% block modal_form_class %}is-active{% endblock %}"
      hx-swap="outerHTML" 
      hx-target="#modal-{{ form_id }}"
+     hx-on:delete="removeModal('modal-{{ form_id }}')"
      {% if blocking %}
         hx-indicator="#modal-{{ form_id }}-indicator"
         hx-disabled-elt="#modal-{{ form_id }}-background"

accrete-0.0.101/accrete/contrib/ui/templates/ui/widgets/model_search_select.html

@@ -0,0 +1,53 @@
+{% load static %}
+{% load i18n %}
+
+
+<script>
+    function modelSearchSelect() {
+        return {
+            open: false,
+            
+            shouldClose(event) {
+                return event.relatedTarget === this.$refs.dropdownContent || this.$refs.dropdownContent.contains(event.relatedTarget)
+            }
+        }
+    }
+</script>
+
+
+<div class="field select" x-data="modelSearchSelect()" @click.outside="open = false">
+    <input id="id_{{ widget.name }}_value" hidden="hidden" type="{{ widget.type }}" name="{{ widget.name }}" x-ref="inputValue" aria-label="inputValue"
+           value="{{ widget.value }}"
+    >
+    <input id="id_{{ widget.name }}_display" class="input" type="text" readonly x-ref="inputDisplay" value="{{ widget.value_display }}" aria-label="inputDisplay"
+           style="padding-right: 30px"
+           x-on:focus="open = true;"
+           x-on:keydown="if ($event.keyCode == 27) {document.activeElement.blur()} else if ($event.keyCode != 9) {$refs.searchInput.focus();}"
+           x-on:focusout="open = shouldClose($event)"
+    >
+    <div style="position: relative; z-index: 90;">
+        <div x-show="open" class="box pt-1" x-ref="dropdownContent" tabindex="-1" x-transition>
+            <input id="id_{{ widget.name }}_search" type="search" autocomplete="off" class="input" x-ref="searchInput" aria-label="search"
+                   name="{{ widget.search_parameter }}"
+                   placeholder="{% translate 'Type to search' %}"
+                   x-on:keydown="if ($event.keyCode == 27) {document.activeElement.blur()}"
+                   x-on:focusout="open = shouldClose($event)"
+                   hx-get="{{ widget.search_url }}"
+                   hx-trigger="input changed delay:500ms, search"
+                   hx-target="#{{ widget.name }}_dropdown_items"
+            >
+            <div x-on:click="$refs.inputValue.setAttribute('value', $event.target.value); $refs.inputDisplay.value = $event.target.innerText; htmx.trigger($refs.inputValue, 'submit'); open = false; {% if widget.hx_trigger_on_change %}htmx.trigger('#id_{{ widget.name }}_value', 'change');{% endif %}"
+                 x-on:keydown="if ($event.keyCode == 27) {document.activeElement.blur()} else if ($event.keyCode != 9 && $event.keyCode != 13) {$refs.searchInput.focus();}"
+            >
+                {% if not widget.required %}
+                    <div class="hoverable" style="max-height: 200px; width: 100%; overflow-y: auto;">
+                        <button type="button" class="dropdown-item px-1" value="" style="word-wrap: break-word; width: 100%; white-space: normal">---------</button>    
+                    </div>
+                {% endif %}
+                <div id="{{ widget.name }}_dropdown_items" class="hoverable" style="max-height: 200px; width: 100%; overflow-y: auto;">
+                    {% include 'ui/components/model_search_select_options.html' %}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

accrete-0.0.101/accrete/contrib/ui/templates/ui/widgets/model_search_select_multi.html

@@ -0,0 +1,67 @@
+{% load i18n %}
+
+<div class="" x-data="{open: false, shouldClose(event) {return event.relatedTarget == $refs.dropdownContent || $refs.dropdownContent.contains(event.relatedTarget);} }"
+     @click.outside="open = false" style="width: 100%"
+>
+    <select multiple id="{{ widget.attrs.id }}" hidden="hidden" name="{{ widget.name }}" aria-label="{{ widget.name }}" x-ref="inputValue">
+        {% include 'ui/components/model_search_select_multi_selected_options.html' %}
+    </select>
+    <div id="{{ widget.attrs.id }}_display" class="input select py-1 pl-1" tabindex="0" x-ref="inputDisplay" aria-label="inputDisplay"
+         style="padding-right: 30px; border-radius: 0; border-top: 0; border-right:0; border-left: 0; min-height: var(--bulma-control-height); height: fit-content; width: 100%"
+         x-on:focus="open = true;"
+         x-on:keydown="if ($event.keyCode == 27) {document.activeElement.blur()} else if ($event.keyCode != 9) {$refs.searchInput.focus();}"
+         x-on:focusout="open = shouldClose($event)"
+    >
+        <div class="tags" x-ref="inputDisplayTags" 
+             @click="
+                if ($event.target.classList.contains('delete')) {
+                    let val = $event.target.getAttribute('data-value');
+                    $refs.inputValue.querySelector(`option[value=${CSS.escape(val)}]`).remove(); 
+                    $event.target.parentElement.remove();
+                }
+             ">
+            {% include 'ui/components/model_search_select_multi_tags.html' %}
+        </div>
+    </div>
+    <div style="position: relative; z-index: 90;">
+        <div x-show="open" class="box pt-1" x-ref="dropdownContent" tabindex="-1" x-transition style="position: absolute; min-width: 100%">
+            <input id="id_{{ widget.name }}_search" type="search" autocomplete="off" class="input" x-ref="searchInput" aria-label="search"
+                   name="{{ widget.search_parameter }}"
+                   placeholder="{% translate 'Type to search' %}"
+                   x-on:keydown="if ($event.keyCode == 27) {document.activeElement.blur()}"
+                   x-on:focusout="open = shouldClose($event)"
+                   hx-get="{{ widget.search_url }}"
+                   hx-trigger="input changed delay:500ms, search"
+                   hx-target="#{{ widget.name }}_dropdown_items"
+            >
+            <div id="{{ widget.name }}_dropdown_items" class="hoverable" style="max-height: 200px; width: 100%; overflow-y: auto;"
+                 x-on:click="
+                    if (! $refs.inputValue.querySelectorAll(`option[value=${CSS.escape($event.target.value)}]`).length) {
+                        let option = document.createElement('option');
+                        let tag = document.createElement('span');
+                        let delButton = document.createElement('button');
+                        option.setAttribute('selected', '');
+                        option.value = $event.target.value;
+                        tag.classList.add('tag');
+                        tag.innerText = $event.target.innerText;
+                        tag.style.whiteSpace = 'normal';
+                        tag.style.height = 'fit-content';
+                        delButton.classList.add('delete', 'is-small');
+                        delButton.type = 'button';
+                        delButton.setAttribute('data-value', $event.target.value);
+                        tag.appendChild(delButton);
+                        $refs.inputValue.appendChild(option);
+                        $refs.inputDisplayTags.appendChild(tag);
+                    };
+                    {% if widget.hx_trigger_on_change %}htmx.trigger('#{{ widget.attrs.id }}_value', 'change');{% endif %}
+                 "
+                 x-on:keydown="
+                    if ($event.keyCode == 27) {document.activeElement.blur()} 
+                    else if ($event.keyCode != 9 && $event.keyCode != 13) {$refs.searchInput.focus();}
+                 "
+            >
+                {% include 'ui/components/model_search_select_options.html' %}
+            </div>
+        </div>
+    </div>
+</div>

{accrete-0.0.99 → accrete-0.0.101}/accrete/contrib/ui/templatetags/accrete_ui.py

@@ -120,7 +120,7 @@ def timedelta_cast(td: timedelta, code: str) -> str | None:
 
 
 @register.filter(name='weekday')
-def datetime_to_weekday(dt: datetime|date, default=None):
+def datetime_to_weekday(dt: datetime|date, default=None) -> str:
     if dt is None:
         return default
     mapping = {

{accrete-0.0.99 → accrete-0.0.101}/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = 'hatchling.build'
 
 [project]
 name = 'accrete'
-version = '0.0.99'
+version = '0.0.101'
 authors = [
   { name='Benedikt Jilek', email='benedikt.jilek@pm.me' },
 ]