django-unfold 0.66.0__py3-none-any.whl → 0.67.0__py3-none-any.whl

unfold/static/unfold/js/app.js

@@ -416,6 +416,12 @@ const DEFAULT_CHART_OPTIONS = {
       pointBorderWidth: 0,
       pointStyle: false,
     },
+    pie: {
+      borderWidth: 0,
+    },
+    doughnut: {
+      borderWidth: 0,
+    },
   },
   plugins: {
     legend: {
@@ -436,6 +442,13 @@ const DEFAULT_CHART_OPTIONS = {
   },
   scales: {
     x: {
+      display: function (context) {
+        if (["pie", "doughnut", "radar"].includes(context.chart.config.type)) {
+          return false;
+        }
+
+        return true;
+      },
       border: {
         dash: [5, 5],
         dashOffset: 2,
@@ -456,6 +469,13 @@ const DEFAULT_CHART_OPTIONS = {
       },
     },
     y: {
+      display: function (context) {
+        if (["pie", "doughnut", "radar"].includes(context.chart.config.type)) {
+          return false;
+        }
+
+        return true;
+      },
       border: {
         dash: [5, 5],
         dashOffset: 5,
@@ -512,8 +532,17 @@ const renderCharts = () => {
     const borderColor = hasDarkClass ? baseColorDark : baseColorLight;
 
     for (const chart of charts) {
-      chart.options.scales.x.grid.color = borderColor;
-      chart.options.scales.y.grid.color = borderColor;
+      if (chart.options.scales.x) {
+        chart.options.scales.x.grid.color = borderColor;
+      }
+
+      if (chart.options.scales.y) {
+        chart.options.scales.y.grid.color = borderColor;
+      }
+
+      if (chart.options.scales.r) {
+        chart.options.scales.r.grid.color = borderColor;
+      }
       chart.update();
     }
   };
@@ -533,7 +562,17 @@ const renderCharts = () => {
     for (const key in parsedData.datasets) {
       const dataset = parsedData.datasets[key];
       const processColor = (colorProp) => {
-        if (dataset?.[colorProp]?.startsWith("var(")) {
+        if (Array.isArray(dataset?.[colorProp])) {
+          for (const [index, prop] of dataset?.[colorProp].entries()) {
+            if (prop.startsWith("var(")) {
+              const cssVar = prop.match(/var\((.*?)\)/)[1];
+              const color = getComputedStyle(document.documentElement)
+                .getPropertyValue(cssVar)
+                .trim();
+              dataset[colorProp][index] = color;
+            }
+          }
+        } else if (dataset?.[colorProp]?.startsWith("var(")) {
           const cssVar = dataset[colorProp].match(/var\((.*?)\)/)[1];
           const color = getComputedStyle(document.documentElement)
             .getPropertyValue(cssVar)
@@ -546,11 +585,30 @@ const renderCharts = () => {
       processColor("backgroundColor");
     }
 
+    CHART_OPTIONS = { ...DEFAULT_CHART_OPTIONS };
+    if (type === "radar") {
+      CHART_OPTIONS.scales = {
+        r: {
+          ticks: {
+            backdropColor: "transparent",
+          },
+          pointLabels: {
+            color: "#9ca3af",
+            font: {
+              size: 12,
+            },
+          },
+        },
+      };
+    }
+    Chart.defaults.font.family = "Inter";
+    Chart.defaults.font.size = 12;
+
     charts.push(
       new Chart(ctx, {
         type: type || "bar",
         data: parsedData,
-        options: options ? JSON.parse(options) : { ...DEFAULT_CHART_OPTIONS },
+        options: options ? JSON.parse(options) : { ...CHART_OPTIONS },
       })
     );
   }

unfold/static/unfold/js/select2.init.js

@@ -18,7 +18,7 @@
     return this;
   };
 
-  $.fn.djangoAdminSelect2 = function () {
+  $.fn.djangoFilterSelect2 = function () {
     $.each(this, function (i, element) {
       $(element).select2({
         ajax: {
@@ -40,13 +40,6 @@
   $(function () {
     $(".unfold-admin-autocomplete.admin-autocomplete").djangoCustomSelect2();
 
-    $(".admin-autocomplete")
-      .not(".unfold-admin-autocomplete")
-      .not("[name*=__prefix__]")
-      .djangoAdminSelect2();
-  });
-
-  document.addEventListener("formset:added", (event) => {
-    $(event.target).find(".admin-autocomplete").djangoAdminSelect2();
+    $(".unfold-filter-autocomplete.admin-autocomplete").djangoFilterSelect2();
   });
 }

unfold/styles.css

@@ -16,7 +16,7 @@
 @source inline("{md:,lg:,2xl:,}relative {md:,lg:,2xl:,}flex {md:,lg:,2xl:,}absolute {md:,lg:,2xl:,}sticky");
 @source inline("{-,}{lg:,}m{t,r,b,l,x,y,}-{0..24} {-,}{lg:,}p{t,r,b,l,x,y,}-{0..24}");
 @source inline("{md:,lg:,}border-{0,2} {md:,lg:,}border-{t,r,b,l}-{0,2}");
-@source inline("{hover:,dark:,}bg-primary-{50,{100..900..100},950}");
+@source inline("{!,}{hover:,dark:,}bg-primary-{50,{100..900..100},950}");
 @source inline("{hover:,dark:,}border-base-{50,{100..900..100},950} {hover:,dark:,}border-transparent");
 @source inline("{hover:,dark:,}bg-base-{50,{100..900..100},950}");
 @source inline("{md:,lg:,}{min-h,h,min-w,w}-{1..8} {md:,lg:,}w-{1/2,1/3,2/3,1/4,2/4,3/4,1/5,2/5,3/5,4/5,1/6,2/6,3/6,4/6,5/6,1/7,2/7,3/7,4/7,5/7,6/7}");
@@ -637,10 +637,6 @@ fieldset details[open] > summary:after {
   @apply bg-primary-600 border-0 h-1;
 }
 
-#changelist-filter .admin-numeric-filter-slider-tooltips {
-  @apply flex flex-row font-medium mb-5 space-x-4 text-base-500 text-sm;
-}
-
 /*******************************************************
  Trix
  *******************************************************/

unfold/templates/unfold/components/card.html

@@ -1,8 +1,17 @@
 <{% if href %}a href="{{ href }}"{% else %}div{% endif %} class="bg-white block flex flex-col grow overflow-hidden p-6 relative rounded-default shadow-xs dark:bg-base-900 dark:border-base-800 {% if not disable_border %}border border-base-200 {% else %}shadow-base-500/20{% endif %} {% if href %}cursor-pointer transition-all hover:border-base-300 hover:shadow-md dark:hover:border-base-700 dark:hover:shadow-base-800/50 {% endif %}{% if class %} {{ class }}{% endif %}">
+
 {% if title %}
-    <h2 class="border-b border-base-200 font-semibold mb-6 -mt-6 -mx-6 py-4 px-6 text-[15px] text-font-important-light dark:text-font-important-dark dark:border-base-800">
-        {{ title }}
-    </h2>
+    <div class="border-b border-base-200 flex flex-row items-center mb-6 -mt-6 -mx-6 py-4 px-6 dark:border-base-800">
+        <h2 class="font-semibold text-[15px] text-important">
+            {{ title }}
+        </h2>
+
+        {% if action %}
+            <div class="ml-auto">
+                {{ action }}
+            </div>
+        {% endif %}
+    </div>
 {% endif %}
 
 <div class="grow relative{% if icon %} pl-8{% endif %}">

unfold/templates/unfold/components/progress.html

@@ -15,9 +15,15 @@
         </div>
     {% endif %}
 
-    {% if value %}
-        <div class="bg-base-100 overflow-hidden rounded-default dark:bg-base-800">
-            <div class="h-1.5 bg-primary-600 rounded-default z-10 dark:bg-primary-500 {{ progress_class }}" title="{{ value }}%" style="width: {{ value }}%"></div>
+    {% if items or value %}
+        <div class="bg-base-100 flex flex-row overflow-hidden rounded-default dark:bg-base-800">
+            {% if items %}
+                {% for item in items %}
+                    <div class="h-1.5 bg-primary-600 z-10 dark:bg-primary-500 last:rounded-r-default {{ item.progress_class }}" title="{% if item.title %}{{ item.title }}: {% endif %}{{ item.value }}%" style="width: {{ item.value }}%"></div>
+                {% endfor %}
+            {% elif value %}
+                <div class="h-1.5 bg-primary-600 rounded-default z-10 last:rounded-r-default dark:bg-primary-500 {{ progress_class }}" title="{% if title %}{{ title }}: {% endif %}{{ value }}%" style="width: {{ value }}%"></div>
+            {% endif %}
         </div>
     {% endif %}
 </div>

unfold/templates/unfold/helpers/field_readonly_value.html

@@ -1 +1 @@
-<div class="readonly break-words {% if field.is_json %}max-w-4xl{% else %}max-w-2xl{% endif %} py-2 text-sm *:rounded-default {% if not adminform.model_admin.compressed_fields and not field.is_image %}bg-base-50 border border-base-200 font-medium px-3 rounded-default shadow-xs dark:border-base-700 dark:bg-base-800{% endif %} {% if field.is_image %}inline-block [&_img]:rounded-default py-0!{% endif %}">{% if value %}{{ value }}{% elif field.contents %}{{ field.contents }}{% else %}-{% endif %}</div>
+<div class="readonly break-words {% if field.is_json %}max-w-4xl{% else %}max-w-2xl{% endif %} py-2 text-sm *:rounded-default {% if not adminform.model_admin.compressed_fields and not field.is_image %}bg-base-50 border border-base-200 font-medium px-3 rounded-default shadow-xs dark:border-base-700 dark:bg-base-800{% endif %}">{% if value %}{{ value }}{% elif field.contents %}{% if field.is_file %}{% include "unfold/helpers/field_readonly_value_file.html" %}{% else %}{{ field.contents }}{% endif %}{% else %}-{% endif %}</div>

unfold/templates/unfold/helpers/field_readonly_value_file.html

@@ -0,0 +1,18 @@
+{% load i18n %}
+
+{% with url=field.url %}
+    {% if not url %}
+        <span class="flex items-center">-<span>
+    {% elif field.is_image %}
+        <a href="{{ url }}" target="_blank" class="block max-w-48">
+            <img src="{{ url }}" alt="{% trans 'Image preview' %}" class="block rounded-default" />
+        </a>
+    {% else %}
+        <a href="{{ url }}" target="_blank">
+            <span class="flex items-center gap-2">
+                <span class="text-primary-600 dark:text-primary-500">{% trans "Click to download" %}</span>
+                <span class="material-symbols-outlined text-base-400 dark:text-base-500">download</span>
+            </span>
+        </a>
+    {% endif %}
+{% endwith %}