tailwindcss Architecture Docs
Home / File/ legacy-utilities.ts — tailwindcss Source File

legacy-utilities.ts — tailwindcss Source File

Architecture documentation for legacy-utilities.ts, a typescript file in the tailwindcss codebase. 9 imports, 1 dependents.

File typescript Oxide Scanner 9 imports 1 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  964be968_c10d_edf8_0061_9ac8db9f9935["legacy-utilities.ts"]
  b9cbffa4_c352_cf3c_268f_cbb174fb3a47["ast.ts"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> b9cbffa4_c352_cf3c_268f_cbb174fb3a47
  1369a6dc_e395_347d_5d24_b88e22c5446d["decl"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> 1369a6dc_e395_347d_5d24_b88e22c5446d
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e["design-system.ts"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> bdedd2f6_da4b_69dc_e990_0814b59fbe6e
  665aa4ed_d86e_30e5_80d5_cd56b8ca8b62["DesignSystem"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> 665aa4ed_d86e_30e5_80d5_cd56b8ca8b62
  43fe4735_10e8_ed1d_6f4f_74b2008c1b00["infer-data-type.ts"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> 43fe4735_10e8_ed1d_6f4f_74b2008c1b00
  2b202e81_c79a_bf7e_74f9_fe9a98bbea87["isPositiveInteger"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> 2b202e81_c79a_bf7e_74f9_fe9a98bbea87
  09df19e7_0346_145d_40c4_e93ff14a2ff9["isValidSpacingMultiplier"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> 09df19e7_0346_145d_40c4_e93ff14a2ff9
  bb9924cc_8308_a1f9_0e30_76de45a64970["segment.ts"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> bb9924cc_8308_a1f9_0e30_76de45a64970
  c58cbb33_f3cc_0b4f_844a_15bf66a1dc61["segment"]
  964be968_c10d_edf8_0061_9ac8db9f9935 --> c58cbb33_f3cc_0b4f_844a_15bf66a1dc61
  2745c5e0_8ea4_a1c7_4f84_369746e3eb63["apply-compat-hooks.ts"]
  2745c5e0_8ea4_a1c7_4f84_369746e3eb63 --> 964be968_c10d_edf8_0061_9ac8db9f9935
  style 964be968_c10d_edf8_0061_9ac8db9f9935 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { decl } from '../ast'
import type { DesignSystem } from '../design-system'
import { isPositiveInteger, isValidSpacingMultiplier } from '../utils/infer-data-type'
import { segment } from '../utils/segment'

export function registerLegacyUtilities(designSystem: DesignSystem) {
  for (let [value, direction] of [
    ['t', 'top'],
    ['tr', 'top right'],
    ['r', 'right'],
    ['br', 'bottom right'],
    ['b', 'bottom'],
    ['bl', 'bottom left'],
    ['l', 'left'],
    ['tl', 'top left'],
  ]) {
    designSystem.utilities.suggest(`bg-gradient-to-${value}`, () => [])
    designSystem.utilities.static(`bg-gradient-to-${value}`, () => [
      decl('--tw-gradient-position', `to ${direction} in oklab`),
      decl('background-image', `linear-gradient(var(--tw-gradient-stops))`),
    ])
  }

  // Legacy `background-position` utilities for compatibility with v4.0 and earlier
  designSystem.utilities.suggest('bg-left-top', () => [])
  designSystem.utilities.static('bg-left-top', () => [decl('background-position', 'left top')])
  designSystem.utilities.suggest('bg-right-top', () => [])
  designSystem.utilities.static('bg-right-top', () => [decl('background-position', 'right top')])
  designSystem.utilities.suggest('bg-left-bottom', () => [])
  designSystem.utilities.static('bg-left-bottom', () => [
    decl('background-position', 'left bottom'),
  ])
  designSystem.utilities.suggest('bg-right-bottom', () => [])
  designSystem.utilities.static('bg-right-bottom', () => [
    decl('background-position', 'right bottom'),
  ])

  // Legacy `object-position` utilities for compatibility with v4.0 and earlier
  designSystem.utilities.suggest('object-left-top', () => [])
  designSystem.utilities.static('object-left-top', () => [decl('object-position', 'left top')])
  designSystem.utilities.suggest('object-right-top', () => [])
  designSystem.utilities.static('object-right-top', () => [decl('object-position', 'right top')])
  designSystem.utilities.suggest('object-left-bottom', () => [])
  designSystem.utilities.static('object-left-bottom', () => [
    decl('object-position', 'left bottom'),
  ])
  designSystem.utilities.suggest('object-right-bottom', () => [])
  designSystem.utilities.static('object-right-bottom', () => [
    decl('object-position', 'right bottom'),
  ])

  designSystem.utilities.suggest('max-w-screen', () => [])
  designSystem.utilities.functional('max-w-screen', (candidate) => {
    if (!candidate.value) return
    if (candidate.value.kind === 'arbitrary') return
    let value = designSystem.theme.resolve(candidate.value.value, ['--breakpoint'])
    if (!value) return
    return [decl('max-width', value)]
  })

// ... (120 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does legacy-utilities.ts do?
legacy-utilities.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the Oxide domain, Scanner subdomain.
What functions are defined in legacy-utilities.ts?
legacy-utilities.ts defines 1 function(s): registerLegacyUtilities.
What does legacy-utilities.ts depend on?
legacy-utilities.ts imports 9 module(s): DesignSystem, ast.ts, decl, design-system.ts, infer-data-type.ts, isPositiveInteger, isValidSpacingMultiplier, segment, and 1 more.
What files import legacy-utilities.ts?
legacy-utilities.ts is imported by 1 file(s): apply-compat-hooks.ts.
Where is legacy-utilities.ts in the architecture?
legacy-utilities.ts is located at packages/tailwindcss/src/compat/legacy-utilities.ts (domain: Oxide, subdomain: Scanner, directory: packages/tailwindcss/src/compat).

Analyze Your Own Codebase

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

Try Supermodel Free