CHANGELOG.md

@@ -2,6 +2,31 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## v6.8.0
+
+[compare changes](https://undefined/undefined/compare/v6.7.2...v6.8.0)
+
+
+### 🚀 Enhancements
+
+  - Parallelise async calls and fixes (#690)
+
+### 📖 Documentation
+
+  - No strict peer (582cb73)
+  - Use SB for example (9b157eb)
+  - Update color mode example (255da81)
+  - Update examples (43b224d)
+
+### 🏡 Chore
+
+  - Update deps (9bf0e68)
+
+### ❤️  Contributors
+
+- Sébastien Chopin ([@Atinux](http://github.com/Atinux))
+- Inesh Bose
+
 ## v6.7.2
 
 [compare changes](https://undefined/undefined/compare/v6.7.1...v6.7.2)

docs/.npmrc

@@ -1 +1,2 @@
 shamefully-hoist=true
+strict-peer-dependencies=false

docs/content/2.tailwind/1.config.md

@@ -125,6 +125,10 @@ This config has less priority over the [tailwind.config.js](#tailwindconfigjs) f
 This is an advanced usage section and intended primarily for Nuxt modules authors.
 ::
 
+#### `tailwindcss:loadConfig`
+
+Passes any Tailwind configuration read by the module for each (extended) [layer](https://nuxt.com/docs/getting-started/layers)/[path](/getting-started/options#configpath) before merging all of them.
+
 #### `tailwindcss:config`
 
 Passes the resolved vanilla configuration read from all layers and paths with merging using [defu](https://github.com/unjs/defu).

docs/content/3.examples/1.basic.md

@@ -4,10 +4,10 @@ toc: false
 
 # Basic Usage
 
-Live example of basic usage of Nuxt Tailwind on CodeSandbox.
+Live example of basic usage of Nuxt and Tailwind CSS.
 
 ---
 
 Minimal example of a Nuxt project with Tailwind CSS module.
 
-:sandbox{src="https://codesandbox.io/embed/nuxt3-tailwindcss-twowfx"}
+:sandbox{src="https://stackblitz.com/edit/nuxt-tailwindcss-starter?embed=1&file=pages%2Findex.vue"}

docs/content/3.examples/2.dark-mode.md

@@ -4,12 +4,36 @@ toc: false
 
 # Dark Mode
 
-Live example of dark mode with Nuxt Tailwind on CodeSandbox.
+Live example of dark mode with Nuxt Tailwind.
 
 ---
 
-<!-- TODO: Replace with tailwind's native dark mode support. -->
-
 Example with the [tailwindcss-dark-mode](https://github.com/ChanceArthur/tailwindcss-dark-mode) plugin and [@nuxtjs/color-mode](https://github.com/nuxt-community/color-mode-module) module.
 
-:sandbox{src="https://codesandbox.io/embed/nuxt-dark-tailwindcss-17g2j"}
+To make it work hand-in-hand, you need to update your `tailwind.config` to add 
+
+```ts [tailwind.config.ts]
+import type { Config } from 'tailwindcss'
+
+export default <Partial<Config>>{
+  darkMode: 'class'
+}
+```
+
+And add the `classSuffix` to the colorMode module options:
+
+```ts [nuxt.config.ts]
+export default defineNuxtConfig({
+  modules: [
+    '@nuxtjs/tailwindcss',
+    '@nuxtjs/color-mode'
+  ],
+  colorMode: {
+    classSuffix: ''
+  }
+})
+```
+
+See the working demo below:
+
+:sandbox{src="https://stackblitz.com/edit/nuxt-tailwindcss-color-mode?embed=1&file=app.vue"}

docs/content/3.examples/3.nuxtlabs-ui.md

@@ -0,0 +1,9 @@
+---
+toc: false
+---
+
+# NuxtLabs UI
+
+Live example of [NuxtLabs UI](https://ui.nuxtlabs.com) module.
+
+:sandbox{src="https://stackblitz.com/edit/nuxt-nuxtlabs-ui?file=pages%2Findex.vue"}

package.json

@@ -1,9 +1,14 @@
 {
   "name": "@nuxtjs/tailwindcss",
-  "version": "6.7.2",
+  "version": "6.8.0",
   "description": "TailwindCSS module for Nuxt",
   "repository": "nuxt-modules/tailwindcss",
   "license": "MIT",
+  "configKey": "tailwindcss",
+  "compatibility": {
+    "nuxt": "^2.9.0 || ^3.0.0-rc.1",
+    "bridge": true
+  },
   "exports": {
     ".": {
       "require": "./dist/module.cjs",
@@ -40,7 +45,7 @@
     "pathe": "^1.1.1",
     "postcss": "^8.4.24",
     "postcss-custom-properties": "^13.2.0",
-    "postcss-nesting": "^11.2.2",
+    "postcss-nesting": "^11.3.0",
     "radix3": "^1.0.1",
     "tailwind-config-viewer": "^1.7.2",
     "tailwindcss": "~3.3.2",
@@ -49,8 +54,8 @@
   },
   "devDependencies": {
     "@fontsource/inter": "^5.0.3",
-    "@nuxt/content": "^2.6.0",
-    "@nuxt/devtools": "^0.5.5",
+    "@nuxt/content": "^2.7.0",
+    "@nuxt/devtools": "^0.6.1",
     "@nuxt/eslint-config": "latest",
     "@nuxt/module-builder": "^0.4.0",
     "@nuxt/test-utils": "^3.5.3",
@@ -61,6 +66,6 @@
     "eslint": "latest",
     "jsdom": "^22.1.0",
     "nuxt": "^3.5.3",
-    "vitest": "^0.32.0"
+    "vitest": "^0.32.2"
   }
 }

playground/theme/tailwind.config.ts → playground/theme/tailwind.config.cjs

@@ -1,6 +1,6 @@
-import colors from 'tailwindcss/colors'
+const colors = require('tailwindcss/colors')
 
-export default {
+module.exports = {
   theme: {
     extend: {
       colors: {