From 3f71d4bf1c414e4e1a68fa7b15765dfe18b44266 Mon Sep 17 00:00:00 2001
From: Carles Mitjans Coma <carles.mitjans.coma@gmail.com>
Date: Wed, 15 Nov 2023 17:37:08 +0100
Subject: [PATCH] docs: append `addTwUtil` module option

---
 docs/content/1.getting-started/2.options.md | 23 +++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/docs/content/1.getting-started/2.options.md b/docs/content/1.getting-started/2.options.md
index 9eef3cd2..1e607143 100644
--- a/docs/content/1.getting-started/2.options.md
+++ b/docs/content/1.getting-started/2.options.md
@@ -160,3 +160,26 @@ export default defineNuxtConfig({
   }
 })
 ```
+
+## `addTwUtil `
+
+- Default: `false`
+
+This options adds the utility function `tw` that will provide intellisense suggestions in Js/Ts strings if the [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) extension is installed. For this to work, you will have to add the following VSCode setting:
+
+```json [settings.json]
+{
+  "tailwindCSS.experimental.classRegex": ["tw`([^`]*)", "tw\\('([^'\\)]*)"],
+}
+```
+
+Once modified, the new utility function can be used as follows, providing intellisense suggestions when writing Tailwind classes:
+
+```vue [index.vue]
+<script setup lang="ts">
+const variantClasses = {
+  primary: tw`bg-red-400`,
+  secondary: tw('bg-green-400')
+}
+</script>
+```