From 80f304becc2d2766188387fcf2bbd2281888c2a1 Mon Sep 17 00:00:00 2001
From: Frozen FIsh <76603360+sudongyuer@users.noreply.github.com>
Date: Sat, 3 Sep 2022 22:20:45 +0800
Subject: [PATCH] feat(playground): add reset option (#1533)

Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>
---
 playground/src/components/Editor.vue | 26 ++++++++++++++++++++------
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/playground/src/components/Editor.vue b/playground/src/components/Editor.vue
index 8abfd3dcbd..a7c33f7809 100644
--- a/playground/src/components/Editor.vue
+++ b/playground/src/components/Editor.vue
@@ -33,6 +33,14 @@ const panelSizes = useLocalStorage<number[]>(
   { listenToStorageChanges: false },
 )
 
+function handleReset() {
+  // eslint-disable-next-line no-alert
+  if (confirm('Reset all settings? It can NOT be undone.')) {
+    inputHTML.value = defaultHTML
+    customConfigRaw.value = defaultConfigRaw
+  }
+}
+
 function handleResize(event: ({ size: number })[]) {
   panelSizes.value = event.map(({ size }) => size)
 }
@@ -121,24 +129,30 @@ onMounted(() => {
           </div>
 
           <div class="pl-1 ml-auto space-x-2 text-sm md:text-base flex items-center flex-nowrap">
+            <button
+              i-carbon-erase
+              icon-btn
+              title="Reset To Default"
+              @click="handleReset"
+            />
             <a
               i-ri-search-line icon-btn
               href="https://uno.antfu.me"
               target="_blank"
               title="Interactive Docs"
             />
-            <a
-              i-ri-github-line icon-btn
-              href="https://github.com/unocss/unocss"
-              target="_blank"
-              title="GitHub"
-            />
             <button
               i-ri-device-line
               icon-btn
               title="Responsive"
               @click="options.responsive = !options.responsive"
             />
+            <a
+              i-ri-github-line icon-btn
+              href="https://github.com/unocss/unocss"
+              target="_blank"
+              title="GitHub"
+            />
             <button
               i-ri-sun-line
               dark:i-ri-moon-line