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:
@@ -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]))))))
|
||||
|
||||
Reference in New Issue
Block a user