Adds support for Heroicons v2

Author: BButner

.gitignore

@@ -8,4 +8,5 @@ vsc-extension-quickstart.md
 package-lock.json
 .vscode
 .vscodeignore
-CHANGELOG.md
+CHANGELOG.md
+.DS_store

package.json

@@ -2,7 +2,7 @@
   "name": "heroicons-preview",
   "displayName": "VSCode Heroicons Preview",
   "description": "Inline SVG previews for Heroicons",
-  "version": "0.0.6",
+  "version": "1.0.0",
   "publisher": "BButner",
   "homepage": "https://github.com/BButner/VSCode-Heroicons-Preview",
   "repository": {
@@ -41,13 +41,22 @@
         },
         "hip.fileDecorationExtensions": {
           "type": "array",
-          "default": [".tsx", ".jsx", ".vue", ".html", ".svelte"],
+          "default": [
+            ".tsx",
+            ".jsx",
+            ".vue",
+            ".html",
+            ".svelte"
+          ],
           "description": "Array of file extensions to search for Icons to decorate. Example: [\".tsx\", \".jsx\"]"
         },
         "hip.iconStyleFallback": {
           "type": "string",
           "default": "outline",
-          "enum": ["solid", "outline"],
+          "enum": [
+            "solid",
+            "outline"
+          ],
           "description": "If HIP cannot detect a style from an import, it will fall back to this style."
         }
       }
@@ -78,6 +87,6 @@
     "typescript": "^4.1.3",
     "vscode-test": "^1.5.0",
     "webpack": "^5.19.0",
-    "webpack-cli": "^4.4.0"
+    "webpack-cli": "^4.10.0"
   }
 }

src/lib/decoration.ts

@@ -25,8 +25,9 @@ export const registerDocument = (documentName: string): void => {
   })
 }
 
-export const getDocumentDecorationTypeByName = (documentName: string): vscode.TextEditorDecorationType => {
-  return documentDecorationTypes.filter(type => type.documentName === documentName)[0].decorationType
+export const getDocumentDecorationTypeByName = (documentName: string): vscode.TextEditorDecorationType | null => {
+  const decoration = documentDecorationTypes.find(type => type.documentName === documentName)
+  return decoration ? decoration.decorationType : null
 }
 
 interface DocumentDecorationType {
@@ -42,21 +43,22 @@ export class Decorator {
   }
 
   clearEditorDecorations = (documentName: string): void => {
-    const visibleEditors: vscode.TextEditor[] = vscode.window.visibleTextEditors
+    const visibleEditors: readonly vscode.TextEditor[] = vscode.window.visibleTextEditors
     const potentialEditor: vscode.TextEditor[] = visibleEditors.filter(editor => editor.document.fileName === documentName)
 
     if (visibleEditors.length > 0 && potentialEditor.length > 0) {
       const editor: vscode.TextEditor = potentialEditor[0]
 
-      editor.setDecorations(
-        getDocumentDecorationTypeByName(editor.document.fileName),
-        []
-      )
+      const decoration = getDocumentDecorationTypeByName(editor.document.fileName)
+
+      if (decoration) {
+        editor.setDecorations(decoration, [])
+      }
     }
   }
 
   decorateEditor = (documentName: string): void => {
-    const visibleEditors: vscode.TextEditor[] = vscode.window.visibleTextEditors
+    const visibleEditors: readonly vscode.TextEditor[] = vscode.window.visibleTextEditors
     const potentialEditor: vscode.TextEditor[] = visibleEditors.filter(editor => editor.document.fileName === documentName)
 
     let decorationsArray: any[] = []
@@ -111,10 +113,13 @@ export class Decorator {
           }
         }
 
-        editor.setDecorations(
-          getDocumentDecorationTypeByName(editor.document.fileName),
-          decorationsArray
-        )
+        const decoration = getDocumentDecorationTypeByName(editor.document.fileName)
+
+        console.log('decoration', editor.document.fileName, decoration)
+
+        if (decoration) {
+          editor.setDecorations(decoration, decorationsArray)
+        }
       }
     }
   }

src/lib/events.ts

@@ -41,7 +41,7 @@ export class Events {
 	}
 
 	private configChanged = () => {
-		const editors: vscode.TextEditor[] = vscode.window.visibleTextEditors
+		const editors = vscode.window.visibleTextEditors
 
 		editors.forEach(editor => {
 			if (editor.document && editor.document.getText()) {

src/lib/icon.ts

@@ -74,7 +74,9 @@ export class IconHandler {
   }
 
   private getIconPath = (iconStyle: string): string => {
-    return join(this.heroIconsLocation + '/' + this.mode + '/' + iconStyle)
+    const isV2 = readdirSync(join(this.heroIconsLocation, this.mode!)).filter((dir: string) => dir === '24').length > 0
+
+    return isV2 ? join(this.heroIconsLocation, this.mode!, '24', iconStyle) : join(this.heroIconsLocation, this.mode!, iconStyle)
   }
 
   private isIconCached = (iconName: string, iconStyle: IconStyleType): boolean => {