Type-safe, composable class variants for Gleam

feat: add ability to add variants with list and ability to add custom class string

Changed files
+77 -2
src
test
+1 -1
gleam.toml
··· 1 1 name = "gva" 2 2 description = "Type-safe, composable class variants for Gleam" 3 - version = "1.2.0" 3 + version = "1.3.0" 4 4 target = "javascript" 5 5 licences = ["Apache-2.0"] 6 6 repository = { type = "github", user = "dinkelspiel", repo = "gva" }
+11
src/gva.gleam
··· 15 15 Class(..class, using: [key, ..class.using]) 16 16 } 17 17 18 + pub fn with_all(class: Class(a), keys: List(a)) -> Class(a) { 19 + case keys { 20 + [key, ..keys] -> with_all(Class(..class, using: [key, ..class.using]), keys) 21 + [] -> class 22 + } 23 + } 24 + 25 + pub fn class(class: Class(a), class_string: String) -> Class(a) { 26 + Class(..class, default: class.default <> " " <> class_string) 27 + } 28 + 18 29 // Build a list of keys to a class string 19 30 fn do_build( 20 31 resolver: fn(a) -> String,
+65 -1
test/gva_test.gleam
··· 1 1 import glailwind_merge 2 2 import gleeunit 3 - import gva.{build, gva, with} 3 + import gva.{build, class, gva, with, with_all} 4 4 5 5 pub fn main() -> Nil { 6 6 gleeunit.main() ··· 49 49 |> build() 50 50 51 51 assert glailwind_merge.tw_merge([class]) == "text-white text-md bg-slate-600" 52 + 53 + Nil 54 + } 55 + 56 + pub fn basic_2_test() -> Nil { 57 + let button = 58 + gva( 59 + "text-white", 60 + resolver: fn(in: BasicKey) { 61 + case in { 62 + BasicSize(size) -> 63 + case size { 64 + BasicSmall -> "text-sm" 65 + BasicMedium -> "text-md" 66 + } 67 + BasicVariant(variant) -> 68 + case variant { 69 + BasicPrimary -> "bg-slate-950" 70 + BasicSecondary -> "bg-slate-600" 71 + } 72 + } 73 + }, 74 + defaults: [], 75 + ) 76 + 77 + let class = 78 + button 79 + |> with_all([BasicSize(BasicMedium), BasicVariant(BasicSecondary)]) 80 + |> build() 81 + 82 + assert glailwind_merge.tw_merge([class]) == "text-white text-md bg-slate-600" 83 + 84 + Nil 85 + } 86 + 87 + pub fn basic_3_test() -> Nil { 88 + let button = 89 + gva( 90 + "text-white", 91 + resolver: fn(in: BasicKey) { 92 + case in { 93 + BasicSize(size) -> 94 + case size { 95 + BasicSmall -> "text-sm" 96 + BasicMedium -> "text-md" 97 + } 98 + BasicVariant(variant) -> 99 + case variant { 100 + BasicPrimary -> "bg-slate-950" 101 + BasicSecondary -> "bg-slate-600" 102 + } 103 + } 104 + }, 105 + defaults: [], 106 + ) 107 + 108 + let class = 109 + button 110 + |> with_all([BasicSize(BasicMedium), BasicVariant(BasicSecondary)]) 111 + |> class("opacity-50") 112 + |> build() 113 + 114 + assert glailwind_merge.tw_merge([class]) 115 + == "text-white opacity-50 text-md bg-slate-600" 52 116 53 117 Nil 54 118 }