js-config.test.ts — tailwindcss Source File

Architecture documentation for js-config.test.ts, a typescript file in the tailwindcss codebase. 4 imports, 0 dependents.

File typescript Oxide 4 imports

Entity Profile

Oxide→ js-config.test.ts — tailwindcss Source File

Dependency Diagram

graph LR
  177a61bf_e6e1_f970_cb0f_1b015efc2f71["js-config.test.ts"]
  7600373a_3645_efb1_bcbb_e7c3fcb813ac["utils.ts"]
  177a61bf_e6e1_f970_cb0f_1b015efc2f71 --> 7600373a_3645_efb1_bcbb_e7c3fcb813ac
  44ea7d66_6ac1_15b9_1cc7_d01c23a5ee04["test"]
  177a61bf_e6e1_f970_cb0f_1b015efc2f71 --> 44ea7d66_6ac1_15b9_1cc7_d01c23a5ee04
  89aef3dd_1eed_c141_d425_b8949215a653["node:path"]
  177a61bf_e6e1_f970_cb0f_1b015efc2f71 --> 89aef3dd_1eed_c141_d425_b8949215a653
  f1e05e5f_c1b2_a3f5_b2e8_3317b9243ac3["vitest"]
  177a61bf_e6e1_f970_cb0f_1b015efc2f71 --> f1e05e5f_c1b2_a3f5_b2e8_3317b9243ac3
  style 177a61bf_e6e1_f970_cb0f_1b015efc2f71 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import path from 'node:path'
import { describe } from 'vitest'
import { css, html, json, test, ts } from '../utils'

test(
  `upgrade JS config files with flat theme values, darkMode, and content fields`,
  {
    fs: {
      'package.json': json`
        {
          "dependencies": {
            "tailwindcss": "^3",
            "@tailwindcss/upgrade": "workspace:^"
          }
        }
      `,
      'tailwind.config.ts': ts`
        import { type Config } from 'tailwindcss'
        import defaultTheme from 'tailwindcss/defaultTheme'

        module.exports = {
          darkMode: 'selector',
          content: ['./src/**/*.{html,js}', './node_modules/my-external-lib/**/*.{html}'],
          theme: {
            boxShadow: {
              sm: '0 2px 6px rgb(15 23 42 / 0.08)',
            },
            colors: {
              red: {
                400: '#f87171',
                500: 'red',
              },
              superRed: '#ff0000',
              steel: 'rgb(70 130 180 / <alpha-value>)',
              smoke: 'rgba(245, 245, 245, var(--smoke-alpha, <alpha-value>))',
            },
            ringColor: {
              DEFAULT: '#c0ffee',
            },
            opacity: {
              superOpaque: '0.95',
            },
            fontSize: {
              xs: ['0.75rem', { lineHeight: '1rem' }],
              sm: ['0.875rem', { lineHeight: '1.5rem' }],
              base: ['1rem', { lineHeight: '2rem' }],
              lg: ['1.125rem', '2.5rem'],
              xl: ['1.5rem', '3rem', 'invalid'],
              '2xl': ['2rem'],
            },
            width: {
              px: '1px',
              auto: 'auto',
              1: '0.25rem',
              1.5: '0.375rem',
              2: '0.5rem',
              2.5: '0.625rem',
              3: '0.75rem',
              3.5: '0.875rem',
              4: '1rem',
// ... (2029 more lines)