Regex import/export

public/scripts/extensions/regex/dropdown.html

@@ -5,9 +5,16 @@
             <div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
         </div>
         <div class="inline-drawer-content">
-            <div id="open_regex_editor" class="menu_button">
+            <div class="flex-container">
-                <i class="fa-solid fa-pen-to-square"></i>
+                <div id="open_regex_editor" class="menu_button">
-                <span>Open Editor</span>
+                    <i class="fa-solid fa-pen-to-square"></i>
+                    <span>Open Editor</span>
+                </div>
+                <div id="import_regex" class="menu_button">
+                    <i class="fa-solid fa-file-import"></i>
+                    <span>Import Script</span>
+                </div>
+                <input type="file" id="import_regex_file" hidden accept="*.json" />
             </div>
             <hr />
             <label>Saved Scripts</label>

public/scripts/extensions/regex/index.js

@@ -1,7 +1,7 @@
 import { callPopup, getCurrentChatId, reloadCurrentChat, saveSettingsDebounced } from '../../../script.js';
 import { extension_settings } from '../../extensions.js';
 import { registerSlashCommand } from '../../slash-commands.js';
-import { getSortableDelay, uuidv4 } from '../../utils.js';
+import { download, getFileText, getSortableDelay, uuidv4 } from '../../utils.js';
 import { resolveVariable } from '../../variables.js';
 import { regex_placement, runRegexScript } from './engine.js';
 
@@ -93,6 +93,11 @@ async function loadRegexScripts() {
         scriptHtml.find('.edit_existing_regex').on('click', async function () {
             await onRegexEditorOpenClick(scriptHtml.attr('id'));
         });
+        scriptHtml.find('.export_regex').on('click', async function () {
+            const fileName = `${script.scriptName.replace(/[^a-z0-9]/gi, '_').toLowerCase()}.json`;
+            const fileData = JSON.stringify(script, null, 4);
+            download(fileData, fileName, 'application/json');
+        });
         scriptHtml.find('.delete_regex').on('click', async function () {
             const confirm = await callPopup('Are you sure you want to delete this regex script?', 'confirm');
 
@@ -270,6 +275,35 @@ function runRegexCallback(args, value) {
     return value;
 }
 
+/**
+ * Performs the import of the regex file.
+ * @param {File} file Input file
+ */
+async function onRegexImportFileChange(file) {
+    if (!file) {
+        toastr.error('No file provided.');
+        return;
+    }
+
+    try {
+        const fileText = await getFileText(file);
+        const regexScript = JSON.parse(fileText);
+        if (!regexScript.scriptName) {
+            throw new Error('No script name provided.');
+        }
+
+        extension_settings.regex.push(regexScript);
+
+        saveSettingsDebounced();
+        await loadRegexScripts();
+        toastr.success(`Regex script "${regexScript.scriptName}" imported.`);
+    } catch (error) {
+        console.log(error);
+        toastr.error('Invalid JSON file.');
+        return;
+    }
+}
+
 // Workaround for loading in sequence with other extensions
 // NOTE: Always puts extension at the top of the list, but this is fine since it's static
 jQuery(async () => {
@@ -287,6 +321,14 @@ jQuery(async () => {
     $('#open_regex_editor').on('click', function () {
         onRegexEditorOpenClick(false);
     });
+    $('#import_regex_file').on('change', async function () {
+        const inputElement = this instanceof HTMLInputElement && this;
+        await onRegexImportFileChange(inputElement.files[0]);
+        inputElement.value = '';
+    });
+    $('#import_regex').on('click', function () {
+        $('#import_regex_file').trigger('click');
+    });
 
     $('#saved_regex_scripts').sortable({
         delay: getSortableDelay(),

public/scripts/extensions/regex/scriptTemplate.html

@@ -7,10 +7,13 @@
             <span class="regex-toggle-on fa-solid fa-toggle-on" title="Disable script"></span>
             <span class="regex-toggle-off fa-solid fa-toggle-off" title="Enable script"></span>
         </label>
-        <div class="edit_existing_regex menu_button">
+        <div class="edit_existing_regex menu_button" title="Edit script">
             <i class="fa-solid fa-pencil"></i>
         </div>
-        <div class="delete_regex menu_button">
+        <div class="export_regex menu_button" title="Export script">
+            <i class="fa-solid fa-file-export"></i>
+        </div>
+        <div class="delete_regex menu_button" title="Delete script">
             <i class="fa-solid fa-trash"></i>
         </div>
     </div>