|
| 1 | +import { ClassPartObject, createClassMap } from '../src/class-utils' |
| 2 | +import { getDefaultConfig } from '../src/default-config' |
| 3 | + |
| 4 | +test('class map has correct class groups at first part', () => { |
| 5 | + const classMap = createClassMap(getDefaultConfig()) |
| 6 | + |
| 7 | + const classGroupsByFirstPart = Object.fromEntries( |
| 8 | + Object.keys(classMap.nextPart) |
| 9 | + .sort() |
| 10 | + .map((key) => [ |
| 11 | + key, |
| 12 | + Array.from(getClassGroupsInClassPart(classMap.nextPart[key]!)).sort(), |
| 13 | + ]) |
| 14 | + ) |
| 15 | + |
| 16 | + expect(classMap.classGroupId).toBeUndefined() |
| 17 | + expect(classMap.validators).toHaveLength(0) |
| 18 | + expect(classGroupsByFirstPart).toEqual({ |
| 19 | + absolute: ['position'], |
| 20 | + align: ['vertival-alignment'], |
| 21 | + animate: ['animate'], |
| 22 | + antialiased: ['font-smoothing'], |
| 23 | + appearance: ['appearance'], |
| 24 | + auto: ['auto-cols', 'auto-rows'], |
| 25 | + backdrop: [ |
| 26 | + 'backdrop-blur', |
| 27 | + 'backdrop-brightness', |
| 28 | + 'backdrop-contrast', |
| 29 | + 'backdrop-filter', |
| 30 | + 'backdrop-grayscale', |
| 31 | + 'backdrop-hue-rotate', |
| 32 | + 'backdrop-invert', |
| 33 | + 'backdrop-opacity', |
| 34 | + 'backdrop-saturate', |
| 35 | + 'backdrop-sepia', |
| 36 | + ], |
| 37 | + bg: [ |
| 38 | + 'bg-attachment', |
| 39 | + 'bg-blend', |
| 40 | + 'bg-clip', |
| 41 | + 'bg-color', |
| 42 | + 'bg-image', |
| 43 | + 'bg-opacity', |
| 44 | + 'bg-origin', |
| 45 | + 'bg-position', |
| 46 | + 'bg-repeeat', |
| 47 | + 'bg-size', |
| 48 | + ], |
| 49 | + block: ['display'], |
| 50 | + blur: ['blur'], |
| 51 | + border: [ |
| 52 | + 'border-collapse', |
| 53 | + 'border-color', |
| 54 | + 'border-color-b', |
| 55 | + 'border-color-l', |
| 56 | + 'border-color-r', |
| 57 | + 'border-color-t', |
| 58 | + 'border-opacity', |
| 59 | + 'border-style', |
| 60 | + 'border-w', |
| 61 | + 'border-w-b', |
| 62 | + 'border-w-l', |
| 63 | + 'border-w-r', |
| 64 | + 'border-w-t', |
| 65 | + ], |
| 66 | + bottom: ['bottom'], |
| 67 | + box: ['box'], |
| 68 | + break: ['break'], |
| 69 | + brightness: ['brightness'], |
| 70 | + capitalize: ['text-transform'], |
| 71 | + caret: ['caret-color'], |
| 72 | + clear: ['clear'], |
| 73 | + col: ['col-end', 'col-start', 'col-start-end'], |
| 74 | + container: ['container'], |
| 75 | + content: ['align-content', 'content'], |
| 76 | + contents: ['display'], |
| 77 | + contrast: ['contrast'], |
| 78 | + cursor: ['cursor'], |
| 79 | + decoration: ['decoration'], |
| 80 | + delay: ['delay'], |
| 81 | + diagonal: ['fvn-fraction'], |
| 82 | + divide: [ |
| 83 | + 'divide-color', |
| 84 | + 'divide-opacity', |
| 85 | + 'divide-style', |
| 86 | + 'divide-x', |
| 87 | + 'divide-x-reverse', |
| 88 | + 'divide-y', |
| 89 | + 'divide-y-reverse', |
| 90 | + ], |
| 91 | + drop: ['drop-shadow'], |
| 92 | + duration: ['duration'], |
| 93 | + ease: ['ease'], |
| 94 | + fill: ['fill'], |
| 95 | + filter: ['filter'], |
| 96 | + fixed: ['position'], |
| 97 | + flex: ['display', 'flex', 'flex-direction', 'flex-grow', 'flex-shrink', 'flex-wrap'], |
| 98 | + float: ['float'], |
| 99 | + flow: ['display'], |
| 100 | + font: ['font-family', 'font-weight'], |
| 101 | + from: ['gradient-from'], |
| 102 | + gap: ['gap', 'gap-x', 'gap-y'], |
| 103 | + grayscale: ['grayscale'], |
| 104 | + grid: ['display', 'grid-cols', 'grid-flow', 'grid-rows'], |
| 105 | + h: ['h'], |
| 106 | + hidden: ['display'], |
| 107 | + hue: ['hue-rotate'], |
| 108 | + inline: ['display'], |
| 109 | + inset: ['inset', 'inset-x', 'inset-y'], |
| 110 | + invert: ['invert'], |
| 111 | + invisible: ['visibility'], |
| 112 | + isolate: ['isolation'], |
| 113 | + isolation: ['isolation'], |
| 114 | + italic: ['font-style'], |
| 115 | + items: ['align-items'], |
| 116 | + justify: ['justify-content', 'justify-items', 'justify-self'], |
| 117 | + leading: ['leading'], |
| 118 | + left: ['left'], |
| 119 | + line: ['text-decoration'], |
| 120 | + lining: ['fvn-figure'], |
| 121 | + list: ['display', 'list-style-position', 'list-style-type'], |
| 122 | + lowercase: ['text-transform'], |
| 123 | + m: ['m'], |
| 124 | + max: ['max-h', 'max-w'], |
| 125 | + mb: ['mb'], |
| 126 | + min: ['min-h', 'min-w'], |
| 127 | + mix: ['mix-blend'], |
| 128 | + ml: ['ml'], |
| 129 | + mr: ['mr'], |
| 130 | + mt: ['mt'], |
| 131 | + mx: ['mx'], |
| 132 | + my: ['my'], |
| 133 | + no: ['text-decoration'], |
| 134 | + normal: ['fvn-normal', 'text-transform'], |
| 135 | + not: ['font-style', 'sr'], |
| 136 | + object: ['object-fit', 'object-position'], |
| 137 | + oldstyle: ['fvn-figure'], |
| 138 | + opacity: ['opacity'], |
| 139 | + order: ['order'], |
| 140 | + ordinal: ['fvn-ordinal'], |
| 141 | + origin: ['transform-origin'], |
| 142 | + outline: ['outline'], |
| 143 | + overflow: ['overflow', 'overflow-x', 'overflow-y', 'text-overflow'], |
| 144 | + overscroll: ['overscroll', 'overscroll-x', 'overscroll-y'], |
| 145 | + p: ['p'], |
| 146 | + pb: ['pb'], |
| 147 | + pl: ['pl'], |
| 148 | + place: ['place-content', 'place-items', 'place-self'], |
| 149 | + placeholder: ['placeholder-color', 'placeholder-opacity'], |
| 150 | + pointer: ['pointer-events'], |
| 151 | + pr: ['pr'], |
| 152 | + proportional: ['fvn-spacing'], |
| 153 | + pt: ['pt'], |
| 154 | + px: ['px'], |
| 155 | + py: ['py'], |
| 156 | + relative: ['position'], |
| 157 | + resize: ['resize'], |
| 158 | + right: ['right'], |
| 159 | + ring: [ |
| 160 | + 'ring-color', |
| 161 | + 'ring-offset-color', |
| 162 | + 'ring-offset-w', |
| 163 | + 'ring-opacity', |
| 164 | + 'ring-w', |
| 165 | + 'ring-w-inset', |
| 166 | + ], |
| 167 | + rotate: ['rotate'], |
| 168 | + rounded: [ |
| 169 | + 'rounded', |
| 170 | + 'rounded-b', |
| 171 | + 'rounded-bl', |
| 172 | + 'rounded-br', |
| 173 | + 'rounded-l', |
| 174 | + 'rounded-r', |
| 175 | + 'rounded-t', |
| 176 | + 'rounded-tl', |
| 177 | + 'rounded-tr', |
| 178 | + ], |
| 179 | + row: ['row-end', 'row-start', 'row-start-end'], |
| 180 | + saturate: ['saturate'], |
| 181 | + scale: ['scale', 'scale-x', 'scale-y'], |
| 182 | + select: ['select'], |
| 183 | + self: ['align-self'], |
| 184 | + sepia: ['sepia'], |
| 185 | + shadow: ['shadow'], |
| 186 | + skew: ['skew-x', 'skew-y'], |
| 187 | + slashed: ['fvn-slashed-zero'], |
| 188 | + space: ['space-x', 'space-x-reverse', 'space-y', 'space-y-reverse'], |
| 189 | + sr: ['sr'], |
| 190 | + stacked: ['fvn-fraction'], |
| 191 | + static: ['position'], |
| 192 | + sticky: ['position'], |
| 193 | + stroke: ['stroke', 'stroke-w'], |
| 194 | + subpixel: ['font-smoothing'], |
| 195 | + table: ['display', 'table-layout'], |
| 196 | + tabular: ['fvn-spacing'], |
| 197 | + text: ['font-size', 'text-alignment', 'text-color', 'text-opacity'], |
| 198 | + to: ['gradient-to'], |
| 199 | + top: ['top'], |
| 200 | + tracking: ['tracking'], |
| 201 | + transform: ['transform'], |
| 202 | + transition: ['transition'], |
| 203 | + translate: ['translate-x', 'translate-y'], |
| 204 | + truncate: ['text-overflow'], |
| 205 | + underline: ['text-decoration'], |
| 206 | + uppercase: ['text-transform'], |
| 207 | + via: ['gradient-via'], |
| 208 | + visible: ['visibility'], |
| 209 | + w: ['w'], |
| 210 | + whitespace: ['whitespace'], |
| 211 | + z: ['z'], |
| 212 | + }) |
| 213 | +}) |
| 214 | + |
| 215 | +function getClassGroupsInClassPart(classPart: ClassPartObject): Set<string> { |
| 216 | + const { classGroupId, validators, nextPart } = classPart |
| 217 | + |
| 218 | + const classGroups = new Set<string>() |
| 219 | + |
| 220 | + if (classGroupId) { |
| 221 | + classGroups.add(classGroupId) |
| 222 | + } |
| 223 | + |
| 224 | + validators.forEach((validator) => classGroups.add(validator.classGroupId)) |
| 225 | + |
| 226 | + Object.values(nextPart).forEach((nextClassPart) => { |
| 227 | + getClassGroupsInClassPart(nextClassPart).forEach((classGroup) => { |
| 228 | + classGroups.add(classGroup) |
| 229 | + }) |
| 230 | + }) |
| 231 | + |
| 232 | + return classGroups |
| 233 | +} |
0 commit comments