From 4c004d73b53e8c50bbc91e31004dad218c7e8238 Mon Sep 17 00:00:00 2001
From: frostime <frostime@foxmail.com>
Date: Fri, 19 Jul 2024 15:51:59 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20misc?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/setting-example.svelte | 43 ++++++++++++++++++++++++--------------
 1 file changed, 27 insertions(+), 16 deletions(-)

diff --git a/src/setting-example.svelte b/src/setting-example.svelte
index 818dc5b..2a2c809 100644
--- a/src/setting-example.svelte
+++ b/src/setting-example.svelte
@@ -2,10 +2,10 @@
     import { showMessage } from "siyuan";
     import SettingPanel from "./libs/components/setting-panel.svelte";
 
-    let groups: string[] = ["🌈 Default"];
+    let groups: string[] = ["🌈 Group 1", "✨ Group 2"];
     let focusGroup = groups[0];
 
-    const SettingItems: ISettingItem[] = [
+    const group1Items: ISettingItem[] = [
         {
             type: 'checkbox',
             title: 'checkbox',
@@ -41,19 +41,10 @@
                 y: 'y',
                 z: 'z'
             }
-        },
-        {
-            type: 'slider',
-            title: 'slider',
-            description: 'slider',
-            key: 'd',
-            value: 50,
-            slider: {
-                min: 0,
-                max: 100,
-                step: 1
-            }
-        },
+        }
+    ];
+
+    const group2Items: ISettingItem[] = [
         {
             type: 'button',
             title: 'button',
@@ -66,6 +57,18 @@
                     showMessage('Hello, world!');
                 }
             }
+        },
+        {
+            type: 'slider',
+            title: 'slider',
+            description: 'slider',
+            key: 'd',
+            value: 50,
+            slider: {
+                min: 0,
+                max: 100,
+                step: 1
+            }
         }
     ];
 
@@ -105,7 +108,7 @@
     <div class="config__tab-wrap">
         <SettingPanel
             group={groups[0]}
-            settingItems={SettingItems}
+            settingItems={group1Items}
             display={focusGroup === groups[0]}
             on:changed={onChanged}
             on:click={({ detail }) => { console.debug("Click:", detail.key); }}
@@ -114,6 +117,14 @@
                 💡 This is our default settings.
             </div>
         </SettingPanel>
+        <SettingPanel
+            group={groups[1]}
+            settingItems={group2Items}
+            display={focusGroup === groups[1]}
+            on:changed={onChanged}
+            on:click={({ detail }) => { console.debug("Click:", detail.key); }}
+        >
+        </SettingPanel>
     </div>
 </div>