Skip @apply validation if applyComplexClasses flag is enabled

master
Brad Cornes 2020-08-21 15:30:29 +01:00
parent 81446acdb3
commit 2aa39c84d9
6 changed files with 41 additions and 10 deletions

View File

@ -47,6 +47,7 @@ export default async function getClassNames(
let tailwindcss let tailwindcss
let browserslistModule let browserslistModule
let version let version
let featureFlags = { future: [], experimental: [] }
const configPaths = ( const configPaths = (
await glob(CONFIG_GLOB, { await glob(CONFIG_GLOB, {
@ -75,6 +76,10 @@ export default async function getClassNames(
browserslistModule = importFrom(tailwindBase, 'browserslist') browserslistModule = importFrom(tailwindBase, 'browserslist')
} catch (_) {} } catch (_) {}
try {
featureFlags = importFrom(tailwindBase, './lib/featureFlags.js').default
} catch (_) {}
const sepLocation = semver.gte(version, '0.99.0') const sepLocation = semver.gte(version, '0.99.0')
? ['separator'] ? ['separator']
: ['options', 'separator'] : ['options', 'separator']
@ -152,6 +157,7 @@ export default async function getClassNames(
tailwindcss, tailwindcss,
postcss, postcss,
}, },
featureFlags,
} }
} }

View File

@ -28,6 +28,8 @@ import {
getClassAttributeLexer, getClassAttributeLexer,
getComputedClassAttributeLexer, getComputedClassAttributeLexer,
} from '../util/lexers' } from '../util/lexers'
import { validateApply } from '../util/validateApply'
import { flagEnabled } from '../util/flagEnabled'
function completionsFromClassList( function completionsFromClassList(
state: State, state: State,
@ -193,16 +195,11 @@ function provideAtApplyCompletions(
end: position, end: position,
}, },
(item) => { (item) => {
// TODO: first line excludes all subtrees but there could _technically_ be if (item.kind === CompletionItemKind.Module) {
// valid apply-able class names in there. Will be correct in 99% of cases return flagEnabled(state, 'applyComplexClasses')
if (item.kind === CompletionItemKind.Module) return false }
let info = dlv(state.classNames.classNames, item.data) let validated = validateApply(state, item.data)
return ( return validated !== null && validated.isApplyable === true
!Array.isArray(info) &&
info.__source === 'utilities' &&
info.__context.length === 0 &&
info.__pseudo.length === 0
)
} }
) )
} }

View File

@ -3,6 +3,7 @@ import { InvalidApplyDiagnostic, DiagnosticKind } from './types'
import { Settings, State } from '../../util/state' import { Settings, State } from '../../util/state'
import { TextDocument, DiagnosticSeverity } from 'vscode-languageserver' import { TextDocument, DiagnosticSeverity } from 'vscode-languageserver'
import { validateApply } from '../../util/validateApply' import { validateApply } from '../../util/validateApply'
import { flagEnabled } from '../../util/flagEnabled'
export function getInvalidApplyDiagnostics( export function getInvalidApplyDiagnostics(
state: State, state: State,
@ -11,6 +12,7 @@ export function getInvalidApplyDiagnostics(
): InvalidApplyDiagnostic[] { ): InvalidApplyDiagnostic[] {
let severity = settings.lint.invalidApply let severity = settings.lint.invalidApply
if (severity === 'ignore') return [] if (severity === 'ignore') return []
if (flagEnabled(state, 'applyComplexClasses')) return []
const classNames = findClassNamesInRange(document, undefined, 'css') const classNames = findClassNamesInRange(document, undefined, 'css')

View File

@ -0,0 +1,20 @@
import { State } from './state'
const dlv = require('dlv')
export function flagEnabled(state: State, flag: string) {
if (state.featureFlags.future.includes(flag)) {
return (
state.config.future === 'all' ||
dlv(state.config, ['future', flag], false)
)
}
if (state.featureFlags.experimental.includes(flag)) {
return (
state.config.experimental === 'all' ||
dlv(state.config, ['experimental', flag], false)
)
}
return false
}

View File

@ -57,6 +57,7 @@ export type State = null | {
variants?: string[] variants?: string[]
classNames?: ClassNames classNames?: ClassNames
dependencies?: string[] dependencies?: string[]
featureFlags?: { future: string[]; experimental: string[] }
editor?: EditorState editor?: EditorState
error?: Error error?: Error
} }

View File

@ -1,5 +1,6 @@
import { State } from './state' import { State } from './state'
import { getClassNameMeta } from './getClassNameMeta' import { getClassNameMeta } from './getClassNameMeta'
import { flagEnabled } from './flagEnabled'
export function validateApply( export function validateApply(
state: State, state: State,
@ -8,6 +9,10 @@ export function validateApply(
const meta = getClassNameMeta(state, classNameOrParts) const meta = getClassNameMeta(state, classNameOrParts)
if (!meta) return null if (!meta) return null
if (flagEnabled(state, 'applyComplexClasses')) {
return { isApplyable: true }
}
const className = Array.isArray(classNameOrParts) const className = Array.isArray(classNameOrParts)
? classNameOrParts.join(state.separator) ? classNameOrParts.join(state.separator)
: classNameOrParts : classNameOrParts