feat: add config to disable bracket completions

windicss · May 23, 2021 · c0e057e · c0e057e
1 parent ff5be79
commit c0e057e
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 8 deletions.
diff --git a/README.md b/README.md
@@ -81,7 +81,8 @@ Browse your utilities usages, have an overview of your design system, identify "
 | `windicss.enableCodeCompletion`    | boolean | true     | Enable/Disable all code completions.                         |
 | `windicss.enableUtilityCompletion` | boolean | true     | Enable Utility Completion.                                   |
 | `windicss.enableVariantCompletion` | boolean | true     | Enable Variant Completion.                                   |
-| `windicss.enableDynamicCompletion` | boolean | true     | Enable Dynamic Utilities Completion like p-${int}.           |
+| `windicss.enableDynamicCompletion` | boolean | true     | Enable Dynamic Utilities Completion like p-{int}.           |
+| `windicss.enableBracketCompletion` | boolean | true     | Enable Square Bracket Utilities Completion like bg-[#ff0].           |
 | `windicss.enableAttrUtilityCompletion` | boolean | true | Enable Utility Completion For Attributify Mode.              |
 | `windicss.enableAttrVariantCompletion` | boolean | true | Enable Variant Completion For Attributify Mode.              |
 | `windicss.enableRemToPxPreview`    | boolean | true     | Enable Rem to Px Preview.                                    |

diff --git a/package.json b/package.json
@@ -180,7 +180,12 @@
         "windicss.enableDynamicCompletion": {
           "type": "boolean",
           "default": true,
-          "description": "Enable Dynamic Utilities Completion like p-${int}."
+          "description": "Enable Dynamic Utilities Completion like p-{int}."
+        },
+        "windicss.enableBracketCompletion": {
+          "type": "boolean",
+          "default": true,
+          "description": "Enable Square Bracket Utilities Completion like bg-[#ff0]."
         },
         "windicss.enableEmmetCompletion": {
           "type": "boolean",

diff --git a/src/lib/completions.ts b/src/lib/completions.ts
@@ -25,7 +25,7 @@ export default class Completions {
   }
 
   // register suggestions in class = ... | className = ... | @apply ... | sm = ... | hover = ...
-  registerUtilities(ext: DocumentSelector, type: string, pattern?: RegExp, enableUtilty = true, enableVariant = true, enableDynamic = true, enableEmmet = false) {
+  registerUtilities(ext: DocumentSelector, type: string, pattern?: RegExp, enableUtilty = true, enableVariant = true, enableDynamic = true, enableBracket = true, enableEmmet = false) {
     return languages.registerCompletionItemProvider(
       ext,
       {
@@ -72,14 +72,17 @@ export default class Completions {
             );
           }
 
-          if (enableDynamic) {
+          if (enableBracket) {
             completions = completions.concat(
               this.completions.bracket.map((label, index) => {
                 const item = new CompletionItem(label, CompletionItemKind.Struct);
                 item.sortText = '3-' + index.toString().padStart(8, '0');
                 return item;
               })
             );
+          }
+
+          if (enableDynamic) {
             completions = completions.concat(
               this.completions.dynamic.map(({ label, pos }, index) => {
                 const item = new CompletionItem(label, CompletionItemKind.Variable);
@@ -168,7 +171,7 @@ export default class Completions {
     );
   }
 
-  registerAttrValues(ext: DocumentSelector, enableUtility = true, enableVariant = true, enableDynamic = true) {
+  registerAttrValues(ext: DocumentSelector, enableUtility = true, enableVariant = true, enableDynamic = true, enableBracket = true) {
     return languages.registerCompletionItemProvider(
       ext,
       {
@@ -213,7 +216,7 @@ export default class Completions {
               );
             }
 
-            if (enableDynamic && key in this.completions.attr.dynamic) {
+            if (enableBracket && key in this.completions.attr.bracket) {
               completions = completions.concat(
                 this.completions.attr.bracket[key].map((label, index) => {
                   const item = new CompletionItem(label, CompletionItemKind.Struct);
@@ -222,7 +225,9 @@ export default class Completions {
                   return item;
                 })
               );
+            }
 
+            if (enableDynamic && key in this.completions.attr.dynamic) {
               completions = completions.concat(
                 this.completions.attr.dynamic[key].map(({ label, pos }, index) => {
                   const item = new CompletionItem(label, CompletionItemKind.Variable);

diff --git a/src/lib/index.ts b/src/lib/index.ts
@@ -127,14 +127,15 @@ export default class Extension {
       enableUtilty: this.get<boolean>('enableUtilityCompletion'),
       enableVariant: this.get<boolean>('enableVariantCompletion'),
       enableDynamic: this.get<boolean>('enableDynamicCompletion'),
+      enableBracket: this.get<boolean>('enableBracketCompletion'),
       enableEmmet: this.get<boolean>('enableEmmetCompletion'),
       enableAttrUtility: this.get<boolean>('enableAttrUtilityCompletion'),
       enableAttrVariant: this.get<boolean>('enableAttrVariantCompletion'),
     };
     for (const [ext, { type, pattern }] of Object.entries(fileTypes)) {
-      disposables.push(completions.registerUtilities(ext, type, pattern, config.enableUtilty, config.enableVariant, config.enableDynamic, config.enableEmmet));
+      disposables.push(completions.registerUtilities(ext, type, pattern, config.enableUtilty, config.enableVariant, config.enableDynamic, config.enableBracket, config.enableEmmet));
       allowAttr(type) && disposables.push(completions.registerAttrKeys(ext, config.enableAttrUtility, config.enableAttrVariant));
-      allowAttr(type) && disposables.push(completions.registerAttrValues(ext, config.enableAttrUtility, config.enableVariant, config.enableDynamic));
+      allowAttr(type) && disposables.push(completions.registerAttrValues(ext, config.enableAttrUtility, config.enableVariant, config.enableDynamic, config.enableBracket));
     }
     // trigger suggestion when using raw html class completion with tab
     disposables.push(window.onDidChangeTextEditorSelection((e) => {