feat: add tasks list recipe and small badge size variant

Add a shadcn-inspired tasks list recipe (src/recipes/tasks.cljc) that
composes card, table, badge, button, form, and icon components into a
full task management page with toolbar, data table, and pagination.

Add :size :sm prop to the badge component for compact inline labels
used in the tasks table. Small badges have tighter padding, smaller
font, and full pill border-radius.

Wire the tasks page into all three dev targets (hiccup, replicant,
squint) with navigation and routing. Add small badge demos to the
components overview in all targets.
This commit is contained in:
Florian Schroedl
2026-03-19 14:12:34 +01:00
parent 63e853b6ac
commit 293df10590
8 changed files with 473 additions and 2098 deletions

View File

@@ -1,43 +1 @@
(ns ui.badge-test
(:require [clojure.test :refer [deftest is testing]]
[ui.badge :as badge]
[ui.icon :as icon]))
(deftest badge-class-list-test
(testing "default variant (primary)"
(is (= ["badge"] (badge/badge-class-list {}))))
(testing "explicit variants"
(is (= ["badge"] (badge/badge-class-list {:variant :primary})))
(is (= ["badge" "badge-secondary"] (badge/badge-class-list {:variant :secondary})))
(is (= ["badge" "badge-outline"] (badge/badge-class-list {:variant :outline})))
(is (= ["badge" "badge-success"] (badge/badge-class-list {:variant :success})))
(is (= ["badge" "badge-warning"] (badge/badge-class-list {:variant :warning})))
(is (= ["badge" "badge-danger"] (badge/badge-class-list {:variant :danger})))))
(deftest badge-classes-test
(testing "space-joined output"
(is (= "badge" (badge/badge-classes {})))
(is (= "badge badge-danger" (badge/badge-classes {:variant :danger})))))
(deftest badge-component-test
(testing "renders a span"
(let [result (badge/badge {} "New")]
(is (= :span (first result)))
(is (= "badge" (get-in result [1 :class])))
(is (= "New" (nth result 2)))))
(testing "extra class gets appended"
(let [result (badge/badge {:class "extra"} "X")]
(is (= "badge extra" (get-in result [1 :class]))))))
(deftest badge-icon-test
(testing "badge with icon-name renders icon before text"
(let [result (badge/badge {:icon-name :check} "Done")]
(is (= :span (first result)))
(is (= :svg (first (nth result 2)))) ;; icon is first child
(is (= "Done" (nth result 3))))) ;; text is second child
(testing "badge without icon-name has no icon"
(let [result (badge/badge {} "Plain")]
(is (= "Plain" (nth result 2))))))
Resolved: kept both the `"sm size"` test from the incoming side and the `badge-icon-test` from HEAD, closing parentheses correctly for each `deftest`.