File size: 10,629 Bytes
bc20498 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 |
// @ts-check
import bigSign from '../util/bigSign'
import { remapBitfield } from './remap-bitfield.js'
/**
* @typedef {'base' | 'defaults' | 'components' | 'utilities' | 'variants' | 'user'} Layer
*/
/**
* @typedef {object} VariantOption
* @property {number} id An unique identifier to identify `matchVariant`
* @property {function | undefined} sort The sort function
* @property {string|null} value The value we want to compare
* @property {string|null} modifier The modifier that was used (if any)
* @property {bigint} variant The variant bitmask
*/
/**
* @typedef {object} RuleOffset
* @property {Layer} layer The layer that this rule belongs to
* @property {Layer} parentLayer The layer that this rule originally belonged to. Only different from layer if this is a variant.
* @property {bigint} arbitrary 0n if false, 1n if true
* @property {bigint} variants Dynamic size. 1 bit per registered variant. 0n means no variants
* @property {bigint} parallelIndex Rule index for the parallel variant. 0 if not applicable.
* @property {bigint} index Index of the rule / utility in it's given *parent* layer. Monotonically increasing.
* @property {VariantOption[]} options Some information on how we can sort arbitrary variants
*/
export class Offsets {
constructor() {
/**
* Offsets for the next rule in a given layer
*
* @type {Record<Layer, bigint>}
*/
this.offsets = {
defaults: 0n,
base: 0n,
components: 0n,
utilities: 0n,
variants: 0n,
user: 0n,
}
/**
* Positions for a given layer
*
* @type {Record<Layer, bigint>}
*/
this.layerPositions = {
defaults: 0n,
base: 1n,
components: 2n,
utilities: 3n,
// There isn't technically a "user" layer, but we need to give it a position
// Because it's used for ordering user-css from @apply
user: 4n,
variants: 5n,
}
/**
* The total number of functions currently registered across all variants (including arbitrary variants)
*
* @type {bigint}
*/
this.reservedVariantBits = 0n
/**
* Positions for a given variant
*
* @type {Map<string, bigint>}
*/
this.variantOffsets = new Map()
}
/**
* @param {Layer} layer
* @returns {RuleOffset}
*/
create(layer) {
return {
layer,
parentLayer: layer,
arbitrary: 0n,
variants: 0n,
parallelIndex: 0n,
index: this.offsets[layer]++,
options: [],
}
}
/**
* @returns {RuleOffset}
*/
arbitraryProperty() {
return {
...this.create('utilities'),
arbitrary: 1n,
}
}
/**
* Get the offset for a variant
*
* @param {string} variant
* @param {number} index
* @returns {RuleOffset}
*/
forVariant(variant, index = 0) {
let offset = this.variantOffsets.get(variant)
if (offset === undefined) {
throw new Error(`Cannot find offset for unknown variant ${variant}`)
}
return {
...this.create('variants'),
variants: offset << BigInt(index),
}
}
/**
* @param {RuleOffset} rule
* @param {RuleOffset} variant
* @param {VariantOption} options
* @returns {RuleOffset}
*/
applyVariantOffset(rule, variant, options) {
options.variant = variant.variants
return {
...rule,
layer: 'variants',
parentLayer: rule.layer === 'variants' ? rule.parentLayer : rule.layer,
variants: rule.variants | variant.variants,
options: options.sort ? [].concat(options, rule.options) : rule.options,
// TODO: Technically this is wrong. We should be handling parallel index on a per variant basis.
// We'll take the max of all the parallel indexes for now.
// @ts-ignore
parallelIndex: max([rule.parallelIndex, variant.parallelIndex]),
}
}
/**
* @param {RuleOffset} offset
* @param {number} parallelIndex
* @returns {RuleOffset}
*/
applyParallelOffset(offset, parallelIndex) {
return {
...offset,
parallelIndex: BigInt(parallelIndex),
}
}
/**
* Each variant gets 1 bit per function / rule registered.
* This is because multiple variants can be applied to a single rule and we need to know which ones are present and which ones are not.
* Additionally, every unique group of variants is grouped together in the stylesheet.
*
* This grouping is order-independent. For instance, we do not differentiate between `hover:focus` and `focus:hover`.
*
* @param {string[]} variants
* @param {(name: string) => number} getLength
*/
recordVariants(variants, getLength) {
for (let variant of variants) {
this.recordVariant(variant, getLength(variant))
}
}
/**
* The same as `recordVariants` but for a single arbitrary variant at runtime.
* @param {string} variant
* @param {number} fnCount
*
* @returns {RuleOffset} The highest offset for this variant
*/
recordVariant(variant, fnCount = 1) {
this.variantOffsets.set(variant, 1n << this.reservedVariantBits)
// Ensure space is reserved for each "function" in the parallel variant
// by offsetting the next variant by the number of parallel variants
// in the one we just added.
// Single functions that return parallel variants are NOT handled separately here
// They're offset by 1 (or the number of functions) as usual
// And each rule returned is tracked separately since the functions are evaluated lazily.
// @see `RuleOffset.parallelIndex`
this.reservedVariantBits += BigInt(fnCount)
return {
...this.create('variants'),
variants: this.variantOffsets.get(variant),
}
}
/**
* @param {RuleOffset} a
* @param {RuleOffset} b
* @returns {bigint}
*/
compare(a, b) {
// Sort layers together
if (a.layer !== b.layer) {
return this.layerPositions[a.layer] - this.layerPositions[b.layer]
}
// When sorting the `variants` layer, we need to sort based on the parent layer as well within
// this variants layer.
if (a.parentLayer !== b.parentLayer) {
return this.layerPositions[a.parentLayer] - this.layerPositions[b.parentLayer]
}
// Sort based on the sorting function
for (let aOptions of a.options) {
for (let bOptions of b.options) {
if (aOptions.id !== bOptions.id) continue
if (!aOptions.sort || !bOptions.sort) continue
let maxFnVariant = max([aOptions.variant, bOptions.variant]) ?? 0n
// Create a mask of 0s from bits 1..N where N represents the mask of the Nth bit
let mask = ~(maxFnVariant | (maxFnVariant - 1n))
let aVariantsAfterFn = a.variants & mask
let bVariantsAfterFn = b.variants & mask
// If the variants the same, we _can_ sort them
if (aVariantsAfterFn !== bVariantsAfterFn) {
continue
}
let result = aOptions.sort(
{
value: aOptions.value,
modifier: aOptions.modifier,
},
{
value: bOptions.value,
modifier: bOptions.modifier,
}
)
if (result !== 0) return result
}
}
// Sort variants in the order they were registered
if (a.variants !== b.variants) {
return a.variants - b.variants
}
// Make sure each rule returned by a parallel variant is sorted in ascending order
if (a.parallelIndex !== b.parallelIndex) {
return a.parallelIndex - b.parallelIndex
}
// Always sort arbitrary properties after other utilities
if (a.arbitrary !== b.arbitrary) {
return a.arbitrary - b.arbitrary
}
// Sort utilities, components, etc… in the order they were registered
return a.index - b.index
}
/**
* Arbitrary variants are recorded in the order they're encountered.
* This means that the order is not stable between environments and sets of content files.
*
* In order to make the order stable, we need to remap the arbitrary variant offsets to
* be in alphabetical order starting from the offset of the first arbitrary variant.
*/
recalculateVariantOffsets() {
// Sort the variants by their name
let variants = Array.from(this.variantOffsets.entries())
.filter(([v]) => v.startsWith('['))
.sort(([a], [z]) => fastCompare(a, z))
// Sort the list of offsets
// This is not necessarily a discrete range of numbers which is why
// we're using sort instead of creating a range from min/max
let newOffsets = variants.map(([, offset]) => offset).sort((a, z) => bigSign(a - z))
// Create a map from the old offsets to the new offsets in the new sort order
/** @type {[bigint, bigint][]} */
let mapping = variants.map(([, oldOffset], i) => [oldOffset, newOffsets[i]])
// Remove any variants that will not move letting us skip
// remapping if everything happens to be in order
return mapping.filter(([a, z]) => a !== z)
}
/**
* @template T
* @param {[RuleOffset, T][]} list
* @returns {[RuleOffset, T][]}
*/
remapArbitraryVariantOffsets(list) {
let mapping = this.recalculateVariantOffsets()
// No arbitrary variants? Nothing to do.
// Everyhing already in order? Nothing to do.
if (mapping.length === 0) {
return list
}
// Remap every variant offset in the list
return list.map((item) => {
let [offset, rule] = item
offset = {
...offset,
variants: remapBitfield(offset.variants, mapping),
}
return [offset, rule]
})
}
/**
* @template T
* @param {[RuleOffset, T][]} list
* @returns {[RuleOffset, T][]}
*/
sort(list) {
list = this.remapArbitraryVariantOffsets(list)
return list.sort(([a], [b]) => bigSign(this.compare(a, b)))
}
}
/**
*
* @param {bigint[]} nums
* @returns {bigint|null}
*/
function max(nums) {
let max = null
for (const num of nums) {
max = max ?? num
max = max > num ? max : num
}
return max
}
/**
* A fast ASCII order string comparison function.
*
* Using `.sort()` without a custom compare function is faster
* But you can only use that if you're sorting an array of
* only strings. If you're sorting strings inside objects
* or arrays, you need must use a custom compare function.
*
* @param {string} a
* @param {string} b
*/
function fastCompare(a, b) {
let aLen = a.length
let bLen = b.length
let minLen = aLen < bLen ? aLen : bLen
for (let i = 0; i < minLen; i++) {
let cmp = a.charCodeAt(i) - b.charCodeAt(i)
if (cmp !== 0) return cmp
}
return aLen - bLen
}
|