v0.2.0

.gitignore

@@ -2,5 +2,6 @@ dist
 node_modules
 .vscode-test/
 .vsix
+*.vsix
 .DS_Store
 .rts2_cache_cjs

.vscodeignore

@@ -1,9 +1,9 @@
-.vscode/**
+*
-.vscode-test/**
+*/**
-out/test/**
+**/.DS_Store
-out/**/*.map
+
-src/**
+!package.json
-img/**
+!README.md
-.gitignore
+!dist/index.js
-tsconfig.json
+!dist/server/index.js
-vsc-extension-quickstart.md
+!resources/**/*

package-lock.json

@@ -1,13 +1,19 @@
 {
   "name": "vscode-tailwindcss",
-  "version": "0.1.16",
+  "version": "0.2.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
+    "@types/node": {
+      "version": "11.13.5",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-11.13.5.tgz",
+      "integrity": "sha512-/OMMBnjVtDuwX1tg2pkYVSqRIDSmNTnvVvmvP/2xiMAAWf4a5+JozrApCrO4WCAILmXVxfNoQ3E+0HJbNpFVGg==",
+      "dev": true
+    },
     "@zeit/ncc": {
-      "version": "0.8.1",
+      "version": "0.17.4",
-      "resolved": "https://registry.npmjs.org/@zeit/ncc/-/ncc-0.8.1.tgz",
+      "resolved": "https://registry.npmjs.org/@zeit/ncc/-/ncc-0.17.4.tgz",
-      "integrity": "sha512-AFgYOmh8gVRd8Bzkvygvbhdq6DayCc+O++bcGr+TFQcsHLWa6Lx9L55VVGU8sVEJibX/6BkDgcrJFZ3vYbh/ww==",
+      "integrity": "sha512-d931CjCTzfSC4VYDYgvvBTzhTGv7ExjumFTe8RVbXKAKoTjqOA8ZWDndqjSEbTeQTggyxCcCHm7HpZ28lScKnQ==",
       "dev": true
     },
     "ajv": {
@@ -240,6 +246,7 @@
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/color/-/color-3.1.0.tgz",
       "integrity": "sha512-CwyopLkuRYO5ei2EpzpIh6LqJMt6Mt+jZhO5VI5f/wJLZriXQE32/SSqzmrh+QB+AZT81Cj8yv+7zwToW8ahZg==",
+      "dev": true,
       "requires": {
         "color-convert": "^1.9.1",
         "color-string": "^1.5.2"
@@ -249,6 +256,7 @@
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
       "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "dev": true,
       "requires": {
         "color-name": "1.1.3"
       }
@@ -256,12 +264,14 @@
     "color-name": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
+      "dev": true
     },
     "color-string": {
       "version": "1.5.3",
       "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.5.3.tgz",
       "integrity": "sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==",
+      "dev": true,
       "requires": {
         "color-name": "^1.0.0",
         "simple-swizzle": "^0.2.2"
@@ -354,7 +364,8 @@
     "dlv": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.2.tgz",
-      "integrity": "sha512-xxD4VSH67GbRvSGUrckvha94RD7hjgOH7rqGxiytLpkaeMvixOHFZTGFK6EkIm3T761OVHT8ABHmGkq9gXgu6Q=="
+      "integrity": "sha512-xxD4VSH67GbRvSGUrckvha94RD7hjgOH7rqGxiytLpkaeMvixOHFZTGFK6EkIm3T761OVHT8ABHmGkq9gXgu6Q==",
+      "dev": true
     },
     "duplexer": {
       "version": "0.1.1",
@@ -1194,7 +1205,8 @@
     "os-tmpdir": {
       "version": "1.0.2",
       "resolved": "http://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
+      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
+      "dev": true
     },
     "path-dirname": {
       "version": "1.0.2",
@@ -1417,12 +1429,14 @@
     "semver": {
       "version": "5.6.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.6.0.tgz",
-      "integrity": "sha512-RS9R6R35NYgQn++fkDWaOmqGoj4Ek9gGs+DPxNUZKuwE183xjJroKvyo1IzVFeXvUrvmALy6FWD5xrdJT25gMg=="
+      "integrity": "sha512-RS9R6R35NYgQn++fkDWaOmqGoj4Ek9gGs+DPxNUZKuwE183xjJroKvyo1IzVFeXvUrvmALy6FWD5xrdJT25gMg==",
+      "dev": true
     },
     "simple-swizzle": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
       "integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=",
+      "dev": true,
       "requires": {
         "is-arrayish": "^0.3.1"
       },
@@ -1430,7 +1444,8 @@
         "is-arrayish": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
-          "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
+          "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==",
+          "dev": true
         }
       }
     },
@@ -1530,6 +1545,12 @@
         "has-flag": "^2.0.0"
       }
     },
+    "tailwindcss-language-server": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/tailwindcss-language-server/-/tailwindcss-language-server-0.0.1.tgz",
+      "integrity": "sha512-lMoncp8ICeUA1kLVaiKARRUKQxRndKtIelydoMgg3P2ZjAIfcptN8Nin848+VClr2wGoM3+9RZ71sDG1YrnX1g==",
+      "dev": true
+    },
     "tar": {
       "version": "2.2.1",
       "resolved": "http://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
@@ -1571,6 +1592,7 @@
       "version": "0.0.33",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
       "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==",
+      "dev": true,
       "requires": {
         "os-tmpdir": "~1.0.2"
       }
@@ -1832,12 +1854,14 @@
     "vscode-jsonrpc": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-4.0.0.tgz",
-      "integrity": "sha512-perEnXQdQOJMTDFNv+UF3h1Y0z4iSiaN9jIlb0OqIYgosPCZGYh/MCUlkFtV2668PL69lRDO32hmvL2yiidUYg=="
+      "integrity": "sha512-perEnXQdQOJMTDFNv+UF3h1Y0z4iSiaN9jIlb0OqIYgosPCZGYh/MCUlkFtV2668PL69lRDO32hmvL2yiidUYg==",
+      "dev": true
     },
     "vscode-languageclient": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/vscode-languageclient/-/vscode-languageclient-5.2.1.tgz",
       "integrity": "sha512-7jrS/9WnV0ruqPamN1nE7qCxn0phkH5LjSgSp9h6qoJGoeAKzwKz/PF6M+iGA/aklx4GLZg1prddhEPQtuXI1Q==",
+      "dev": true,
       "requires": {
         "semver": "^5.5.0",
         "vscode-languageserver-protocol": "3.14.1"
@@ -1847,6 +1871,7 @@
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.14.1.tgz",
       "integrity": "sha512-IL66BLb2g20uIKog5Y2dQ0IiigW0XKrvmWiOvc0yXw80z3tMEzEnHjaGAb3ENuU7MnQqgnYJ1Cl2l9RvNgDi4g==",
+      "dev": true,
       "requires": {
         "vscode-jsonrpc": "^4.0.0",
         "vscode-languageserver-types": "3.14.0"
@@ -1855,7 +1880,8 @@
     "vscode-languageserver-types": {
       "version": "3.14.0",
       "resolved": "https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.14.0.tgz",
-      "integrity": "sha512-lTmS6AlAlMHOvPQemVwo3CezxBp0sNB95KNPkqp3Nxd5VFEnuG1ByM0zlRWos0zjO3ZWtkvhal0COgiV1xIA4A=="
+      "integrity": "sha512-lTmS6AlAlMHOvPQemVwo3CezxBp0sNB95KNPkqp3Nxd5VFEnuG1ByM0zlRWos0zjO3ZWtkvhal0COgiV1xIA4A==",
+      "dev": true
     },
     "wrappy": {
       "version": "1.0.2",

package.json

@@ -2,7 +2,7 @@
   "name": "vscode-tailwindcss",
   "displayName": "Tailwind CSS IntelliSense",
   "description": "Tailwind CSS class name completion",
-  "version": "0.1.16",
+  "version": "0.2.0",
   "publisher": "bradlc",
   "engines": {
     "vscode": "^1.30.0"
@@ -13,7 +13,7 @@
   "galleryBanner": {
     "color": "#f1f5f8"
   },
-  "icon": "icon.png",
+  "icon": "resources/icon.png",
   "keywords": [
     "tailwind",
     "tailwindcss",
@@ -30,7 +30,7 @@
     "grammars": [
       {
         "scopeName": "source.css.tailwind",
-        "path": "./syntaxes/tailwind.tmLanguage.json",
+        "path": "./resources/syntaxes/tailwind.tmLanguage.json",
         "injectTo": [
           "source.css",
           "source.css.scss",
@@ -39,48 +39,46 @@
         ]
       }
     ],
-    "views": {
+    "configuration": {
-      "explorer": [
+      "type": "object",
-        {
+      "title": "Tailwind CSS IntelliSense configuration",
-          "id": "tailwindcssConfigExplorer",
+      "properties": {
-          "name": "Tailwind CSS Configuration"
+        "tailwindCSS.emmetCompletions": {
+          "type": "boolean",
+          "default": false,
+          "description": "Enable class name completions for Emmet-style syntax"
         }
-      ]
-    },
-    "commands": [
-      {
-        "command": "tailwindcss.goToDefinition",
-        "title": "Go To Definition"
       }
-    ]
+    }
   },
   "preview": true,
   "scripts": {
     "vscode:prepublish": "npm run build",
-    "build": "ncc build src/index.ts --out dist --minify --external vscode",
+    "build": "ncc build src/index.ts --out dist --minify --external vscode && ncc build src/server.ts --out dist/server --minify",
     "watch": "ncc build src/index.ts --out dist --watch --external vscode",
+    "start": "npm run watch",
     "postinstall": "node ./node_modules/vscode/bin/install",
     "test": "npm run build && node ./node_modules/vscode/bin/test"
   },
-  "author": "Brad Cornes <bradlc41@gmail.com>",
+  "author": "Brad Cornes <hello@bradley.dev>",
   "license": "MIT",
   "homepage": "https://github.com/bradlc/vscode-tailwindcss/blob/master/README.md",
   "bugs": {
     "url": "https://github.com/bradlc/vscode-tailwindcss/issues",
-    "email": "bradlc41@gmail.com"
+    "email": "hello@bradley.dev"
   },
   "repository": {
     "type": "git",
     "url": "https://github.com/bradlc/vscode-tailwindcss.git"
   },
-  "dependencies": {
+  "devDependencies": {
+    "@types/node": "^11.13.5",
+    "@zeit/ncc": "^0.17.4",
     "color": "^3.1.0",
     "dlv": "^1.1.2",
+    "tailwindcss-language-server": "0.0.1",
     "tmp": "0.0.33",
+    "vscode": "^1.1.26",
     "vscode-languageclient": "^5.2.1"
-  },
-  "devDependencies": {
-    "@zeit/ncc": "^0.8.1",
-    "vscode": "^1.1.26"
   }
 }

resources/syntaxes/tailwind.tmLanguage.json

@@ -0,0 +1,75 @@
+{
+  "scopeName": "source.css.tailwind",
+  "fileTypes": [],
+  "injectionSelector": "meta.property-list.css, meta.property-list.scss",
+  "name": "TailwindCSS",
+  "patterns": [
+    {
+      "begin": "^\\s*(@)apply\\b",
+      "beginCaptures": {
+        "0": {
+          "name": "keyword.control.at-rule.apply.tailwind"
+        },
+        "1": {
+          "name": "punctuation.definition.keyword.tailwind"
+        }
+      },
+      "end": ";",
+      "endCaptures": {
+        "0": {
+          "name": "punctuation.terminator.rule.tailwind"
+        }
+      },
+      "patterns": [
+        {
+          "begin": "(?x)\n(?=\n  (?:\\|)?                    # Possible anonymous namespace prefix\n  (?:\n    [-\\[:.*\\#a-zA-Z_]       # Valid selector character\n    |\n    [^\\x00-\\x7F]            # Which can include non-ASCII symbols\n    |\n    \\\\                      # Or an escape sequence\n    (?:[0-9a-fA-F]{1,6}|.)\n  )\n)",
+          "end": "(?=\\s*[;])",
+          "patterns": [
+            {
+              "match": "!\\s*important(?![\\w-])",
+              "name": "keyword.other.important.tailwind"
+            },
+            {
+              "captures": {
+                "1": {
+                  "name": "punctuation.definition.entity.tailwind"
+                },
+                "2": {
+                  "patterns": [
+                    {
+                      "include": "source.css#escapes"
+                    }
+                  ]
+                }
+              },
+              "match": "(?x)\n(\\.)?                                  # Valid class-name\n(\n  (?: [-a-zA-Z_0-9]|[^\\x00-\\x7F]     # Valid identifier characters\n    | \\\\(?:[0-9a-fA-F]{1,6}|.)       # Escape sequence\n  )+\n)                                      # Followed by either:\n(?= $                                  # - End of the line\n  | [\\s,.\\#)\\[:{>;+~|]               # - Another selector\n  | /\\*                               # - A block comment\n)",
+              "name": "entity.other.attribute-name.class.tailwind"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "begin": "(?i)(?<![\\w-])(config|theme)(\\()",
+      "beginCaptures": {
+        "1": {
+          "name": "support.function.config.tailwind"
+        },
+        "2": {
+          "name": "punctuation.section.function.begin.bracket.round.tailwind"
+        }
+      },
+      "end": "\\)",
+      "endCaptures": {
+        "0": {
+          "name": "punctuation.section.function.end.bracket.round.tailwind"
+        }
+      },
+      "patterns": [
+        {
+          "include": "source.css#property-values"
+        }
+      ]
+    }
+  ]
+}

src/index.ts

@@ -7,29 +7,61 @@ import {
   window as Window,
   ExtensionContext,
   TextDocument,
-  TextEditor,
   OutputChannel,
   WorkspaceFolder,
-  Uri,
+  Uri
-  commands,
-  Selection,
-  Position,
-  Range,
-  TextEditorRevealType
 } from 'vscode'
 
 import {
   LanguageClient,
   LanguageClientOptions,
-  TransportKind,
+  TransportKind
-  Location
 } from 'vscode-languageclient'
 
-import { createTreeView } from './treeView'
+import * as path from 'path'
 
 const CONFIG_GLOB =
   '**/{tailwind,tailwind.config,tailwind-config,.tailwindrc}.js'
-let LANGUAGES: string[] = ['html', 'css']
+export const CSS_LANGUAGES: string[] = [
+  'css',
+  'less',
+  'postcss',
+  'sass',
+  'scss',
+  'stylus',
+  'vue'
+]
+export const JS_LANGUAGES: string[] = [
+  'javascript',
+  'javascriptreact',
+  'reason',
+  'typescriptreact'
+]
+export const HTML_LANGUAGES: string[] = [
+  'blade',
+  'edge',
+  'ejs',
+  'erb',
+  'haml',
+  'handlebars',
+  'html',
+  'HTML (Eex)',
+  'jade',
+  'leaf',
+  'markdown',
+  'njk',
+  'nunjucks',
+  'php',
+  'razor',
+  'slim',
+  'svelte',
+  'twig',
+  'vue',
+  ...JS_LANGUAGES
+]
+export const LANGUAGES: string[] = [...CSS_LANGUAGES, ...HTML_LANGUAGES].filter(
+  (val, index, arr) => arr.indexOf(val) === index
+)
 
 let defaultClient: LanguageClient
 let clients: Map<string, LanguageClient> = new Map()
@@ -72,19 +104,18 @@ function getOuterMostWorkspaceFolder(folder: WorkspaceFolder): WorkspaceFolder {
 }
 
 export async function activate(context: ExtensionContext) {
-  // let module = context.asAbsolutePath(path.join('server', 'out', 'server.js'))
+  let module = context.asAbsolutePath(path.join('dist', 'server', 'index.js'))
-  let module = '/Users/brad/Code/tailwindcss-language-server/dist/index.js'
   let outputChannel: OutputChannel = Window.createOutputChannel(
-    'lsp-multi-server-example'
+    'tailwindcss-language-server'
   )
 
   async function didOpenTextDocument(document: TextDocument): Promise<void> {
-    // if (
+    if (
-    //   document.uri.scheme !== 'file' ||
+      document.uri.scheme !== 'file' ||
-    //   LANGUAGES.indexOf(document.languageId) === -1
+      LANGUAGES.indexOf(document.languageId) === -1
-    // ) {
+    ) {
-    //   return
+      return
-    // }
+    }
 
     let uri = document.uri
     let folder = Workspace.getWorkspaceFolder(uri)
@@ -121,50 +152,20 @@ export async function activate(context: ExtensionContext) {
           language,
           pattern: `${folder.uri.fsPath}/**/*`
         })),
-        diagnosticCollectionName: 'lsp-multi-server-example',
+        diagnosticCollectionName: 'tailwindcss-language-server',
         workspaceFolder: folder,
-        outputChannel: outputChannel
+        outputChannel: outputChannel,
+        synchronize: {
+          fileEvents: Workspace.createFileSystemWatcher(CONFIG_GLOB)
+        }
       }
       let client = new LanguageClient(
-        'lsp-multi-server-example',
+        'tailwindcss-language-server',
-        'LSP Multi Server Example',
+        'Tailwind CSS Language Server',
         serverOptions,
         clientOptions
       )
 
-      client.onReady().then(() => {
-        client.onNotification('tailwindcss/foundConfig', configPath => {
-          let refresh = createTreeView(configPath)
-        })
-        client.onNotification(
-          'tailwindcss/foundDefinition',
-          ({ uri, range }: Location) => {
-            Workspace.openTextDocument(uri.replace(/^file:\/\//, '')).then((doc: TextDocument) => {
-              Window.showTextDocument(doc).then((editor: TextEditor) => {
-                let start = new Position(
-                  range.start.line,
-                  range.start.character
-                )
-                let end = new Position(range.end.line, range.end.character)
-                editor.revealRange(
-                  new Range(start, end),
-                  TextEditorRevealType.InCenter
-                )
-                editor.selection = new Selection(start, end)
-              })
-            })
-          }
-        )
-        commands.registerCommand('tailwindcss.goToDefinition', key => {
-          client.sendNotification('tailwindcss/findDefinition', [key])
-        })
-      })
-
-      // client.onReady().then(() => {
-      //   client.onNotification('tailwind/loaded', () => {
-      //     console.log('loaded')
-      //   })
-      // })
       client.start()
       clients.set(folder.uri.toString(), client)
     }

src/server.ts

@@ -0,0 +1 @@
+import 'tailwindcss-language-server'

tsconfig.json

@@ -1,7 +1,8 @@
 {
   "compilerOptions": {
     "target": "es2015",
-    "moduleResolution": "node"
+    "moduleResolution": "node",
+    "types": ["node"]
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules", "**/*.spec.ts"]