diff --git a/packages/inspector/client/components/ReplPlayground.vue b/packages/inspector/client/components/ReplPlayground.vue
index 74bf8b0f9a..e661e7ea93 100644
--- a/packages/inspector/client/components/ReplPlayground.vue
+++ b/packages/inspector/client/components/ReplPlayground.vue
@@ -10,7 +10,8 @@ const input = useLocalStorage(
'
\nHello World\n
',
)
-const { data: result } = fetchRepl(input)
+const isSafelistIncluded = useStorage('unocss-inspector-safelist', false)
+const { data: result } = fetchRepl(input, isSafelistIncluded)
@@ -23,6 +24,12 @@ const { data: result } = fetchRepl(input)
Edit your code below to test and play UnoCSS's matching and generating.
+
+
+
) {
return result
}
-export function fetchRepl(input: Ref) {
+export function fetchRepl(input: Ref, includeSafelist: Ref) {
const debounced = useDebounce(input, 500)
- return useFetch(computed(() => `${API_ROOT}/repl?token=${encodeURIComponent(debounced.value)}`), { refetch: true })
+ return useFetch(computed(() => `${API_ROOT}/repl?token=${encodeURIComponent(debounced.value)}&safelist=${includeSafelist.value}`), { refetch: true })
.json()
}
diff --git a/packages/inspector/node/index.ts b/packages/inspector/node/index.ts
index 0a728aaf82..5de92475f1 100644
--- a/packages/inspector/node/index.ts
+++ b/packages/inspector/node/index.ts
@@ -65,8 +65,9 @@ export default function UnocssInspector(ctx: UnocssPluginContext): Plugin {
if (req.url.startsWith('/repl')) {
const query = new URLSearchParams(req.url.slice(5))
const token = query.get('token') || ''
+ const includeSafelist = JSON.parse(query.get('safelist') ?? 'false')
- const result = await ctx.uno.generate(token, { preflights: false })
+ const result = await ctx.uno.generate(token, { preflights: false, safelist: includeSafelist })
const mod = {
...result,
matched: Array.from(result.matched),