diff --git a/src/index.ts b/src/index.ts
index 3d87577..925004c 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,141 +1,146 @@
-import type { Preset } from "@unocss/core";
-import { mergeDeep } from "@unocss/core";
-import { parseCssColor } from "@unocss/rule-utils";
-import { getThemeVal, wrapCSSFunction, wrapVar, escapeStringRegexp } from "./helpers";
+import type { Preset } from '@unocss/core'
+import { mergeDeep } from '@unocss/core'
+import { parseCssColor } from '@unocss/rule-utils'
+import { escapeStringRegexp, getThemeVal, wrapCSSFunction, wrapVar } from './helpers'
 
-const defaultThemeNames = ["dark", "light"];
-const PRESET_THEME_RULE = "PRESET_THEME_RULE";
+const defaultThemeNames = ['dark', 'light']
+const PRESET_THEME_RULE = 'PRESET_THEME_RULE'
 
 interface Selectors {
-  [themeName: string]: string;
+  [themeName: string]: string
 }
 
 export interface PresetThemeOptions<Theme extends Record<string, any>> {
   /**
    * Multiple themes
    */
-  theme: Record<string, Theme>;
+  theme: Record<string, Theme>
   /**
    * The prefix of the generated css variables
    * @default --un-preset-theme
    */
-  prefix?: string;
+  prefix?: string
   /**
    * Customize the selectors of the generated css variables
    * @default { light: ':root', [themeName]: '.[themeName]' }
    */
-  selectors?: Selectors;
+  selectors?: Selectors
 }
 
 /**
  * @deprecated use `PresetThemeOptions` instead
  * @see PresetThemeOptions
  */
-export type PresetTheme<Theme extends Record<string, any>> = PresetThemeOptions<Theme>;
+export type PresetTheme<Theme extends Record<string, any>> = PresetThemeOptions<Theme>
 
 interface ThemeValue {
-  theme: Record<string, Record<string, string>>;
-  name: string;
+  theme: Record<string, Record<string, string>>
+  name: string
 }
 
 export function presetTheme<T extends Record<string, any>>(options: PresetThemeOptions<T>): Preset<T> {
-  const { prefix = "--un-preset-theme", theme } = options;
-  const selectors: Selectors = { light: ":root", ...options.selectors };
-  if (!theme.light) theme.light = {} as T;
-  const keys = Object.keys(theme);
-  const varsRE = new RegExp(`var\\((${prefix}[\\w-]*)\\)`);
-  const themeValues = new Map<string, ThemeValue>();
-  const usedTheme: Array<ThemeValue> = [];
+  const { prefix = '--un-preset-theme', theme } = options
+  const selectors: Selectors = { light: ':root', ...options.selectors }
+  if (!theme.light)
+    theme.light = {} as T
+  const keys = Object.keys(theme)
+  const varsRE = new RegExp(`var\\((${prefix}[\\w-]*)\\)`)
+  const themeValues = new Map<string, ThemeValue>()
+  const usedTheme: Array<ThemeValue> = []
 
   return {
-    name: "unocss-preset-theme",
+    name: 'unocss-preset-theme',
     extendTheme(originalTheme) {
       const recursiveTheme = (curTheme: Record<string, any>, preKeys: string[] = []) => {
         Object.keys(curTheme).forEach((key) => {
-          const val = Reflect.get(curTheme, key);
-          const themeKeys = preKeys.concat(key);
+          const val = Reflect.get(curTheme, key)
+          const themeKeys = preKeys.concat(key)
 
           const setThemeValue = (name: string, index = 0, isColor = false) => {
             themeValues.set(name, {
               theme: keys.reduce((obj, key) => {
-                let themeValue =
-                  getThemeVal(theme[key], themeKeys, index) ||
-                  (key === "light" ? getThemeVal(originalTheme, themeKeys) : null);
+                let themeValue
+                  = getThemeVal(theme[key], themeKeys, index)
+                  || (key === 'light' ? getThemeVal(originalTheme, themeKeys) : null)
                 if (themeValue) {
                   if (isColor) {
-                    const cssColor = parseCssColor(themeValue);
-                    if (cssColor?.components) themeValue = cssColor.components.join(" ");
+                    const cssColor = parseCssColor(themeValue)
+                    if (cssColor?.components)
+                      themeValue = cssColor.components.join(' ')
                   }
                   obj[key] = {
                     [name]: themeValue,
-                  };
+                  }
                 }
 
-                return obj;
-              }, {} as ThemeValue["theme"]),
+                return obj
+              }, {} as ThemeValue['theme']),
               name,
-            });
-          };
+            })
+          }
 
           if (Array.isArray(val)) {
             val.forEach((_, index) => {
-              const name = [prefix, ...themeKeys, index].join("-");
-              setThemeValue(name, index);
-              val[index] = wrapVar(name);
-            });
-          } else if (typeof val === "string") {
-            const name = [prefix, ...themeKeys].join("-");
-            const isColor = themeKeys[0] === "colors";
-            setThemeValue(name, 0, isColor);
-            curTheme[key] = wrapVar(name);
+              const name = [prefix, ...themeKeys, index].join('-')
+              setThemeValue(name, index)
+              val[index] = wrapVar(name)
+            })
+          }
+          else if (typeof val === 'string') {
+            const name = [prefix, ...themeKeys].join('-')
+            const isColor = themeKeys[0] === 'colors'
+            setThemeValue(name, 0, isColor)
+            curTheme[key] = wrapVar(name)
             if (isColor) {
-              const cssColor = parseCssColor(val) || val;
-              if (typeof cssColor !== "string")
-                curTheme[key] = wrapCSSFunction(cssColor.type, curTheme[key], cssColor?.alpha);
+              const cssColor = parseCssColor(val) || val
+              if (typeof cssColor !== 'string')
+                curTheme[key] = wrapCSSFunction(cssColor.type, curTheme[key], cssColor?.alpha)
             }
-          } else {
-            recursiveTheme(val, themeKeys);
           }
-        });
-        return curTheme;
-      };
+          else {
+            recursiveTheme(val, themeKeys)
+          }
+        })
+        return curTheme
+      }
 
       return mergeDeep(
         originalTheme,
         recursiveTheme(
           keys.reduce((obj, key) => {
-            return mergeDeep(obj, theme[key]);
-          }, {} as T)
-        )
-      );
+            return mergeDeep(obj, theme[key])
+          }, {} as T),
+        ),
+      )
     },
     rules: [
       [
         new RegExp(`^${PRESET_THEME_RULE}\:(.*)\:`),
         (re) => {
           return usedTheme.reduce((obj, e) => {
-            const key = re?.[1];
-            if (!key || !e.theme[key]) return obj;
+            const key = re?.[1]
+            if (!key || !e.theme[key])
+              return obj
             return {
               ...obj,
               ...e.theme[key],
-            };
-          }, {});
+            }
+          }, {})
         },
       ],
     ],
     variants: [
       {
-        name: "preset-theme-rule",
+        name: 'preset-theme-rule',
         match(matcher) {
           if (matcher.includes(PRESET_THEME_RULE)) {
             return {
               matcher,
               selector(input) {
-                const themeName = input.match(/\:([\w-]+)\\\:\d+/)![1];
-                return selectors[themeName] || `.${themeName}`;
+                const themeName = input.match(/\:([\w-]+)\\\:\d+/)![1]
+                return selectors[themeName] || `.${themeName}`
               },
-            };
+            }
           }
         },
       },
@@ -146,103 +151,107 @@ export function presetTheme<T extends Record<string, any>>(options: PresetThemeO
     },
     preflights: [
       {
-        layer: "theme",
+        layer: 'theme',
         async getCSS(context) {
           const { css } = await context.generator.generate(
             // Add Date.now() to avoid cache
             keys.map(
-              (key) => `${defaultThemeNames.includes(key) ? `${key}:` : ""}${PRESET_THEME_RULE}:${key}:${Date.now()}`
+              key => `${defaultThemeNames.includes(key) ? `${key}:` : ''}${PRESET_THEME_RULE}:${key}:${Date.now()}`,
             ),
-            { preflights: false }
-          );
-          let inMediaPrefersColorScheme = "";
-          const res: string[] = [];
+            { preflights: false },
+          )
+          let inMediaPrefersColorScheme = ''
+          const res: string[] = []
           css
-            .replace(/,\n/g, ",")
-            .split("\n")
+            .replace(/,\n/g, ',')
+            .split('\n')
             .slice(1)
             .forEach((line) => {
-              if (line === "@media (prefers-color-scheme: dark){") {
-                inMediaPrefersColorScheme = selectors.dark || ".dark";
-                res.push(line);
-                return;
+              if (line === '@media (prefers-color-scheme: dark){') {
+                inMediaPrefersColorScheme = selectors.dark || '.dark'
+                res.push(line)
+                return
               }
-              if (line === "@media (prefers-color-scheme: light){") {
-                inMediaPrefersColorScheme = selectors.light;
-                res.push(line);
-                return;
+              if (line === '@media (prefers-color-scheme: light){') {
+                inMediaPrefersColorScheme = selectors.light
+                res.push(line)
+                return
               }
-              if (inMediaPrefersColorScheme && line == "}") {
-                inMediaPrefersColorScheme = "";
-                res[res.length - 1] += line;
-                return;
+              if (inMediaPrefersColorScheme && line === '}') {
+                inMediaPrefersColorScheme = ''
+                res[res.length - 1] += line
+                return
               }
               if (inMediaPrefersColorScheme) {
                 if (line.startsWith(`${inMediaPrefersColorScheme}{`)) {
-                  res[res.length - 1] += line.replace(`${inMediaPrefersColorScheme}{`, ":root{");
-                  return;
+                  res[res.length - 1] += line.replace(`${inMediaPrefersColorScheme}{`, ':root{')
+                  return
                 }
-                return;
+                return
               }
               const regexStr = new RegExp(
                 keys
                   .map(
-                    (key) =>
+                    key =>
                       `((.${key}) ((${
                         selectors[key] ? escapeStringRegexp(selectors[key]) : `.${key}`
-                      }[{|,])|(.${key}\\\\:)))`
+                      }[{|,])|(.${key}\\\\:)))`,
                   )
-                  .join("|"),
-                "g"
-              );
+                  .join('|'),
+                'g',
+              )
               const replacedLine = line.replace(regexStr, (matchStr, ...params) => {
-                const matchGroup = params.slice(0, -2);
-                const matchIndex = params[params.length - 2];
-                const input = params[params.length - 1];
-                console.log(regexStr, matchStr, matchGroup, matchIndex, input);
-                let replacement = "";
+                const matchGroup = params.slice(0, -2)
+                // const matchIndex = params[params.length - 2];
+                // const input = params[params.length - 1];
+                // console.log(regexStr, matchStr, matchGroup, matchIndex, input);
+                let replacement = ''
                 for (let i = 0; i < matchGroup.length / 5; i++) {
-                  const startIndex = i * 5;
-                  if (!matchGroup[startIndex]) continue;
+                  const startIndex = i * 5
+                  if (!matchGroup[startIndex])
+                    continue
                   if (matchGroup[startIndex + 3]) {
                     // ".light .lightclass" => ".lightclass"
                     // ".dark [data-theme="dark"]" => "[data-theme="dark"]"
-                    replacement = matchGroup[startIndex + 3];
-                  } else {
+                    replacement = matchGroup[startIndex + 3]
+                  }
+                  else {
                     // ".light .light\\:" => ".lightclass .light\\:"
                     // ".dark .dark\\:" => "[data-theme="dark"] .dark\\:"
-                    const key = matchGroup[startIndex + 1].substring(1);
-                    replacement = `${selectors[key]} ${matchGroup[startIndex + 2]}`;
+                    const key = matchGroup[startIndex + 1].substring(1)
+                    replacement = `${selectors[key]} ${matchGroup[startIndex + 2]}`
                   }
-                  break;
+                  break
                 }
-                return replacement;
-              });
-              res.push(replacedLine);
-            });
+                return replacement
+              })
+              res.push(replacedLine)
+            })
 
           return res
             .sort((a, b) => {
-              const regexStr = `^${selectors.light}|^@media \\(prefers-color-scheme:`;
-              if (a.match(regexStr)?.length) return b.match(regexStr)?.length ? 0 : -1;
-              return 1;
+              const regexStr = `^${selectors.light}|^@media \\(prefers-color-scheme:`
+              if (a.match(regexStr)?.length)
+                return b.match(regexStr)?.length ? 0 : -1
+              return 1
             })
-            .join("\n");
+            .join('\n')
         },
       },
     ],
     postprocess(util) {
       util.entries.forEach(([, val]) => {
-        if (typeof val === "string") {
-          const varName = val.match(varsRE)?.[1];
+        if (typeof val === 'string') {
+          const varName = val.match(varsRE)?.[1]
           if (varName) {
-            const values = themeValues.get(varName);
-            if (values) usedTheme.push(values);
+            const values = themeValues.get(varName)
+            if (values)
+              usedTheme.push(values)
           }
         }
-      });
+      })
     },
-  };
+  }
 }
 
-export default presetTheme;
+export default presetTheme
diff --git a/tests/index.test.ts b/tests/index.test.ts
index aaec59c..2e84820 100644
--- a/tests/index.test.ts
+++ b/tests/index.test.ts
@@ -1,18 +1,18 @@
-import type { UserConfig } from "@unocss/core";
-import { createGenerator, mergeDeep } from "@unocss/core";
-import { presetUno } from "@unocss/preset-uno";
-import type { PresetUnoOptions, Theme } from "@unocss/preset-uno";
-import { describe, expect, it } from "vitest";
-import type { PresetThemeOptions } from "../src";
-import presetTheme from "../src";
+import type { UserConfig } from '@unocss/core'
+import { createGenerator, mergeDeep } from '@unocss/core'
+import { presetUno } from '@unocss/preset-uno'
+import type { PresetUnoOptions, Theme } from '@unocss/preset-uno'
+import { describe, expect, it } from 'vitest'
+import type { PresetThemeOptions } from '../src'
+import presetTheme from '../src'
 
-describe("theme", () => {
+describe('theme', () => {
   const createUno = (
     userConfig?: UserConfig<Theme>,
     options: {
-      unoOptions?: PresetUnoOptions;
-      themeOptions?: PresetThemeOptions<Theme>;
-    } = {}
+      unoOptions?: PresetUnoOptions
+      themeOptions?: PresetThemeOptions<Theme>
+    } = {},
   ) =>
     createGenerator<Theme>(
       mergeDeep(
@@ -20,14 +20,14 @@ describe("theme", () => {
           theme: {
             colors: {
               main: {
-                100: "#000001",
-                200: "#000002",
-                300: "#000003",
-                400: "#000004",
-                500: "#000004",
-                600: "#000006",
-                700: "#000007",
-                800: "#000008",
+                100: '#000001',
+                200: '#000002',
+                300: '#000003',
+                400: '#000004',
+                500: '#000004',
+                600: '#000006',
+                700: '#000007',
+                800: '#000008',
               },
             },
           },
@@ -37,56 +37,56 @@ describe("theme", () => {
               mergeDeep(
                 {
                   theme: {
-                    dark: {
+                    'dark': {
                       colors: {
                         main: {
-                          100: "#fffff1",
-                          200: "#fffff2",
-                          300: "#fffff3",
-                          400: "#fffff4",
-                          500: "#fffff4",
-                          600: "#fffff6",
-                          700: "#fffff7",
-                          800: "#fffff8",
+                          100: '#fffff1',
+                          200: '#fffff2',
+                          300: '#fffff3',
+                          400: '#fffff4',
+                          500: '#fffff4',
+                          600: '#fffff6',
+                          700: '#fffff7',
+                          800: '#fffff8',
                         },
                       },
                     },
-                    compact: {
+                    'compact': {
                       fontSize: {
-                        xs: ["1.75rem", "2rem"],
-                        sm: ["1.875rem", "2.25rem"],
+                        xs: ['1.75rem', '2rem'],
+                        sm: ['1.875rem', '2.25rem'],
                       },
                     },
-                    "starry-night": {
+                    'starry-night': {
                       colors: {
                         main: {
-                          100: "#1ffff1",
-                          200: "#1ffff2",
-                          300: "#1ffff3",
-                          400: "#1ffff4",
-                          500: "#1ffff4",
-                          600: "#1ffff6",
-                          700: "#1ffff7",
-                          800: "#1ffff8",
+                          100: '#1ffff1',
+                          200: '#1ffff2',
+                          300: '#1ffff3',
+                          400: '#1ffff4',
+                          500: '#1ffff4',
+                          600: '#1ffff6',
+                          700: '#1ffff7',
+                          800: '#1ffff8',
                         },
                       },
                     },
                   },
                 },
-                options.themeOptions as any
-              )
+                options.themeOptions as any,
+              ),
             ),
           ],
         } as UserConfig<Theme>,
-        userConfig as UserConfig<Theme>
-      )
-    );
+        userConfig as UserConfig<Theme>,
+      ),
+    )
 
-  it("basic", async () => {
-    const targets = ["text-main-100", "bg-main-200", "border-main-500", "border-main-6", "text-sm", "text-xs"];
+  it('basic', async () => {
+    const targets = ['text-main-100', 'bg-main-200', 'border-main-500', 'border-main-6', 'text-sm', 'text-xs']
 
-    const uno = createUno();
-    const { css } = await uno.generate(targets.join("\n"));
+    const uno = createUno()
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -101,41 +101,41 @@ describe("theme", () => {
       .text-sm{font-size:var(--un-preset-theme-fontSize-sm-0);line-height:var(--un-preset-theme-fontSize-sm-1);}
       .text-xs{font-size:var(--un-preset-theme-fontSize-xs-0);line-height:var(--un-preset-theme-fontSize-xs-1);}
       .text-main-100{--un-text-opacity:1;color:rgb(var(--un-preset-theme-colors-main-100) / var(--un-text-opacity));}"
-    `);
-  });
-  it("media dark mode", async () => {
+    `)
+  })
+  it('media dark mode', async () => {
     const uno = createGenerator({
       theme: {
         colors: {
-          primary: "#123456",
+          primary: '#123456',
         },
         fontSize: {
-          xs: ["1.75rem", "2rem"],
+          xs: ['1.75rem', '2rem'],
         },
       },
       presets: [
         presetUno({
-          dark: "media",
+          dark: 'media',
         }),
         presetTheme<Theme>({
           theme: {
             dark: {
               colors: {
-                primary: "#654321",
+                primary: '#654321',
               },
             },
             compact: {
               fontSize: {
-                xs: ["0.75rem", "1rem"],
+                xs: ['0.75rem', '1rem'],
               },
             },
           },
         }),
       ],
-    });
+    })
 
-    const targets = ["text-xs", "text-primary"];
-    const { css } = await uno.generate(targets.join("\n"));
+    const targets = ['text-xs', 'text-primary']
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -146,13 +146,13 @@ describe("theme", () => {
       /* layer: default */
       .text-xs{font-size:var(--un-preset-theme-fontSize-xs-0);line-height:var(--un-preset-theme-fontSize-xs-1);}
       .text-primary{--un-text-opacity:1;color:rgb(var(--un-preset-theme-colors-primary) / var(--un-text-opacity));}"
-    `);
-  });
-  it("selectors", async () => {
+    `)
+  })
+  it('selectors', async () => {
     const uno = createGenerator({
       theme: {
         colors: {
-          primary: "#123456",
+          primary: '#123456',
         },
       },
       presets: [
@@ -161,20 +161,20 @@ describe("theme", () => {
           theme: {
             dark: {
               colors: {
-                primary: "#654321",
+                primary: '#654321',
               },
             },
           },
           selectors: {
-            dark: "body.dark",
-            light: ".light",
+            dark: 'body.dark',
+            light: '.light',
           },
         }),
       ],
-    });
+    })
 
-    const targets = ["text-primary"];
-    const { css } = await uno.generate(targets.join("\n"));
+    const targets = ['text-primary']
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -183,18 +183,18 @@ describe("theme", () => {
       body.dark{--un-preset-theme-colors-primary:101 67 33;}
       /* layer: default */
       .text-primary{--un-text-opacity:1;color:rgb(var(--un-preset-theme-colors-primary) / var(--un-text-opacity));}"
-    `);
-  });
+    `)
+  })
 
-  it("color opacity", async () => {
+  it('color opacity', async () => {
     const uno = createUno(
       {
         theme: {
           colors: {
-            rgb: "rgb(255, 0, 0)",
-            rgba: "rgba(255, 0, 0, 0.5)",
-            hsl: "hsl(0, 100%, 50%)",
-            hsla: "hsl(0, 100%, 50%, 0.5)",
+            rgb: 'rgb(255, 0, 0)',
+            rgba: 'rgba(255, 0, 0, 0.5)',
+            hsl: 'hsl(0, 100%, 50%)',
+            hsla: 'hsl(0, 100%, 50%, 0.5)',
           },
         },
       },
@@ -203,20 +203,20 @@ describe("theme", () => {
           theme: {
             dark: {
               colors: {
-                rgb: "rgb(0, 255, 0)",
-                rgba: "rgba(0, 255, 0, 0.5)",
-                hsl: "hsl(0, 100%, 50%)",
-                hsla: "hsl(100, 100%, 50%, 0.5)",
+                rgb: 'rgb(0, 255, 0)',
+                rgba: 'rgba(0, 255, 0, 0.5)',
+                hsl: 'hsl(0, 100%, 50%)',
+                hsla: 'hsl(100, 100%, 50%, 0.5)',
               },
             },
           },
         },
-      }
-    );
+      },
+    )
 
     const { css } = await uno.generate(
-      "text-main text-rgb text-rgba text-rgb/40 text-rgba/50 text-hsl text-hsl/60 text-hsla text-hsla/60"
-    );
+      'text-main text-rgb text-rgba text-rgb/40 text-rgba/50 text-hsl text-hsl/60 text-hsla text-hsla/60',
+    )
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -232,10 +232,10 @@ describe("theme", () => {
       .text-rgb\\\\/40{color:rgb(var(--un-preset-theme-colors-rgb) / 0.4);}
       .text-rgba{--un-text-opacity:0.5;color:rgb(var(--un-preset-theme-colors-rgba) / var(--un-text-opacity));}
       .text-rgba\\\\/50{color:rgb(var(--un-preset-theme-colors-rgba) / 0.5);}"
-    `);
-  });
+    `)
+  })
 
-  it("spacing", async () => {
+  it('spacing', async () => {
     const uno = createUno(
       {},
       {
@@ -243,20 +243,20 @@ describe("theme", () => {
           theme: {
             dark: {
               spacing: {
-                lg: "15px",
+                lg: '15px',
               },
             },
             compact: {
               spacing: {
-                lg: "12px",
-                md: "10px",
+                lg: '12px',
+                md: '10px',
               },
             },
           },
         },
-      }
-    );
-    const { css } = await uno.generate("px-5 py-6 pt-7 pb-8 px-md p-lg");
+      },
+    )
+    const { css } = await uno.generate('px-5 py-6 pt-7 pb-8 px-md p-lg')
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -271,16 +271,16 @@ describe("theme", () => {
       .py-6{padding-top:1.5rem;padding-bottom:1.5rem;}
       .pb-8{padding-bottom:2rem;}
       .pt-7{padding-top:1.75rem;}"
-    `);
-  });
+    `)
+  })
 
-  it("color-keyword-and-custom-vars", async () => {
+  it('color-keyword-and-custom-vars', async () => {
     const uno = createGenerator({
       theme: {
         colors: {
-          primary: "#123456",
-          colorKey: "red",
-          customVar: "var(--fd-color-light)",
+          primary: '#123456',
+          colorKey: 'red',
+          customVar: 'var(--fd-color-light)',
         },
       },
       presets: [
@@ -289,18 +289,18 @@ describe("theme", () => {
           theme: {
             dark: {
               colors: {
-                primary: "#654321",
-                colorKey: "blue",
-                customVar: "var(--fd-color-dark)",
+                primary: '#654321',
+                colorKey: 'blue',
+                customVar: 'var(--fd-color-dark)',
               },
             },
           },
         }),
       ],
-    });
+    })
 
-    const targets = ["text-color-key", "text-custom-var"];
-    const { css } = await uno.generate(targets.join("\n"));
+    const targets = ['text-color-key', 'text-custom-var']
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -310,10 +310,10 @@ describe("theme", () => {
       /* layer: default */
       .text-color-key{color:var(--un-preset-theme-colors-colorKey);}
       .text-custom-var{color:var(--un-preset-theme-colors-customVar);}"
-    `);
-  });
+    `)
+  })
 
-  it("all theme use same selector content", async () => {
+  it('all theme use same selector content', async () => {
     const uno = createGenerator({
       presets: [
         presetUno(),
@@ -321,27 +321,27 @@ describe("theme", () => {
           theme: {
             light: {
               colors: {
-                primary: "var(--el-color-primary)",
+                primary: 'var(--el-color-primary)',
               },
             },
             dark: {
               colors: {
-                primary: "var(--el-color-primary)",
+                primary: 'var(--el-color-primary)',
               },
             },
             blue: {
               colors: {
-                primary: "var(--el-color-primary)",
-                dd: "var(--el-color-primary)",
+                primary: 'var(--el-color-primary)',
+                dd: 'var(--el-color-primary)',
               },
             },
           },
         }),
       ],
-    });
+    })
 
-    const targets = ["text-primary", "text-dd"];
-    const { css } = await uno.generate(targets.join("\n"));
+    const targets = ['text-primary', 'text-dd']
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -351,15 +351,15 @@ describe("theme", () => {
       /* layer: default */
       .text-dd{color:var(--un-preset-theme-colors-dd);}
       .text-primary{color:var(--un-preset-theme-colors-primary);}"
-    `);
-  });
+    `)
+  })
 
-  it("custom-selectors", async () => {
+  it('custom-selectors', async () => {
     const uno = createGenerator({
       theme: {
         colors: {
-          primary: "#123456",
-          colorKey: "red",
+          primary: '#123456',
+          colorKey: 'red',
         },
       },
       presets: [
@@ -368,27 +368,27 @@ describe("theme", () => {
           selectors: {
             light: '[data-theme="light"]',
             dark: '[data-theme="dark"]',
-            test: ".test",
+            test: '.test',
           },
           theme: {
             dark: {
               colors: {
-                primary: "#654321",
-                colorKey: "blue",
+                primary: '#654321',
+                colorKey: 'blue',
               },
             },
             test: {
               colors: {
-                primary: "#123123",
+                primary: '#123123',
               },
             },
           },
         }),
       ],
-    });
+    })
 
-    const targets = ["text-primary", "text-color-key"];
-    const { css } = await uno.generate(targets.join("\n"));
+    const targets = ['text-primary', 'text-color-key']
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -399,18 +399,18 @@ describe("theme", () => {
       /* layer: default */
       .text-color-key{color:var(--un-preset-theme-colors-colorKey);}
       .text-primary{--un-text-opacity:1;color:rgb(var(--un-preset-theme-colors-primary) / var(--un-text-opacity));}"
-    `);
-  });
+    `)
+  })
 
-  it("breakpoints", async () => {
+  it('breakpoints', async () => {
     const uno = createGenerator({
       theme: {
         colors: {
-          primary: "#123456",
-          colorKey: "red",
+          primary: '#123456',
+          colorKey: 'red',
         },
         fontSize: {
-          xs: ["1.75rem", "2rem"],
+          xs: ['1.75rem', '2rem'],
         },
       },
       presets: [
@@ -419,26 +419,26 @@ describe("theme", () => {
           theme: {
             dark: {
               colors: {
-                primary: "#654321",
-                colorKey: "blue",
+                primary: '#654321',
+                colorKey: 'blue',
               },
             },
             test: {
               colors: {
-                primary: "#123123",
+                primary: '#123123',
               },
               fontSize: {
-                xs: ["0.75rem", "1rem"],
+                xs: ['0.75rem', '1rem'],
               },
             },
           },
         }),
       ],
-      safelist: ["md:text-xs"],
-    });
+      safelist: ['md:text-xs'],
+    })
 
-    const targets = ["md:text-primary", "dark:text-color-key", "md:text-xs"];
-    const { css } = await uno.generate(targets.join("\n"));
+    const targets = ['md:text-primary', 'dark:text-color-key', 'md:text-xs']
+    const { css } = await uno.generate(targets.join('\n'))
     expect(css).toMatchInlineSnapshot(`
       "/* layer: preflights */
       *,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
@@ -455,6 +455,6 @@ describe("theme", () => {
       .md\\\\:text-xs{font-size:var(--un-preset-theme-fontSize-xs-0);line-height:var(--un-preset-theme-fontSize-xs-1);}
       .md\\\\:text-primary{--un-text-opacity:1;color:rgb(var(--un-preset-theme-colors-primary) / var(--un-text-opacity));}
       }"
-    `);
-  });
-});
+    `)
+  })
+})