Add visual SettingsTemplate.yaml editor

Author: Yusyuriv

_sidebar.md

@@ -25,6 +25,7 @@
     - JSONRPC
       - [**JSON RPC Introduction**](/json-rpc.md)
       - [**JSON RPC Plugin Settings**](/json-rpc-settings.md)
+      - [**Visual SettingsTemplate.yaml editor**](/json-rpc-visual-settingstemplate-editor.md)
     - Porting Plugins
       - [**Porting Plugins Guide**](/port-plugins.md)
 - [**How To Create A Theme**](/how-to-create-a-theme.md)

json-rpc-settings.md

@@ -184,7 +184,7 @@ body:
 <settings-component-demo type="checkbox" label="Prefer shorter answers" description="If checked, the plugin will try to give answer much shorter than the usual ones."></settings-component-demo>
 
 ### Visual editor for `SettingsTemplate.yaml`
-You can use a [visual editor](https://flow-launcher-plugin-settings-generator.pages.dev/) for creating the `SettingsTemplate.yaml` file. When you're done editing, click the `Generate SettingsTemplate.yaml` file and copy-paste its contents into your `SettingsTemplate.yaml` file. Optionally, you can also copy the generated typings for your settings object in your preferred programming language.
+You can use a [visual editor](#/json-rpc-visual-settingstemplate-editor) for creating the `SettingsTemplate.yaml` file. When you're done editing, click the `Generate SettingsTemplate.yaml` file and copy-paste its contents into your `SettingsTemplate.yaml` file. Optionally, you can also copy the generated typings for your settings object in your preferred programming language.
 
 <script>
 const element = document.querySelector('#__settings-script__');

json-rpc-visual-settingstemplate-editor.md

@@ -0,0 +1,18 @@
+## SettingsTemplate.yaml editor
+
+Note that data in the editor below is not persisted. It will be lost once you close your browser. Remember to press "Generate SettingsTemplate.yaml" and save the result if you want to keep it.
+
+If you already have a SettingsTemplate.yaml file and would like to try editing it here, just copy its contents and paste it on this page.
+
+<settings-generator></settings-generator>
+
+<script>
+const element = document.querySelector('#__settings-script__');
+if (!element) {
+    const script = document.createElement('script');
+    script.id = '__settings-script__';
+    script.src = 'https://www.flowlauncher.com/docs/webcomponents/dist/flow-launcher-docs-web-components.js';
+    script.type = 'module';
+    document.body.appendChild(script);
+}
+</script>