From db61c8891b06cdbc1d6301430f563d5fb800b1d9 Mon Sep 17 00:00:00 2001 From: Brad Cornes Date: Mon, 27 Mar 2023 18:56:02 +0100 Subject: [PATCH] Exclude classes in `blocklist` from IntelliSense (#746) --- .../tailwindcss-language-server/src/server.ts | 2 ++ .../src/completionProvider.ts | 16 ++++++++++++---- .../diagnostics/getCssConflictDiagnostics.ts | 2 +- .../getRecommendedVariantOrderDiagnostics.ts | 2 +- .../src/documentColorProvider.ts | 2 +- .../src/util/find.ts | 19 +++++++++++-------- .../src/util/state.ts | 1 + 7 files changed, 29 insertions(+), 15 deletions(-) diff --git a/packages/tailwindcss-language-server/src/server.ts b/packages/tailwindcss-language-server/src/server.ts index 6a27fb1..8495be0 100644 --- a/packages/tailwindcss-language-server/src/server.ts +++ b/packages/tailwindcss-language-server/src/server.ts @@ -1016,6 +1016,8 @@ async function createProjectService( try { state.config = resolveConfig.module(originalConfig) state.separator = state.config.separator + state.blocklist = Array.isArray(state.config.blocklist) ? state.config.blocklist : [] + delete state.config.blocklist if (state.jit) { state.jitContext = state.modules.jit.createContext.module(state) diff --git a/packages/tailwindcss-language-service/src/completionProvider.ts b/packages/tailwindcss-language-service/src/completionProvider.ts index f5ec919..595d930 100644 --- a/packages/tailwindcss-language-service/src/completionProvider.ts +++ b/packages/tailwindcss-language-service/src/completionProvider.ts @@ -242,7 +242,13 @@ export function completionsFromClassList( { isIncomplete: false, items: items.concat( - state.classList.map(([className, { color }], index) => { + state.classList.reduce((items, [className, { color }], index) => { + if ( + state.blocklist?.includes([...existingVariants, className].join(state.separator)) + ) { + return items + } + let kind: CompletionItemKind = color ? 16 : 21 let documentation: string | undefined @@ -250,13 +256,15 @@ export function completionsFromClassList( documentation = culori.formatRgb(color) } - return { + items.push({ label: className, kind, ...(documentation ? { documentation } : {}), sortText: naturalExpand(index, state.classList.length), - } as CompletionItem - }) + }) + + return items + }, [] as CompletionItem[]) ), }, { diff --git a/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts b/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts index 4459d24..a762871 100644 --- a/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts +++ b/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts @@ -20,7 +20,7 @@ export async function getCssConflictDiagnostics( const classLists = await findClassListsInDocument(state, document) classLists.forEach((classList) => { - const classNames = getClassNamesInClassList(classList) + const classNames = getClassNamesInClassList(classList, state.blocklist) classNames.forEach((className, index) => { if (state.jit) { diff --git a/packages/tailwindcss-language-service/src/diagnostics/getRecommendedVariantOrderDiagnostics.ts b/packages/tailwindcss-language-service/src/diagnostics/getRecommendedVariantOrderDiagnostics.ts index d6992c4..f1088e5 100644 --- a/packages/tailwindcss-language-service/src/diagnostics/getRecommendedVariantOrderDiagnostics.ts +++ b/packages/tailwindcss-language-service/src/diagnostics/getRecommendedVariantOrderDiagnostics.ts @@ -23,7 +23,7 @@ export async function getRecommendedVariantOrderDiagnostics( const classLists = await findClassListsInDocument(state, document) classLists.forEach((classList) => { - const classNames = getClassNamesInClassList(classList) + const classNames = getClassNamesInClassList(classList, state.blocklist) classNames.forEach((className) => { let { rules } = jit.generateRules(state, [className.className]) if (rules.length === 0) { diff --git a/packages/tailwindcss-language-service/src/documentColorProvider.ts b/packages/tailwindcss-language-service/src/documentColorProvider.ts index cab39e7..071580e 100644 --- a/packages/tailwindcss-language-service/src/documentColorProvider.ts +++ b/packages/tailwindcss-language-service/src/documentColorProvider.ts @@ -22,7 +22,7 @@ export async function getDocumentColors( let classLists = await findClassListsInDocument(state, document) classLists.forEach((classList) => { - let classNames = getClassNamesInClassList(classList) + let classNames = getClassNamesInClassList(classList, state.blocklist) classNames.forEach((className) => { let color = getColor(state, className.className) if (color === null || typeof color === 'string' || (color.alpha ?? 1) === 0) { diff --git a/packages/tailwindcss-language-service/src/util/find.ts b/packages/tailwindcss-language-service/src/util/find.ts index 1977ef8..f9ffd20 100644 --- a/packages/tailwindcss-language-service/src/util/find.ts +++ b/packages/tailwindcss-language-service/src/util/find.ts @@ -29,16 +29,15 @@ export function findLast(re: RegExp, str: string): RegExpMatchArray { return matches[matches.length - 1] } -export function getClassNamesInClassList({ - classList, - range, - important, -}: DocumentClassList): DocumentClassName[] { +export function getClassNamesInClassList( + { classList, range, important }: DocumentClassList, + blocklist: State['blocklist'] +): DocumentClassName[] { const parts = classList.split(/(\s+)/) const names: DocumentClassName[] = [] let index = 0 for (let i = 0; i < parts.length; i++) { - if (i % 2 === 0) { + if (i % 2 === 0 && !blocklist.includes(parts[i])) { const start = indexToPosition(classList, index) const end = indexToPosition(classList, index + parts[i].length) names.push({ @@ -77,7 +76,9 @@ export async function findClassNamesInRange( includeCustom: boolean = true ): Promise { const classLists = await findClassListsInRange(state, doc, range, mode, includeCustom) - return flatten(classLists.map(getClassNamesInClassList)) + return flatten( + classLists.map((classList) => getClassNamesInClassList(classList, state.blocklist)) + ) } export async function findClassNamesInDocument( @@ -85,7 +86,9 @@ export async function findClassNamesInDocument( doc: TextDocument ): Promise { const classLists = await findClassListsInDocument(state, doc) - return flatten(classLists.map(getClassNamesInClassList)) + return flatten( + classLists.map((classList) => getClassNamesInClassList(classList, state.blocklist)) + ) } export function findClassListsInCssRange(doc: TextDocument, range?: Range): DocumentClassList[] { diff --git a/packages/tailwindcss-language-service/src/util/state.ts b/packages/tailwindcss-language-service/src/util/state.ts index 4dde68f..5b8153a 100644 --- a/packages/tailwindcss-language-service/src/util/state.ts +++ b/packages/tailwindcss-language-service/src/util/state.ts @@ -99,6 +99,7 @@ export interface State { screens?: string[] variants?: Variant[] corePlugins?: string[] + blocklist?: unknown[] modules?: { tailwindcss?: { version: string; module: any } postcss?: { version: string; module: Postcss }