Home / Function/ arbitraryValueToBareValueVariant() — tailwindcss Function Reference

arbitraryValueToBareValueVariant() — tailwindcss Function Reference

Architecture documentation for the arbitraryValueToBareValueVariant() function in canonicalize-candidates.ts from the tailwindcss codebase.

Function typescript OxideCore Extractor calls 2

Entity Profile

Dependency Diagram

graph TD
  cd080430_2569_72ec_53e4_15be9f1a9c2a["arbitraryValueToBareValueVariant()"]
  53ff5109_5a35_0396_6060_ad17d2d3ada8["walkVariants()"]
  cd080430_2569_72ec_53e4_15be9f1a9c2a -->|calls| 53ff5109_5a35_0396_6060_ad17d2d3ada8
  03b8d706_a876_a776_0056_186ced5d6067["segment()"]
  cd080430_2569_72ec_53e4_15be9f1a9c2a -->|calls| 03b8d706_a876_a776_0056_186ced5d6067
  style cd080430_2569_72ec_53e4_15be9f1a9c2a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/canonicalize-candidates.ts lines 1393–1455

function arbitraryValueToBareValueVariant(variant: Variant): Variant | Variant[] {
  let iterator = walkVariants(variant)
  for (let [variant] of iterator) {
    // Convert `data-[selected]` to `data-selected`
    if (
      variant.kind === 'functional' &&
      variant.root === 'data' &&
      variant.value?.kind === 'arbitrary' &&
      !variant.value.value.includes('=')
    ) {
      variant.value = {
        kind: 'named',
        value: variant.value.value,
      }
    }

    // Convert `aria-[selected="true"]` to `aria-selected`
    else if (
      variant.kind === 'functional' &&
      variant.root === 'aria' &&
      variant.value?.kind === 'arbitrary' &&
      (variant.value.value.endsWith('=true') ||
        variant.value.value.endsWith('="true"') ||
        variant.value.value.endsWith("='true'"))
    ) {
      let [key, _value] = segment(variant.value.value, '=')
      if (
        // aria-[foo~="true"]
        key[key.length - 1] === '~' ||
        // aria-[foo|="true"]
        key[key.length - 1] === '|' ||
        // aria-[foo^="true"]
        key[key.length - 1] === '^' ||
        // aria-[foo$="true"]
        key[key.length - 1] === '$' ||
        // aria-[foo*="true"]
        key[key.length - 1] === '*'
      ) {
        continue
      }

      variant.value = {
        kind: 'named',
        value: variant.value.value.slice(0, variant.value.value.indexOf('=')),
      }
    }

    // Convert `supports-[gap]` to `supports-gap`
    else if (
      variant.kind === 'functional' &&
      variant.root === 'supports' &&
      variant.value?.kind === 'arbitrary' &&
      /^[a-z-][a-z0-9-]*$/i.test(variant.value.value)
    ) {
      variant.value = {
        kind: 'named',
        value: variant.value.value,
      }
    }
  }

  return variant
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does arbitraryValueToBareValueVariant() do?
arbitraryValueToBareValueVariant() is a function in the tailwindcss codebase.
What does arbitraryValueToBareValueVariant() call?
arbitraryValueToBareValueVariant() calls 2 function(s): segment, walkVariants.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free