Add support for @source not

Author: thecrypticace

packages/tailwindcss-language-server/tests/completions/at-config.test.js

@@ -271,6 +271,51 @@ withFixture('v4/dependencies', (c) => {
     })
   })
 
+  test.concurrent('@source not', async ({ expect }) => {
+    let result = await completion({
+      text: '@source not "',
+      lang: 'css',
+      position: {
+        line: 0,
+        character: 13,
+      },
+    })
+
+    expect(result).toEqual({
+      isIncomplete: false,
+      items: [
+        {
+          label: 'index.html',
+          kind: 17,
+          data: expect.anything(),
+          textEdit: {
+            newText: 'index.html',
+            range: { start: { line: 0, character: 13 }, end: { line: 0, character: 13 } },
+          },
+        },
+        {
+          label: 'sub-dir/',
+          kind: 19,
+          command: { command: 'editor.action.triggerSuggest', title: '' },
+          data: expect.anything(),
+          textEdit: {
+            newText: 'sub-dir/',
+            range: { start: { line: 0, character: 13 }, end: { line: 0, character: 13 } },
+          },
+        },
+        {
+          label: 'tailwind.config.js',
+          kind: 17,
+          data: expect.anything(),
+          textEdit: {
+            newText: 'tailwind.config.js',
+            range: { start: { line: 0, character: 13 }, end: { line: 0, character: 13 } },
+          },
+        },
+      ],
+    })
+  })
+
   test.concurrent('@source directory', async ({ expect }) => {
     let result = await completion({
       text: '@source "./sub-dir/',
@@ -297,6 +342,32 @@ withFixture('v4/dependencies', (c) => {
     })
   })
 
+  test.concurrent('@source not directory', async ({ expect }) => {
+    let result = await completion({
+      text: '@source not "./sub-dir/',
+      lang: 'css',
+      position: {
+        line: 0,
+        character: 23,
+      },
+    })
+
+    expect(result).toEqual({
+      isIncomplete: false,
+      items: [
+        {
+          label: 'colors.js',
+          kind: 17,
+          data: expect.anything(),
+          textEdit: {
+            newText: 'colors.js',
+            range: { start: { line: 0, character: 23 }, end: { line: 0, character: 23 } },
+          },
+        },
+      ],
+    })
+  })
+
   test.concurrent('@import "…" source(…)', async ({ expect }) => {
     let result = await completion({
       text: '@import "tailwindcss" source("',

packages/tailwindcss-language-server/tests/completions/completions.test.js

@@ -485,7 +485,7 @@ withFixture('v4/basic', (c) => {
     })
 
     // Make sure `@slot` is NOT suggested by default
-    expect(result.items.length).toBe(7)
+    expect(result.items.length).toBe(8)
     expect(result.items).not.toEqual(
       expect.arrayContaining([
         expect.objectContaining({ kind: 14, label: '@slot', sortText: '-0000000' }),

packages/tailwindcss-language-server/tests/document-links/document-links.test.js

@@ -131,6 +131,32 @@ withFixture('v4/basic', (c) => {
     ],
   })
 
+  testDocumentLinks('source not: file exists', {
+    text: '@source not "index.html";',
+    lang: 'css',
+    expected: [
+      {
+        target: `file://${path
+          .resolve('./tests/fixtures/v4/basic/index.html')
+          .replace(/@/g, '%40')}`,
+        range: { start: { line: 0, character: 12 }, end: { line: 0, character: 24 } },
+      },
+    ],
+  })
+
+  testDocumentLinks('source not: file does not exist', {
+    text: '@source not "does-not-exist.html";',
+    lang: 'css',
+    expected: [
+      {
+        target: `file://${path
+          .resolve('./tests/fixtures/v4/basic/does-not-exist.html')
+          .replace(/@/g, '%40')}`,
+        range: { start: { line: 0, character: 12 }, end: { line: 0, character: 33 } },
+      },
+    ],
+  })
+
   testDocumentLinks('Directories in source(…) show links', {
     text: `
       @import "tailwindcss" source("../../");

packages/tailwindcss-language-server/tests/hover/hover.test.js

@@ -293,6 +293,33 @@ withFixture('v4/basic', (c) => {
     },
   })
 
+  testHover('css @source not glob expansion', {
+    exact: true,
+    lang: 'css',
+    text: `@source not "../{app,components}/**/*.jsx"`,
+    position: { line: 0, character: 23 },
+    expected: {
+      contents: {
+        kind: 'markdown',
+        value: [
+          '**Expansion**',
+          '```plaintext',
+          '- ../app/**/*.jsx',
+          '- ../components/**/*.jsx',
+          '```',
+        ].join('\n'),
+      },
+      range: {
+        start: { line: 0, character: 12 },
+        end: { line: 0, character: 42 },
+      },
+    },
+    expectedRange: {
+      start: { line: 2, character: 9 },
+      end: { line: 2, character: 18 },
+    },
+  })
+
   testHover('--theme() works inside @media queries', {
     lang: 'tailwindcss',
     text: `@media (width>=--theme(--breakpoint-xl)) { .foo { color: red; } }`,

packages/tailwindcss-language-service/src/completionProvider.ts

@@ -1872,6 +1872,17 @@ function provideCssDirectiveCompletions(
       },
     })
 
+    items.push({
+      label: '@source not',
+      documentation: {
+        kind: 'markdown' as typeof MarkupKind.Markdown,
+        value: `Use the \`@source not\` directive to ignore files when scanning.\n\n[Tailwind CSS Documentation](${docsUrl(
+          state.version,
+          'functions-and-directives/#source',
+        )})`,
+      },
+    })
+
     items.push({
       label: '@plugin',
       documentation: {

packages/tailwindcss-language-service/src/completions/file-paths.test.ts

@@ -15,6 +15,7 @@ test('Detecting v3 directives that point to files', async () => {
   // The following are not supported in v3
   await expect(find('@plugin "./')).resolves.toEqual(null)
   await expect(find('@source "./')).resolves.toEqual(null)
+  await expect(find('@source not "./')).resolves.toEqual(null)
   await expect(find('@import "tailwindcss" source("./')).resolves.toEqual(null)
   await expect(find('@tailwind utilities source("./')).resolves.toEqual(null)
 })
@@ -42,6 +43,12 @@ test('Detecting v4 directives that point to files', async () => {
     suggest: 'source',
   })
 
+  await expect(find('@source not "./')).resolves.toEqual({
+    directive: 'source',
+    partial: './',
+    suggest: 'source',
+  })
+
   await expect(find('@import "tailwindcss" source("./')).resolves.toEqual({
     directive: 'import',
     partial: './',

packages/tailwindcss-language-service/src/completions/file-paths.ts

@@ -1,7 +1,8 @@
 import type { State } from '../util/state'
 
 // @config, @plugin, @source
-const PATTERN_CUSTOM_V4 = /@(?<directive>config|plugin|source)\s*(?<partial>'[^']*|"[^"]*)$/
+const PATTERN_CUSTOM_V4 =
+  /@(?<directive>config|plugin|source)(?<not>\s+not)?\s*(?<partial>'[^']*|"[^"]*)$/
 const PATTERN_CUSTOM_V3 = /@(?<directive>config)\s*(?<partial>'[^']*|"[^"]*)$/
 
 // @import … source('…')
@@ -26,6 +27,7 @@ export async function findFileDirective(state: State, text: string): Promise<Fil
 
     if (!match) return null
 
+    let isNot = match.groups.not !== undefined && match.groups.not.length > 0
     let directive = match.groups.directive
     let partial = match.groups.partial?.slice(1) ?? '' // remove leading quote
 
@@ -40,6 +42,7 @@ export async function findFileDirective(state: State, text: string): Promise<Fil
     // If we're looking at @import … source('…') or @tailwind … source('…') then
     // we want to list directories instead of files
     else if (directive === 'import' || directive === 'tailwind') {
+      if (isNot) return null
       suggest = 'directory'
     }
 
@@ -49,6 +52,9 @@ export async function findFileDirective(state: State, text: string): Promise<Fil
   let match = text.match(PATTERN_CUSTOM_V3)
   if (!match) return null
 
+  let isNot = match.groups.not !== undefined && match.groups.not.length > 0
+  if (isNot) return null
+
   let directive = match.groups.directive
   let partial = match.groups.partial.slice(1) // remove leading quote
 

packages/tailwindcss-language-service/src/diagnostics/getInvalidSourceDiagnostics.ts

@@ -14,7 +14,7 @@ const PATTERN_UTIL_SOURCE =
 
 // @source …
 const PATTERN_AT_SOURCE =
-  /(?:\s|^)@(?<directive>source)\s*(?<source>'[^']*'?|"[^"]*"?|[a-z]*|\)|;)/dg
+  /(?:\s|^)@(?<directive>source)\s*(?<not>not)?\s*(?<source>'[^']*'?|"[^"]*"?|[a-z]*|\)|;)/dg
 
 const HAS_DRIVE_LETTER = /^[A-Z]:/
 

packages/tailwindcss-language-service/src/documentLinksProvider.ts

@@ -18,7 +18,7 @@ export function getDocumentLinks(
   if (state.v4) {
     patterns.push(
       /@plugin\s*(?<path>'[^']+'|"[^"]+")/g,
-      /@source\s*(?<path>'[^']+'|"[^"]+")/g,
+      /@source(?:\s+not)?\s*(?<path>'[^']+'|"[^"]+")/g,
       /@import\s*('[^']*'|"[^"]*")\s*(layer\([^)]+\)\s*)?source\((?<path>'[^']*'?|"[^"]*"?)/g,
       /@reference\s*('[^']*'|"[^"]*")\s*source\((?<path>'[^']*'?|"[^"]*"?)/g,
       /@tailwind\s*utilities\s*source\((?<path>'[^']*'?|"[^"]*"?)/g,

packages/tailwindcss-language-service/src/hoverProvider.ts

@@ -168,7 +168,7 @@ async function provideSourceGlobHover(
 
   let text = getTextWithoutComments(document, 'css', range)
 
-  let pattern = /@source\s*(?<path>'[^']+'|"[^"]+")/dg
+  let pattern = /@source(?:\s+not)?\s*(?<path>'[^']+'|"[^"]+")/dg
 
   for (let match of findAll(pattern, text)) {
     let path = match.groups.path.slice(1, -1)