feat(card): add card-list component with full and inset dividers

Adds `card-list` and `card-list-item` to the card module for rendering
a list of items inside a single card background with border separators.

The `:divider` prop controls separator style:
- `:full` (default) — borders go edge-to-edge
- `:inset` — borders are inset from edges by `--size-4`h
This commit is contained in:
Florian Schroedl
2026-03-11 18:29:39 +01:00
parent e356bc2e6a
commit 64bf5e029c
6 changed files with 180 additions and 3 deletions

View File

@@ -34,3 +34,38 @@
(let [result (card/card-footer {} "Actions")]
(is (= :footer (first result)))
(is (= "card-footer" (get-in result [1 :class]))))))
;; ─── Card List ─────────────────────────────────────────────────
(deftest card-list-class-list-test
(testing "default divider is full"
(is (= ["card-list"] (card/card-list-class-list {}))))
(testing "explicit full divider"
(is (= ["card-list"] (card/card-list-class-list {:divider :full}))))
(testing "inset divider adds modifier"
(is (= ["card-list" "card-list-inset"] (card/card-list-class-list {:divider :inset})))))
(deftest card-list-test
(testing "renders a div with role list"
(let [result (card/card-list {} "Item")]
(is (= :div (first result)))
(is (= "card-list" (get-in result [1 :class])))
(is (= "list" (get-in result [1 :role])))
(is (= "Item" (nth result 2)))))
(testing "inset divider class"
(let [result (card/card-list {:divider :inset} "Item")]
(is (= "card-list card-list-inset" (get-in result [1 :class])))))
(testing "extra class gets appended"
(let [result (card/card-list {:class "extra"} "Item")]
(is (= "card-list extra" (get-in result [1 :class]))))))
(deftest card-list-item-test
(testing "renders a div with role listitem"
(let [result (card/card-list-item {} "Content")]
(is (= :div (first result)))
(is (= "card-list-item" (get-in result [1 :class])))
(is (= "listitem" (get-in result [1 :role])))
(is (= "Content" (nth result 2)))))
(testing "extra class gets appended"
(let [result (card/card-list-item {:class "extra"} "Content")]
(is (= "card-list-item extra" (get-in result [1 :class]))))))