Merge branch 'zxkmm-add_hint_type_to_settingUtil_and_fix_official_setting_calling' into dev

src/i18n/en_US.json

@@ -14,5 +14,7 @@
     "name": "SiYuan",
     "hello": {
         "makesure": "Before using this template, please read the <a href=\"https://github.com/siyuan-note/plugin-sample\">offical sample</a>, make sure that you've known about the pipeline for plugin developing."
-    }
+    },
+    "hintTitle":"About",
+    "hintDesc":"<a href='https://github.com/siyuan-note/plugin-sample-vite-svelte'>plugin-sample-vite-svelte</a><br>@frostime<br>@88250<br>@zxkmm"
 }

src/i18n/zh_CN.json

@@ -14,5 +14,8 @@
     "name": "思源",
     "hello": {
         "makesure": "使用这个模板之前，请阅读<a href=\"https://github.com/siyuan-note/plugin-sample\">官方教程</a>, 确保自己已经理解了插件的基本开发流程。"
-    }
+    },
+    "hintTitle":"关于",
+    "hintDesc":"<a href='https://github.com/siyuan-note/plugin-sample-vite-svelte'>🔗 plugin-sample-vite-svelte</a><br>💻 @frostime<br>💻 @88250<br>💻 @zxkmm"
+
 }

src/index.ts

@@ -163,6 +163,13 @@ export default class PluginSample extends Plugin {
         });
 
         this.settingUtils = new SettingUtils(this, STORAGE_NAME);
+
+        try {
+            this.settingUtils.load();
+        } catch (error) {
+            console.error("Error loading settings storage, probably empty config json:", error);
+        }
+
         this.settingUtils.addItem({
             key: "Input",
             value: "",
@@ -220,6 +227,13 @@ export default class PluginSample extends Plugin {
                 }
             }
         });
+        this.settingUtils.addItem({
+            key: "Hint",
+            value: "",
+            type: "hint",
+            title: this.i18n.hintTitle,
+            description: this.i18n.hintDesc,
+        });
 
         this.protyleSlash = [{
             filter: ["insert emoji 😊", "插入表情 😊", "crbqwx"],
@@ -269,6 +283,14 @@ export default class PluginSample extends Plugin {
         // this.loadData(STORAGE_NAME);
         this.settingUtils.load();
         console.log(`frontend: ${getFrontend()}; backend: ${getBackend()}`);
+
+        console.log(
+            "Official settings value calling example:\n" +
+            this.settingUtils.get("InputArea") + "\n" +
+            this.settingUtils.get("Slider") + "\n" +
+            this.settingUtils.get("Select") + "\n"
+        );
+
         let tabDiv = document.createElement("div");
         new HelloExample({
             target: tabDiv,

src/libs/index.d.ts

@@ -1,4 +1,4 @@
-type TSettingItemType = "checkbox" | "select" | "textinput" | "textarea" | "number" | "slider" | "button";
+type TSettingItemType = "checkbox" | "select" | "textinput" | "textarea" | "number" | "slider" | "button" | "hint";
 interface ISettingItem {
     key: string;
     value: any;

src/libs/setting-utils.ts

@@ -144,6 +144,11 @@ export class SettingUtils {
                 buttonElement.onclick = item.button?.callback ?? (() => {});
                 itemElement = buttonElement;
                 break;
+            case 'hint':
+                let hintElement: HTMLElement = document.createElement('div');
+                hintElement.className = 'b3-label fn__flex-center';
+                itemElement = hintElement;
+                break;
         }
         this.elements.set(item.key, itemElement);
         this.plugin.setting.addItem({