Home / File/ replace-shadow-colors.ts — tailwindcss Source File

replace-shadow-colors.ts — tailwindcss Source File

Architecture documentation for replace-shadow-colors.ts, a typescript file in the tailwindcss codebase. 2 imports, 2 dependents.

File typescript Oxide Extractor 2 imports 2 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  5b848d60_40d3_e198_b396_38cb0e6eeec4["replace-shadow-colors.ts"]
  bb9924cc_8308_a1f9_0e30_76de45a64970["segment.ts"]
  5b848d60_40d3_e198_b396_38cb0e6eeec4 --> bb9924cc_8308_a1f9_0e30_76de45a64970
  c58cbb33_f3cc_0b4f_844a_15bf66a1dc61["segment"]
  5b848d60_40d3_e198_b396_38cb0e6eeec4 --> c58cbb33_f3cc_0b4f_844a_15bf66a1dc61
  ffde8eb7_7def_91ee_918c_be4f250f76a2["utilities.ts"]
  ffde8eb7_7def_91ee_918c_be4f250f76a2 --> 5b848d60_40d3_e198_b396_38cb0e6eeec4
  5137203f_bfa9_d8df_2dab_017f40b22bfc["replace-shadow-colors.test.ts"]
  5137203f_bfa9_d8df_2dab_017f40b22bfc --> 5b848d60_40d3_e198_b396_38cb0e6eeec4
  style 5b848d60_40d3_e198_b396_38cb0e6eeec4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { segment } from './segment'

const KEYWORDS = new Set(['inset', 'inherit', 'initial', 'revert', 'unset'])
const LENGTH = /^-?(\d+|\.\d+)(.*?)$/g

export function replaceShadowColors(input: string, replacement: (color: string) => string) {
  let shadows = segment(input, ',').map((shadow) => {
    shadow = shadow.trim()
    let parts = segment(shadow, ' ').filter((part) => part.trim() !== '')
    let color = null
    let offsetX = null
    let offsetY = null

    for (let part of parts) {
      if (KEYWORDS.has(part)) {
        continue
      } else if (LENGTH.test(part)) {
        if (offsetX === null) {
          offsetX = part
        } else if (offsetY === null) {
          offsetY = part
        }

        // Reset index, since the regex is stateful.
        LENGTH.lastIndex = 0
      } else if (color === null) {
        color = part
      }
    }

    // If the x and y offsets were not detected, the shadow is either invalid or
    // using a variable to represent more than one field in the shadow value, so
    // we can't know what to replace.
    if (offsetX === null || offsetY === null) return shadow

    let replacementColor = replacement(color ?? 'currentcolor')

    if (color !== null) {
      // If a color was found, replace the color.
      return shadow.replace(color, replacementColor)
    }
    // If no color was found, assume the shadow is relying on the browser
    // default shadow color and append the replacement color.
    return `${shadow} ${replacementColor}`
  })

  return shadows.join(', ')
}

Domain

Subdomains

Dependencies

Frequently Asked Questions

What does replace-shadow-colors.ts do?
replace-shadow-colors.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the Oxide domain, Extractor subdomain.
What functions are defined in replace-shadow-colors.ts?
replace-shadow-colors.ts defines 1 function(s): replaceShadowColors.
What does replace-shadow-colors.ts depend on?
replace-shadow-colors.ts imports 2 module(s): segment, segment.ts.
What files import replace-shadow-colors.ts?
replace-shadow-colors.ts is imported by 2 file(s): replace-shadow-colors.test.ts, utilities.ts.
Where is replace-shadow-colors.ts in the architecture?
replace-shadow-colors.ts is located at packages/tailwindcss/src/utils/replace-shadow-colors.ts (domain: Oxide, subdomain: Extractor, directory: packages/tailwindcss/src/utils).

Analyze Your Own Codebase

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

Try Supermodel Free