diff --git a/CHANGELOG.md b/CHANGELOG.md
index 21430e97..b69fa898 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,17 @@
  # ![ThunderAI icon](images/icon-32px.png "ThunderAI") ThunderAI Release Notes
 
 
+<h2>Version 1.1.0 - ??/??/2024</h2>
+<ul>
+<li>A prompt can be configured to request additional text from the user.</li>
+<li>Added custom prompts. See more info <a href="https://micz.it/thunderdbird-addon-thunderai/custom-prompts/">here</a>.</li>
+<li>Dark mode added.</li>
+</ul>
+<h2>Version 1.0.6 - 08/05/2024</h2>
+<ul>
+<li>Correctly handling a change in the ChatGPT web interface. See issue <a href="https://github.com/micz/ThunderAI/issues/43">#43</a></li>
+<li>Added a button to force the completion to display the 'Use last answer' button if ChatGPT has finished its work but the button has not appeared.</li>
+</ul>
 <h2>Version 1.0.5 - 03/05/2024</h2>
 <ul>
     <li>Fixed the handling of ChatGPT-4 in a large window. See issue <a href="https://github.com/micz/ThunderAI/issues/38">#38</a></li>
diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 5eaa8883..b2971320 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -54,6 +54,186 @@
     "description": ""
   },
 
+  "customPrompts_managePrompts": {
+    "message": "Manage Prompts",
+    "description": ""
+  },
+
+  "customPrompts_start_saving": {
+    "message": "Saving prompts...",
+    "description": ""
+  },
+
+  "customPrompts_reindexing_list": {
+    "message": "Reindexing list...",
+    "description": ""
+  },
+
+  "customPrompts_filtering_prompts": {
+    "message": "Filtering prompts...",
+    "description": ""
+  },
+
+  "customPrompts_saving_default_prompts": {
+    "message": "Saving default prompts...",
+    "description": ""
+  },
+
+  "customPrompts_saving_custom_prompts": {
+    "message": "Saving custom prompts...",
+    "description": ""
+  },
+
+  "customPrompts_reloading_menus": {
+    "message": "Reloading menus...",
+    "description": ""
+  },
+
+  "customPrompts_saved": {
+    "message": "Prompts saved!",
+    "description": ""
+  },
+
+  "customPrompts_managePrompts_statement": {
+    "message": "Manage your custom prompts.",
+    "description": ""
+  },
+
+  "customPrompts_form_label_ID": {
+    "message": "ID",
+    "description": ""
+  },
+
+  "customPrompts_form_label_ID_rules": {
+    "message": "Must be unique, lowercase and without spaces",
+    "description": ""
+  },
+
+  "customPrompts_form_label_Name": {
+    "message": "Name",
+    "description": ""
+  },
+
+  "customPrompts_form_label_Text": {
+    "message": "Prompt Text",
+    "description": ""
+  },
+
+  "customPrompts_form_label_Action": {
+    "message": "Action",
+    "description": ""
+  },
+
+  "customPrompts_form_label_need_selected": {
+    "message": "Text selection needed",
+    "description": ""
+  },
+
+  "customPrompts_form_label_need_signature": {
+    "message": "Always add the signature",
+    "description": ""
+  },
+
+  "customPrompts_form_label_need_custom_text": {
+    "message": "Ask for additional text",
+    "description": ""
+  },
+
+  "customPrompts_form_label_enabled": {
+    "message": "Enabled",
+    "description": ""
+  },
+
+  "customPrompts_form_required_fields": {
+    "message": "Required fields",
+    "description": ""
+  },
+
+  "customPrompts_btnEdit": {
+    "message": "Edit",
+    "description": ""
+  },
+
+  "customPrompts_btnCancel": {
+    "message": "Cancel",
+    "description": ""
+  },
+
+  "customPrompts_btnOK": {
+    "message": "OK",
+    "description": ""
+  },
+
+  "customPrompts_btnDelete": {
+    "message": "Delete",
+    "description": ""
+  },
+
+  "customPrompts_btnDelete_confirmText": {
+    "message": "Are you sure you want to delete this item?",
+    "description": ""
+  },
+
+  "customPrompts_unsaved_changes": {
+    "message": "There are unsaved changes!",
+    "description": ""
+  },
+
+  "customPrompts_btnSaveAll": {
+    "message": "Save All",
+    "description": ""
+  },
+
+  "customPrompts_save_button": {
+    "message": "Save",
+    "description": ""
+  },
+
+  "customPrompts_btnNew": {
+    "message": "Add New",
+    "description": ""
+  },
+
+  "customPrompts_btnAddNewCommit": {
+    "message": "Add the Prompt",
+    "description": ""
+  },
+
+  "customPrompts_add_to_menu": {
+    "message": "Add to menu",
+    "description": ""
+  },
+
+  "customPrompts_add_to_menu_always": {
+    "message": "Always",
+    "description": ""
+  },
+
+  "customPrompts_add_to_menu_reading": {
+    "message": "Reading an email",
+    "description": ""
+  },
+
+  "customPrompts_add_to_menu_composing": {
+    "message": "Composing an email",
+    "description": ""
+  },
+
+  "customPrompts_close_button": {
+    "message": "Close button",
+    "description": ""
+  },
+
+  "customPrompts_do_reply": {
+    "message": "Do reply",
+    "description": ""
+  },
+
+  "customPrompts_substitute_text": {
+    "message": "Substitute text",
+    "description": ""
+  },
+
   "chatgpt_win_working": {
     "message": "Work in progress...",
     "description": ""
@@ -99,6 +279,16 @@
     "description": ""
   },
 
+  "chatgpt_force_completion": {
+    "message": "force completion",
+    "description": ""
+  },
+
+  "chatgpt_force_completion_title": {
+    "message": "Click here to display the 'Use last answer' button if ChatGPT has finished its work but the button has not appeared.",
+    "description": ""
+  },
+
   "msg_prompt_too_long": {
     "message": "The text you provided is too long. You need to reduce it to use ChatGPT.",
     "description": ""
@@ -164,6 +354,11 @@
     "description": ""
   },
 
+  "prefs_OptionText_btnManagePrompts": {
+    "message": "Manage your prompts",
+    "description": ""
+  },
+
   "prefsInfoTitle": {
     "message": "Important Information",
     "description": ""
diff --git a/_locales/it/messages.json b/_locales/it/messages.json
index 1c189353..ec56a9c2 100644
--- a/_locales/it/messages.json
+++ b/_locales/it/messages.json
@@ -1,201 +1,318 @@
 {
   "extensionDescription": {
     "message": "Usa ChatGPT per migliorare le tue email!",
-    "description": "Descrizione dell'estensione."
+    "description": "Description of the extension."
   },
-
   "menu_title": {
     "message": "IA",
     "description": ""
   },
-
   "prompt_lang": {
     "message": "Rispondi in ",
     "description": ""
   },
-
   "prompt_reply": {
     "message": "Rispondi",
     "description": ""
   },
-
   "prompt_rewrite_polite": {
     "message": "Riscrivi cortese",
     "description": ""
   },
-
   "prompt_rewrite_formal": {
     "message": "Riscrivi formale",
     "description": ""
   },
-
   "prompt_classify": {
     "message": "Classifica",
     "description": ""
   },
-
   "prompt_summarize_this": {
     "message": "Riassumi",
     "description": ""
   },
-
   "prompt_translate_this": {
     "message": "Traduci",
     "description": ""
   },
-
   "prompt_this": {
     "message": "Chedi a ChatGPT",
     "description": ""
   },
-
   "prompt_selection_needed": {
     "message": "Per procedere è necessario che selezioni del testo!",
     "description": ""
   },
-
+  "customPrompts_managePrompts": {
+    "message": "Gestisci i prompt",
+    "description": ""
+  },
+  "customPrompts_start_saving": {
+    "message": "Salvataggio prompt in corso...",
+    "description": ""
+  },
+  "customPrompts_reindexing_list": {
+    "message": "Indicizzazione lista...",
+    "description": ""
+  },
+  "customPrompts_filtering_prompts": {
+    "message": "Applicazione filtro in corso...",
+    "description": ""
+  },
+  "customPrompts_saving_default_prompts": {
+    "message": "Salvataggio prompt di base...",
+    "description": ""
+  },
+  "customPrompts_saving_custom_prompts": {
+    "message": "Salvataggio prompt personalizzati...",
+    "description": ""
+  },
+  "customPrompts_reloading_menus": {
+    "message": "Caricamento menu aggiornati...",
+    "description": ""
+  },
+  "customPrompts_saved": {
+    "message": "Prompt salvati!",
+    "description": ""
+  },
+  "customPrompts_managePrompts_statement": {
+    "message": "Gestisci i tuoi prompt personalizzati.",
+    "description": ""
+  },
+  "customPrompts_form_label_ID": {
+    "message": "ID",
+    "description": ""
+  },
+  "customPrompts_form_label_ID_rules": {
+    "message": "Deve essere univoco, minuscolo e senza spazi.",
+    "description": ""
+  },
+  "customPrompts_form_label_Name": {
+    "message": "Nome",
+    "description": ""
+  },
+  "customPrompts_form_label_Text": {
+    "message": "Testo del prompt",
+    "description": ""
+  },
+  "customPrompts_form_label_Action": {
+    "message": "Azione",
+    "description": ""
+  },
+  "customPrompts_form_label_need_selected": {
+    "message": "Necessaria la selezione di testo",
+    "description": ""
+  },
+  "customPrompts_form_label_need_signature": {
+    "message": "Aggiungi sempre la firma",
+    "description": ""
+  },
+  "customPrompts_form_label_need_custom_text": {
+    "message": "Chiedi un testo aggiuntivo",
+    "description": ""
+  },
+  "customPrompts_form_label_enabled": {
+    "message": "Attivo",
+    "description": ""
+  },
+  "customPrompts_form_required_fields": {
+    "message": "Campi obbligatori",
+    "description": ""
+  },
+  "customPrompts_btnEdit": {
+    "message": "Modifica",
+    "description": ""
+  },
+  "customPrompts_btnCancel": {
+    "message": "Annulla",
+    "description": ""
+  },
+  "customPrompts_btnOK": {
+    "message": "OK",
+    "description": ""
+  },
+  "customPrompts_btnDelete": {
+    "message": "Cancella",
+    "description": ""
+  },
+  "customPrompts_btnDelete_confirmText": {
+    "message": "Sei sicuro di voler cancellare questo elemento?",
+    "description": ""
+  },
+  "customPrompts_unsaved_changes": {
+    "message": "Ci sono modifiche non salvate!",
+    "description": ""
+  },
+  "customPrompts_btnSaveAll": {
+    "message": "Salva Tutto",
+    "description": ""
+  },
+  "customPrompts_save_button": {
+    "message": "Salva",
+    "description": ""
+  },
+  "customPrompts_btnNew": {
+    "message": "Aggiungi Nuovo",
+    "description": ""
+  },
+  "customPrompts_btnAddNewCommit": {
+    "message": "Aggiungi il Prompt",
+    "description": ""
+  },
+  "customPrompts_add_to_menu": {
+    "message": "Aggiungi al menu",
+    "description": ""
+  },
+  "customPrompts_add_to_menu_always": {
+    "message": "Sempre",
+    "description": ""
+  },
+  "customPrompts_add_to_menu_reading": {
+    "message": "In lettura di una mail",
+    "description": ""
+  },
+  "customPrompts_add_to_menu_composing": {
+    "message": "In composizione di una mail",
+    "description": ""
+  },
+  "customPrompts_close_button": {
+    "message": "Pulsante chiudi",
+    "description": ""
+  },
+  "customPrompts_do_reply": {
+    "message": "Rispondi",
+    "description": ""
+  },
+  "customPrompts_substitute_text": {
+    "message": "Sostituisci il testo",
+    "description": ""
+  },
   "chatgpt_win_working": {
     "message": "Elaborazione in corso...",
     "description": ""
   },
-
   "chatgpt_win_job_completed": {
     "message": "Completato!",
     "description": ""
   },
-
   "chatgpt_win_get_answer": {
     "message": "Usa l'ultima risposta",
     "description": ""
   },
-
   "chatgpt_win_close": {
     "message": "Chiudi",
     "description": ""
   },
-
   "chatgpt_user_not_logged_in": {
     "message": "Non sei connesso a ChatGPT. Effettua l'accesso con le tue credenziali, chiudi la finestra di ChatGPT e poi ripeti l'azione che avevi tentato. Rimarrai connesso in seguito.",
     "description": ""
   },
-
   "chatgpt_win_model_warning": {
     "message": "Hai impostato l'opzione per utilizzare ChatGPT-4, ma sembra che non si stia caricando. Hai selezionato correttamente il modello in alto?",
     "description": ""
   },
-
   "chatgpt_win_custom_text": {
     "message": "Inserisci qui il testo aggiuntivo per il prompt.",
     "description": ""
   },
-
   "chatgpt_win_send": {
     "message": "Invia",
     "description": ""
   },
-
   "chatgpt_use_gpt35": {
     "message": "Usa GPT3.5",
     "description": ""
   },
-
+  "chatgpt_force_completion": {
+    "message": "forza il completamento",
+    "description": ""
+  },
+  "chatgpt_force_completion_title": {
+    "message": "Fai clic qui per visualizzare il pulsante 'Usa l'ultima risposta' se ChatGPT ha terminato il suo lavoro ma il pulsante non è apparso.",
+    "description": ""
+  },
   "msg_prompt_too_long": {
     "message": "Il testo che vuoi inviare a ChatGPT è troppo lungo. Devi ridurlo per poter procedere.",
     "description": ""
   },
-
   "prefs_OptionText_release_notes": {
     "message": "Note di rilascio",
     "description": ""
   },
-
   "prefs_status_page": {
     "message": "stato del servizio",
     "description": ""
   },
-
   "prefs_OptionText_chatgpt_win_text": {
     "message": "Dimensioni della finestra di ChatGPT",
     "description": ""
   },
-
   "prefs_OptionText_chatgpt_win_height": {
     "message": "Altezza",
     "description": ""
   },
-
   "prefs_OptionText_chatgpt_win_width": {
     "message": "Larghezza",
     "description": ""
   },
-
   "prefs_OptionText_default_sign_name": {
     "message": "Nome da utilizzare per la firma",
     "description": ""
   },
-
   "prefs_OptionText_default_chatgpt_lang": {
     "message": "Lingua predefinita per le risposte di ChatGPT",
     "description": ""
   },
-
   "prefs_OptionText_reply_all": {
     "message": "Rispondi a tutti",
     "description": ""
   },
-
   "prefs_OptionText_reply_sender": {
     "message": "Rispondi al mittente",
     "description": ""
   },
-
   "prefs_OptionText_reply_type": {
     "message": "Modalità di risposta",
     "description": ""
   },
-
   "prefs_OptionText_chatpgt_use_gpt4": {
     "message": "Usa il modello ChatGPT-4",
     "description": ""
   },
-
   "prefs_OptionText_chatpgt_use_gpt4_info": {
     "message": "Dopo aver modificato questa opzione, devi scegliere il modello corretto la prima volta che lo usi.",
     "description": ""
   },
-
+  "prefs_OptionText_btnManagePrompts": {
+    "message": "Gestisci i tuoi prompts",
+    "description": ""
+  },
   "prefsInfoTitle": {
     "message": "Informazioni Importanti",
     "description": ""
   },
-
   "prefsInfoDesc_1": {
     "message": "Non è più possibile disabilitare la cronologia delle chat di ChatGPT. Pertanto, non c'è modo di impedire che le richieste effettuate tramite questo componente aggiuntivo appaiano nella cronologia delle chat di ChatGPT.",
     "description": ""
   },
-
   "prefsInfoDesc_2": {
     "message": "Se all'apertura della finestra di ChatGPT, viene mostrata una pagina bianca, significa che c'è un problema di caricamento della pagina di ChatGPT, non relativo all'utilizzo di questo componente aggiuntivo.",
     "description": ""
   },
-
   "prefsInfoDesc_3": {
     "message": " ",
     "description": ""
   },
-
   "prefsDonation_1": {
     "message": "Ti piace questo componente aggiuntivo?",
     "description": ""
   },
-
   "prefsDonation_2": {
     "message": "Considera di fare una donazione!",
     "description": ""
   },
-
   "backToOptionsText": {
     "message": "Opzioni",
     "description": ""
   }
-}
+}
\ No newline at end of file
diff --git a/customprompts/list.js b/customprompts/list.js
new file mode 100644
index 00000000..33c3fbbc
--- /dev/null
+++ b/customprompts/list.js
@@ -0,0 +1,2020 @@
+var List;List =
+/******/ (function() { // webpackBootstrap
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./src/add-async.js":
+/*!**************************!*\
+  !*** ./src/add-async.js ***!
+  \**************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (list) {
+  var addAsync = function addAsync(values, callback, items) {
+    var valuesToAdd = values.splice(0, 50);
+    items = items || [];
+    items = items.concat(list.add(valuesToAdd));
+
+    if (values.length > 0) {
+      setTimeout(function () {
+        addAsync(values, callback, items);
+      }, 1);
+    } else {
+      list.update();
+      callback(items);
+    }
+  };
+
+  return addAsync;
+};
+
+/***/ }),
+
+/***/ "./src/filter.js":
+/*!***********************!*\
+  !*** ./src/filter.js ***!
+  \***********************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (list) {
+  // Add handlers
+  list.handlers.filterStart = list.handlers.filterStart || [];
+  list.handlers.filterComplete = list.handlers.filterComplete || [];
+  return function (filterFunction) {
+    list.trigger('filterStart');
+    list.i = 1; // Reset paging
+
+    list.reset.filter();
+
+    if (filterFunction === undefined) {
+      list.filtered = false;
+    } else {
+      list.filtered = true;
+      var is = list.items;
+
+      for (var i = 0, il = is.length; i < il; i++) {
+        var item = is[i];
+
+        if (filterFunction(item)) {
+          item.filtered = true;
+        } else {
+          item.filtered = false;
+        }
+      }
+    }
+
+    list.update();
+    list.trigger('filterComplete');
+    return list.visibleItems;
+  };
+};
+
+/***/ }),
+
+/***/ "./src/fuzzy-search.js":
+/*!*****************************!*\
+  !*** ./src/fuzzy-search.js ***!
+  \*****************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module, __webpack_require__ */
+/*! CommonJS bailout: module.exports is used directly at 8:0-14 */
+/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
+
+var classes = __webpack_require__(/*! ./utils/classes */ "./src/utils/classes.js"),
+    events = __webpack_require__(/*! ./utils/events */ "./src/utils/events.js"),
+    extend = __webpack_require__(/*! ./utils/extend */ "./src/utils/extend.js"),
+    toString = __webpack_require__(/*! ./utils/to-string */ "./src/utils/to-string.js"),
+    getByClass = __webpack_require__(/*! ./utils/get-by-class */ "./src/utils/get-by-class.js"),
+    fuzzy = __webpack_require__(/*! ./utils/fuzzy */ "./src/utils/fuzzy.js");
+
+module.exports = function (list, options) {
+  options = options || {};
+  options = extend({
+    location: 0,
+    distance: 100,
+    threshold: 0.4,
+    multiSearch: true,
+    searchClass: 'fuzzy-search'
+  }, options);
+  var fuzzySearch = {
+    search: function search(searchString, columns) {
+      // Substract arguments from the searchString or put searchString as only argument
+      var searchArguments = options.multiSearch ? searchString.replace(/ +$/, '').split(/ +/) : [searchString];
+
+      for (var k = 0, kl = list.items.length; k < kl; k++) {
+        fuzzySearch.item(list.items[k], columns, searchArguments);
+      }
+    },
+    item: function item(_item, columns, searchArguments) {
+      var found = true;
+
+      for (var i = 0; i < searchArguments.length; i++) {
+        var foundArgument = false;
+
+        for (var j = 0, jl = columns.length; j < jl; j++) {
+          if (fuzzySearch.values(_item.values(), columns[j], searchArguments[i])) {
+            foundArgument = true;
+          }
+        }
+
+        if (!foundArgument) {
+          found = false;
+        }
+      }
+
+      _item.found = found;
+    },
+    values: function values(_values, value, searchArgument) {
+      if (_values.hasOwnProperty(value)) {
+        var text = toString(_values[value]).toLowerCase();
+
+        if (fuzzy(text, searchArgument, options)) {
+          return true;
+        }
+      }
+
+      return false;
+    }
+  };
+  events.bind(getByClass(list.listContainer, options.searchClass), 'keyup', list.utils.events.debounce(function (e) {
+    var target = e.target || e.srcElement; // IE have srcElement
+
+    list.search(target.value, fuzzySearch.search);
+  }, list.searchDelay));
+  return function (str, columns) {
+    list.search(str, columns, fuzzySearch.search);
+  };
+};
+
+/***/ }),
+
+/***/ "./src/index.js":
+/*!**********************!*\
+  !*** ./src/index.js ***!
+  \**********************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module, __webpack_require__ */
+/*! CommonJS bailout: module.exports is used directly at 11:0-14 */
+/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
+
+var naturalSort = __webpack_require__(/*! string-natural-compare */ "./node_modules/string-natural-compare/natural-compare.js"),
+    getByClass = __webpack_require__(/*! ./utils/get-by-class */ "./src/utils/get-by-class.js"),
+    extend = __webpack_require__(/*! ./utils/extend */ "./src/utils/extend.js"),
+    indexOf = __webpack_require__(/*! ./utils/index-of */ "./src/utils/index-of.js"),
+    events = __webpack_require__(/*! ./utils/events */ "./src/utils/events.js"),
+    toString = __webpack_require__(/*! ./utils/to-string */ "./src/utils/to-string.js"),
+    classes = __webpack_require__(/*! ./utils/classes */ "./src/utils/classes.js"),
+    getAttribute = __webpack_require__(/*! ./utils/get-attribute */ "./src/utils/get-attribute.js"),
+    toArray = __webpack_require__(/*! ./utils/to-array */ "./src/utils/to-array.js");
+
+module.exports = function (id, options, values) {
+  var self = this,
+      init,
+      Item = __webpack_require__(/*! ./item */ "./src/item.js")(self),
+      addAsync = __webpack_require__(/*! ./add-async */ "./src/add-async.js")(self),
+      initPagination = __webpack_require__(/*! ./pagination */ "./src/pagination.js")(self);
+
+  init = {
+    start: function start() {
+      self.listClass = 'list';
+      self.searchClass = 'search';
+      self.sortClass = 'sort';
+      self.page = 10000;
+      self.i = 1;
+      self.items = [];
+      self.visibleItems = [];
+      self.matchingItems = [];
+      self.searched = false;
+      self.filtered = false;
+      self.searchColumns = undefined;
+      self.searchDelay = 0;
+      self.handlers = {
+        updated: []
+      };
+      self.valueNames = [];
+      self.utils = {
+        getByClass: getByClass,
+        extend: extend,
+        indexOf: indexOf,
+        events: events,
+        toString: toString,
+        naturalSort: naturalSort,
+        classes: classes,
+        getAttribute: getAttribute,
+        toArray: toArray
+      };
+      self.utils.extend(self, options);
+      self.listContainer = typeof id === 'string' ? document.getElementById(id) : id;
+
+      if (!self.listContainer) {
+        return;
+      }
+
+      self.list = getByClass(self.listContainer, self.listClass, true);
+      self.parse = __webpack_require__(/*! ./parse */ "./src/parse.js")(self);
+      self.templater = __webpack_require__(/*! ./templater */ "./src/templater.js")(self);
+      self.search = __webpack_require__(/*! ./search */ "./src/search.js")(self);
+      self.filter = __webpack_require__(/*! ./filter */ "./src/filter.js")(self);
+      self.sort = __webpack_require__(/*! ./sort */ "./src/sort.js")(self);
+      self.fuzzySearch = __webpack_require__(/*! ./fuzzy-search */ "./src/fuzzy-search.js")(self, options.fuzzySearch);
+      this.handlers();
+      this.items();
+      this.pagination();
+      self.update();
+    },
+    handlers: function handlers() {
+      for (var handler in self.handlers) {
+        if (self[handler] && self.handlers.hasOwnProperty(handler)) {
+          self.on(handler, self[handler]);
+        }
+      }
+    },
+    items: function items() {
+      self.parse(self.list);
+
+      if (values !== undefined) {
+        self.add(values);
+      }
+    },
+    pagination: function pagination() {
+      if (options.pagination !== undefined) {
+        if (options.pagination === true) {
+          options.pagination = [{}];
+        }
+
+        if (options.pagination[0] === undefined) {
+          options.pagination = [options.pagination];
+        }
+
+        for (var i = 0, il = options.pagination.length; i < il; i++) {
+          initPagination(options.pagination[i]);
+        }
+      }
+    }
+  };
+  /*
+   * Re-parse the List, use if html have changed
+   */
+
+  this.reIndex = function () {
+    self.items = [];
+    self.visibleItems = [];
+    self.matchingItems = [];
+    self.searched = false;
+    self.filtered = false;
+    self.parse(self.list);
+  };
+
+  this.toJSON = function () {
+    var json = [];
+
+    for (var i = 0, il = self.items.length; i < il; i++) {
+      json.push(self.items[i].values());
+    }
+
+    return json;
+  };
+  /*
+   * Add object to list
+   */
+
+
+  this.add = function (values, callback) {
+    if (values.length === 0) {
+      return;
+    }
+
+    if (callback) {
+      addAsync(values.slice(0), callback);
+      return;
+    }
+
+    var added = [],
+        notCreate = false;
+
+    if (values[0] === undefined) {
+      values = [values];
+    }
+
+    for (var i = 0, il = values.length; i < il; i++) {
+      var item = null;
+      notCreate = self.items.length > self.page ? true : false;
+      item = new Item(values[i], undefined, notCreate);
+      self.items.push(item);
+      added.push(item);
+    }
+
+    self.update();
+    return added;
+  };
+
+  this.show = function (i, page) {
+    this.i = i;
+    this.page = page;
+    self.update();
+    return self;
+  };
+  /* Removes object from list.
+   * Loops through the list and removes objects where
+   * property "valuename" === value
+   */
+
+
+  this.remove = function (valueName, value, options) {
+    var found = 0;
+
+    for (var i = 0, il = self.items.length; i < il; i++) {
+      if (self.items[i].values()[valueName] == value) {
+        self.templater.remove(self.items[i], options);
+        self.items.splice(i, 1);
+        il--;
+        i--;
+        found++;
+      }
+    }
+
+    self.update();
+    return found;
+  };
+  /* Gets the objects in the list which
+   * property "valueName" === value
+   */
+
+
+  this.get = function (valueName, value) {
+    var matchedItems = [];
+
+    for (var i = 0, il = self.items.length; i < il; i++) {
+      var item = self.items[i];
+
+      if (item.values()[valueName] == value) {
+        matchedItems.push(item);
+      }
+    }
+
+    return matchedItems;
+  };
+  /*
+   * Get size of the list
+   */
+
+
+  this.size = function () {
+    return self.items.length;
+  };
+  /*
+   * Removes all items from the list
+   */
+
+
+  this.clear = function () {
+    self.templater.clear();
+    self.items = [];
+    return self;
+  };
+
+  this.on = function (event, callback) {
+    self.handlers[event].push(callback);
+    return self;
+  };
+
+  this.off = function (event, callback) {
+    var e = self.handlers[event];
+    var index = indexOf(e, callback);
+
+    if (index > -1) {
+      e.splice(index, 1);
+    }
+
+    return self;
+  };
+
+  this.trigger = function (event) {
+    var i = self.handlers[event].length;
+
+    while (i--) {
+      self.handlers[event][i](self);
+    }
+
+    return self;
+  };
+
+  this.reset = {
+    filter: function filter() {
+      var is = self.items,
+          il = is.length;
+
+      while (il--) {
+        is[il].filtered = false;
+      }
+
+      return self;
+    },
+    search: function search() {
+      var is = self.items,
+          il = is.length;
+
+      while (il--) {
+        is[il].found = false;
+      }
+
+      return self;
+    }
+  };
+
+  this.update = function () {
+    var is = self.items,
+        il = is.length;
+    self.visibleItems = [];
+    self.matchingItems = [];
+    self.templater.clear();
+
+    for (var i = 0; i < il; i++) {
+      if (is[i].matching() && self.matchingItems.length + 1 >= self.i && self.visibleItems.length < self.page) {
+        is[i].show();
+        self.visibleItems.push(is[i]);
+        self.matchingItems.push(is[i]);
+      } else if (is[i].matching()) {
+        self.matchingItems.push(is[i]);
+        is[i].hide();
+      } else {
+        is[i].hide();
+      }
+    }
+
+    self.trigger('updated');
+    return self;
+  };
+
+  init.start();
+};
+
+/***/ }),
+
+/***/ "./src/item.js":
+/*!*********************!*\
+  !*** ./src/item.js ***!
+  \*********************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (list) {
+  return function (initValues, element, notCreate) {
+    var item = this;
+    this._values = {};
+    this.found = false; // Show if list.searched == true and this.found == true
+
+    this.filtered = false; // Show if list.filtered == true and this.filtered == true
+
+    var init = function init(initValues, element, notCreate) {
+      if (element === undefined) {
+        if (notCreate) {
+          item.values(initValues, notCreate);
+        } else {
+          item.values(initValues);
+        }
+      } else {
+        item.elm = element;
+        var values = list.templater.get(item, initValues);
+        item.values(values);
+      }
+    };
+
+    this.values = function (newValues, notCreate) {
+      if (newValues !== undefined) {
+        for (var name in newValues) {
+          item._values[name] = newValues[name];
+        }
+
+        if (notCreate !== true) {
+          list.templater.set(item, item.values());
+        }
+      } else {
+        return item._values;
+      }
+    };
+
+    this.show = function () {
+      list.templater.show(item);
+    };
+
+    this.hide = function () {
+      list.templater.hide(item);
+    };
+
+    this.matching = function () {
+      return list.filtered && list.searched && item.found && item.filtered || list.filtered && !list.searched && item.filtered || !list.filtered && list.searched && item.found || !list.filtered && !list.searched;
+    };
+
+    this.visible = function () {
+      return item.elm && item.elm.parentNode == list.list ? true : false;
+    };
+
+    init(initValues, element, notCreate);
+  };
+};
+
+/***/ }),
+
+/***/ "./src/pagination.js":
+/*!***************************!*\
+  !*** ./src/pagination.js ***!
+  \***************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module, __webpack_require__ */
+/*! CommonJS bailout: module.exports is used directly at 5:0-14 */
+/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
+
+var classes = __webpack_require__(/*! ./utils/classes */ "./src/utils/classes.js"),
+    events = __webpack_require__(/*! ./utils/events */ "./src/utils/events.js"),
+    List = __webpack_require__(/*! ./index */ "./src/index.js");
+
+module.exports = function (list) {
+  var isHidden = false;
+
+  var refresh = function refresh(pagingList, options) {
+    if (list.page < 1) {
+      list.listContainer.style.display = 'none';
+      isHidden = true;
+      return;
+    } else if (isHidden) {
+      list.listContainer.style.display = 'block';
+    }
+
+    var item,
+        l = list.matchingItems.length,
+        index = list.i,
+        page = list.page,
+        pages = Math.ceil(l / page),
+        currentPage = Math.ceil(index / page),
+        innerWindow = options.innerWindow || 2,
+        left = options.left || options.outerWindow || 0,
+        right = options.right || options.outerWindow || 0;
+    right = pages - right;
+    pagingList.clear();
+
+    for (var i = 1; i <= pages; i++) {
+      var className = currentPage === i ? 'active' : ''; //console.log(i, left, right, currentPage, (currentPage - innerWindow), (currentPage + innerWindow), className);
+
+      if (is.number(i, left, right, currentPage, innerWindow)) {
+        item = pagingList.add({
+          page: i,
+          dotted: false
+        })[0];
+
+        if (className) {
+          classes(item.elm).add(className);
+        }
+
+        item.elm.firstChild.setAttribute('data-i', i);
+        item.elm.firstChild.setAttribute('data-page', page);
+      } else if (is.dotted(pagingList, i, left, right, currentPage, innerWindow, pagingList.size())) {
+        item = pagingList.add({
+          page: '...',
+          dotted: true
+        })[0];
+        classes(item.elm).add('disabled');
+      }
+    }
+  };
+
+  var is = {
+    number: function number(i, left, right, currentPage, innerWindow) {
+      return this.left(i, left) || this.right(i, right) || this.innerWindow(i, currentPage, innerWindow);
+    },
+    left: function left(i, _left) {
+      return i <= _left;
+    },
+    right: function right(i, _right) {
+      return i > _right;
+    },
+    innerWindow: function innerWindow(i, currentPage, _innerWindow) {
+      return i >= currentPage - _innerWindow && i <= currentPage + _innerWindow;
+    },
+    dotted: function dotted(pagingList, i, left, right, currentPage, innerWindow, currentPageItem) {
+      return this.dottedLeft(pagingList, i, left, right, currentPage, innerWindow) || this.dottedRight(pagingList, i, left, right, currentPage, innerWindow, currentPageItem);
+    },
+    dottedLeft: function dottedLeft(pagingList, i, left, right, currentPage, innerWindow) {
+      return i == left + 1 && !this.innerWindow(i, currentPage, innerWindow) && !this.right(i, right);
+    },
+    dottedRight: function dottedRight(pagingList, i, left, right, currentPage, innerWindow, currentPageItem) {
+      if (pagingList.items[currentPageItem - 1].values().dotted) {
+        return false;
+      } else {
+        return i == right && !this.innerWindow(i, currentPage, innerWindow) && !this.right(i, right);
+      }
+    }
+  };
+  return function (options) {
+    var pagingList = new List(list.listContainer.id, {
+      listClass: options.paginationClass || 'pagination',
+      item: options.item || "<li><a class='page' href='#'></a></li>",
+      valueNames: ['page', 'dotted'],
+      searchClass: 'pagination-search-that-is-not-supposed-to-exist',
+      sortClass: 'pagination-sort-that-is-not-supposed-to-exist'
+    });
+    events.bind(pagingList.listContainer, 'click', function (e) {
+      var target = e.target || e.srcElement,
+          page = list.utils.getAttribute(target, 'data-page'),
+          i = list.utils.getAttribute(target, 'data-i');
+
+      if (i) {
+        list.show((i - 1) * page + 1, page);
+      }
+    });
+    list.on('updated', function () {
+      refresh(pagingList, options);
+    });
+    refresh(pagingList, options);
+  };
+};
+
+/***/ }),
+
+/***/ "./src/parse.js":
+/*!**********************!*\
+  !*** ./src/parse.js ***!
+  \**********************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module, __webpack_require__ */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
+
+module.exports = function (list) {
+  var Item = __webpack_require__(/*! ./item */ "./src/item.js")(list);
+
+  var getChildren = function getChildren(parent) {
+    var nodes = parent.childNodes,
+        items = [];
+
+    for (var i = 0, il = nodes.length; i < il; i++) {
+      // Only textnodes have a data attribute
+      if (nodes[i].data === undefined) {
+        items.push(nodes[i]);
+      }
+    }
+
+    return items;
+  };
+
+  var parse = function parse(itemElements, valueNames) {
+    for (var i = 0, il = itemElements.length; i < il; i++) {
+      list.items.push(new Item(valueNames, itemElements[i]));
+    }
+  };
+
+  var parseAsync = function parseAsync(itemElements, valueNames) {
+    var itemsToIndex = itemElements.splice(0, 50); // TODO: If < 100 items, what happens in IE etc?
+
+    parse(itemsToIndex, valueNames);
+
+    if (itemElements.length > 0) {
+      setTimeout(function () {
+        parseAsync(itemElements, valueNames);
+      }, 1);
+    } else {
+      list.update();
+      list.trigger('parseComplete');
+    }
+  };
+
+  list.handlers.parseComplete = list.handlers.parseComplete || [];
+  return function () {
+    var itemsToIndex = getChildren(list.list),
+        valueNames = list.valueNames;
+
+    if (list.indexAsync) {
+      parseAsync(itemsToIndex, valueNames);
+    } else {
+      parse(itemsToIndex, valueNames);
+    }
+  };
+};
+
+/***/ }),
+
+/***/ "./src/search.js":
+/*!***********************!*\
+  !*** ./src/search.js ***!
+  \***********************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (_list) {
+  var item, text, columns, searchString, customSearch;
+  var prepare = {
+    resetList: function resetList() {
+      _list.i = 1;
+
+      _list.templater.clear();
+
+      customSearch = undefined;
+    },
+    setOptions: function setOptions(args) {
+      if (args.length == 2 && args[1] instanceof Array) {
+        columns = args[1];
+      } else if (args.length == 2 && typeof args[1] == 'function') {
+        columns = undefined;
+        customSearch = args[1];
+      } else if (args.length == 3) {
+        columns = args[1];
+        customSearch = args[2];
+      } else {
+        columns = undefined;
+      }
+    },
+    setColumns: function setColumns() {
+      if (_list.items.length === 0) return;
+
+      if (columns === undefined) {
+        columns = _list.searchColumns === undefined ? prepare.toArray(_list.items[0].values()) : _list.searchColumns;
+      }
+    },
+    setSearchString: function setSearchString(s) {
+      s = _list.utils.toString(s).toLowerCase();
+      s = s.replace(/[-[\]{}()*+?.,\\^$|#]/g, '\\$&'); // Escape regular expression characters
+
+      searchString = s;
+    },
+    toArray: function toArray(values) {
+      var tmpColumn = [];
+
+      for (var name in values) {
+        tmpColumn.push(name);
+      }
+
+      return tmpColumn;
+    }
+  };
+  var search = {
+    list: function list() {
+      // Extract quoted phrases "word1 word2" from original searchString
+      // searchString is converted to lowercase by List.js
+      var words = [],
+          phrase,
+          ss = searchString;
+
+      while ((phrase = ss.match(/"([^"]+)"/)) !== null) {
+        words.push(phrase[1]);
+        ss = ss.substring(0, phrase.index) + ss.substring(phrase.index + phrase[0].length);
+      } // Get remaining space-separated words (if any)
+
+
+      ss = ss.trim();
+      if (ss.length) words = words.concat(ss.split(/\s+/));
+
+      for (var k = 0, kl = _list.items.length; k < kl; k++) {
+        var item = _list.items[k];
+        item.found = false;
+        if (!words.length) continue;
+
+        for (var i = 0, il = words.length; i < il; i++) {
+          var word_found = false;
+
+          for (var j = 0, jl = columns.length; j < jl; j++) {
+            var values = item.values(),
+                column = columns[j];
+
+            if (values.hasOwnProperty(column) && values[column] !== undefined && values[column] !== null) {
+              var text = typeof values[column] !== 'string' ? values[column].toString() : values[column];
+
+              if (text.toLowerCase().indexOf(words[i]) !== -1) {
+                // word found, so no need to check it against any other columns
+                word_found = true;
+                break;
+              }
+            }
+          } // this word not found? no need to check any other words, the item cannot match
+
+
+          if (!word_found) break;
+        }
+
+        item.found = word_found;
+      }
+    },
+    // Removed search.item() and search.values()
+    reset: function reset() {
+      _list.reset.search();
+
+      _list.searched = false;
+    }
+  };
+
+  var searchMethod = function searchMethod(str) {
+    _list.trigger('searchStart');
+
+    prepare.resetList();
+    prepare.setSearchString(str);
+    prepare.setOptions(arguments); // str, cols|searchFunction, searchFunction
+
+    prepare.setColumns();
+
+    if (searchString === '') {
+      search.reset();
+    } else {
+      _list.searched = true;
+
+      if (customSearch) {
+        customSearch(searchString, columns);
+      } else {
+        search.list();
+      }
+    }
+
+    _list.update();
+
+    _list.trigger('searchComplete');
+
+    return _list.visibleItems;
+  };
+
+  _list.handlers.searchStart = _list.handlers.searchStart || [];
+  _list.handlers.searchComplete = _list.handlers.searchComplete || [];
+
+  _list.utils.events.bind(_list.utils.getByClass(_list.listContainer, _list.searchClass), 'keyup', _list.utils.events.debounce(function (e) {
+    var target = e.target || e.srcElement,
+        // IE have srcElement
+    alreadyCleared = target.value === '' && !_list.searched;
+
+    if (!alreadyCleared) {
+      // If oninput already have resetted the list, do nothing
+      searchMethod(target.value);
+    }
+  }, _list.searchDelay)); // Used to detect click on HTML5 clear button
+
+
+  _list.utils.events.bind(_list.utils.getByClass(_list.listContainer, _list.searchClass), 'input', function (e) {
+    var target = e.target || e.srcElement;
+
+    if (target.value === '') {
+      searchMethod('');
+    }
+  });
+
+  return searchMethod;
+};
+
+/***/ }),
+
+/***/ "./src/sort.js":
+/*!*********************!*\
+  !*** ./src/sort.js ***!
+  \*********************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (list) {
+  var buttons = {
+    els: undefined,
+    clear: function clear() {
+      for (var i = 0, il = buttons.els.length; i < il; i++) {
+        list.utils.classes(buttons.els[i]).remove('asc');
+        list.utils.classes(buttons.els[i]).remove('desc');
+      }
+    },
+    getOrder: function getOrder(btn) {
+      var predefinedOrder = list.utils.getAttribute(btn, 'data-order');
+
+      if (predefinedOrder == 'asc' || predefinedOrder == 'desc') {
+        return predefinedOrder;
+      } else if (list.utils.classes(btn).has('desc')) {
+        return 'asc';
+      } else if (list.utils.classes(btn).has('asc')) {
+        return 'desc';
+      } else {
+        return 'asc';
+      }
+    },
+    getInSensitive: function getInSensitive(btn, options) {
+      var insensitive = list.utils.getAttribute(btn, 'data-insensitive');
+
+      if (insensitive === 'false') {
+        options.insensitive = false;
+      } else {
+        options.insensitive = true;
+      }
+    },
+    setOrder: function setOrder(options) {
+      for (var i = 0, il = buttons.els.length; i < il; i++) {
+        var btn = buttons.els[i];
+
+        if (list.utils.getAttribute(btn, 'data-sort') !== options.valueName) {
+          continue;
+        }
+
+        var predefinedOrder = list.utils.getAttribute(btn, 'data-order');
+
+        if (predefinedOrder == 'asc' || predefinedOrder == 'desc') {
+          if (predefinedOrder == options.order) {
+            list.utils.classes(btn).add(options.order);
+          }
+        } else {
+          list.utils.classes(btn).add(options.order);
+        }
+      }
+    }
+  };
+
+  var sort = function sort() {
+    list.trigger('sortStart');
+    var options = {};
+    var target = arguments[0].currentTarget || arguments[0].srcElement || undefined;
+
+    if (target) {
+      options.valueName = list.utils.getAttribute(target, 'data-sort');
+      buttons.getInSensitive(target, options);
+      options.order = buttons.getOrder(target);
+    } else {
+      options = arguments[1] || options;
+      options.valueName = arguments[0];
+      options.order = options.order || 'asc';
+      options.insensitive = typeof options.insensitive == 'undefined' ? true : options.insensitive;
+    }
+
+    buttons.clear();
+    buttons.setOrder(options); // caseInsensitive
+    // alphabet
+
+    var customSortFunction = options.sortFunction || list.sortFunction || null,
+        multi = options.order === 'desc' ? -1 : 1,
+        sortFunction;
+
+    if (customSortFunction) {
+      sortFunction = function sortFunction(itemA, itemB) {
+        return customSortFunction(itemA, itemB, options) * multi;
+      };
+    } else {
+      sortFunction = function sortFunction(itemA, itemB) {
+        var sort = list.utils.naturalSort;
+        sort.alphabet = list.alphabet || options.alphabet || undefined;
+
+        if (!sort.alphabet && options.insensitive) {
+          sort = list.utils.naturalSort.caseInsensitive;
+        }
+
+        return sort(itemA.values()[options.valueName], itemB.values()[options.valueName]) * multi;
+      };
+    }
+
+    list.items.sort(sortFunction);
+    list.update();
+    list.trigger('sortComplete');
+  }; // Add handlers
+
+
+  list.handlers.sortStart = list.handlers.sortStart || [];
+  list.handlers.sortComplete = list.handlers.sortComplete || [];
+  buttons.els = list.utils.getByClass(list.listContainer, list.sortClass);
+  list.utils.events.bind(buttons.els, 'click', sort);
+  list.on('searchStart', buttons.clear);
+  list.on('filterStart', buttons.clear);
+  return sort;
+};
+
+/***/ }),
+
+/***/ "./src/templater.js":
+/*!**************************!*\
+  !*** ./src/templater.js ***!
+  \**************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 216:0-14 */
+/***/ (function(module) {
+
+var Templater = function Templater(list) {
+  var createItem,
+      templater = this;
+
+  var init = function init() {
+    var itemSource;
+
+    if (typeof list.item === 'function') {
+      createItem = function createItem(values) {
+        var item = list.item(values);
+        return getItemSource(item);
+      };
+
+      return;
+    }
+
+    if (typeof list.item === 'string') {
+      if (list.item.indexOf('<') === -1) {
+        itemSource = document.getElementById(list.item);
+      } else {
+        itemSource = getItemSource(list.item);
+      }
+    } else {
+      /* If item source does not exists, use the first item in list as
+      source for new items */
+      itemSource = getFirstListItem();
+    }
+
+    if (!itemSource) {
+      throw new Error("The list needs to have at least one item on init otherwise you'll have to add a template.");
+    }
+
+    itemSource = createCleanTemplateItem(itemSource, list.valueNames);
+
+    createItem = function createItem() {
+      return itemSource.cloneNode(true);
+    };
+  };
+
+  var createCleanTemplateItem = function createCleanTemplateItem(templateNode, valueNames) {
+    var el = templateNode.cloneNode(true);
+    el.removeAttribute('id');
+
+    for (var i = 0, il = valueNames.length; i < il; i++) {
+      var elm = undefined,
+          valueName = valueNames[i];
+
+      if (valueName.data) {
+        for (var j = 0, jl = valueName.data.length; j < jl; j++) {
+          el.setAttribute('data-' + valueName.data[j], '');
+        }
+      } else if (valueName.attr && valueName.name) {
+        elm = list.utils.getByClass(el, valueName.name, true);
+
+        if (elm) {
+          elm.setAttribute(valueName.attr, '');
+        }
+      } else {
+        elm = list.utils.getByClass(el, valueName, true);
+
+        if (elm) {
+          elm.innerHTML = '';
+        }
+      }
+    }
+
+    return el;
+  };
+
+  var getFirstListItem = function getFirstListItem() {
+    var nodes = list.list.childNodes;
+
+    for (var i = 0, il = nodes.length; i < il; i++) {
+      // Only textnodes have a data attribute
+      if (nodes[i].data === undefined) {
+        return nodes[i].cloneNode(true);
+      }
+    }
+
+    return undefined;
+  };
+
+  var getItemSource = function getItemSource(itemHTML) {
+    if (typeof itemHTML !== 'string') return undefined;
+
+    if (/<tr[\s>]/g.exec(itemHTML)) {
+      var tbody = document.createElement('tbody');
+      tbody.innerHTML = itemHTML;
+      return tbody.firstElementChild;
+    } else if (itemHTML.indexOf('<') !== -1) {
+      var div = document.createElement('div');
+      div.innerHTML = itemHTML;
+      return div.firstElementChild;
+    }
+
+    return undefined;
+  };
+
+  var getValueName = function getValueName(name) {
+    for (var i = 0, il = list.valueNames.length; i < il; i++) {
+      var valueName = list.valueNames[i];
+
+      if (valueName.data) {
+        var data = valueName.data;
+
+        for (var j = 0, jl = data.length; j < jl; j++) {
+          if (data[j] === name) {
+            return {
+              data: name
+            };
+          }
+        }
+      } else if (valueName.attr && valueName.name && valueName.name == name) {
+        return valueName;
+      } else if (valueName === name) {
+        return name;
+      }
+    }
+  };
+
+  var setValue = function setValue(item, name, value) {
+    var elm = undefined,
+        valueName = getValueName(name);
+    if (!valueName) return;
+
+    if (valueName.data) {
+      item.elm.setAttribute('data-' + valueName.data, value);
+    } else if (valueName.attr && valueName.name) {
+      elm = list.utils.getByClass(item.elm, valueName.name, true);
+
+      if (elm) {
+        elm.setAttribute(valueName.attr, value);
+      }
+    } else {
+      elm = list.utils.getByClass(item.elm, valueName, true);
+
+      if (elm) {
+        elm.innerHTML = value;
+      }
+    }
+  };
+
+  this.get = function (item, valueNames) {
+    templater.create(item);
+    var values = {};
+
+    for (var i = 0, il = valueNames.length; i < il; i++) {
+      var elm = undefined,
+          valueName = valueNames[i];
+
+      if (valueName.data) {
+        for (var j = 0, jl = valueName.data.length; j < jl; j++) {
+          values[valueName.data[j]] = list.utils.getAttribute(item.elm, 'data-' + valueName.data[j]);
+        }
+      } else if (valueName.attr && valueName.name) {
+        elm = list.utils.getByClass(item.elm, valueName.name, true);
+        values[valueName.name] = elm ? list.utils.getAttribute(elm, valueName.attr) : '';
+      } else {
+        elm = list.utils.getByClass(item.elm, valueName, true);
+        values[valueName] = elm ? elm.innerHTML : '';
+      }
+    }
+
+    return values;
+  };
+
+  this.set = function (item, values) {
+    if (!templater.create(item)) {
+      for (var v in values) {
+        if (values.hasOwnProperty(v)) {
+          setValue(item, v, values[v]);
+        }
+      }
+    }
+  };
+
+  this.create = function (item) {
+    if (item.elm !== undefined) {
+      return false;
+    }
+
+    item.elm = createItem(item.values());
+    templater.set(item, item.values());
+    return true;
+  };
+
+  this.remove = function (item) {
+    if (item.elm.parentNode === list.list) {
+      list.list.removeChild(item.elm);
+    }
+  };
+
+  this.show = function (item) {
+    templater.create(item);
+    list.list.appendChild(item.elm);
+  };
+
+  this.hide = function (item) {
+    if (item.elm !== undefined && item.elm.parentNode === list.list) {
+      list.list.removeChild(item.elm);
+    }
+  };
+
+  this.clear = function () {
+    /* .innerHTML = ''; fucks up IE */
+    if (list.list.hasChildNodes()) {
+      while (list.list.childNodes.length >= 1) {
+        list.list.removeChild(list.list.firstChild);
+      }
+    }
+  };
+
+  init();
+};
+
+module.exports = function (list) {
+  return new Templater(list);
+};
+
+/***/ }),
+
+/***/ "./src/utils/classes.js":
+/*!******************************!*\
+  !*** ./src/utils/classes.js ***!
+  \******************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module, __webpack_require__ */
+/*! CommonJS bailout: module.exports is used directly at 24:0-14 */
+/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
+
+/**
+ * Module dependencies.
+ */
+var index = __webpack_require__(/*! ./index-of */ "./src/utils/index-of.js");
+/**
+ * Whitespace regexp.
+ */
+
+
+var re = /\s+/;
+/**
+ * toString reference.
+ */
+
+var toString = Object.prototype.toString;
+/**
+ * Wrap `el` in a `ClassList`.
+ *
+ * @param {Element} el
+ * @return {ClassList}
+ * @api public
+ */
+
+module.exports = function (el) {
+  return new ClassList(el);
+};
+/**
+ * Initialize a new ClassList for `el`.
+ *
+ * @param {Element} el
+ * @api private
+ */
+
+
+function ClassList(el) {
+  if (!el || !el.nodeType) {
+    throw new Error('A DOM element reference is required');
+  }
+
+  this.el = el;
+  this.list = el.classList;
+}
+/**
+ * Add class `name` if not already present.
+ *
+ * @param {String} name
+ * @return {ClassList}
+ * @api public
+ */
+
+
+ClassList.prototype.add = function (name) {
+  // classList
+  if (this.list) {
+    this.list.add(name);
+    return this;
+  } // fallback
+
+
+  var arr = this.array();
+  var i = index(arr, name);
+  if (!~i) arr.push(name);
+  this.el.className = arr.join(' ');
+  return this;
+};
+/**
+ * Remove class `name` when present, or
+ * pass a regular expression to remove
+ * any which match.
+ *
+ * @param {String|RegExp} name
+ * @return {ClassList}
+ * @api public
+ */
+
+
+ClassList.prototype.remove = function (name) {
+  // classList
+  if (this.list) {
+    this.list.remove(name);
+    return this;
+  } // fallback
+
+
+  var arr = this.array();
+  var i = index(arr, name);
+  if (~i) arr.splice(i, 1);
+  this.el.className = arr.join(' ');
+  return this;
+};
+/**
+ * Toggle class `name`, can force state via `force`.
+ *
+ * For browsers that support classList, but do not support `force` yet,
+ * the mistake will be detected and corrected.
+ *
+ * @param {String} name
+ * @param {Boolean} force
+ * @return {ClassList}
+ * @api public
+ */
+
+
+ClassList.prototype.toggle = function (name, force) {
+  // classList
+  if (this.list) {
+    if ('undefined' !== typeof force) {
+      if (force !== this.list.toggle(name, force)) {
+        this.list.toggle(name); // toggle again to correct
+      }
+    } else {
+      this.list.toggle(name);
+    }
+
+    return this;
+  } // fallback
+
+
+  if ('undefined' !== typeof force) {
+    if (!force) {
+      this.remove(name);
+    } else {
+      this.add(name);
+    }
+  } else {
+    if (this.has(name)) {
+      this.remove(name);
+    } else {
+      this.add(name);
+    }
+  }
+
+  return this;
+};
+/**
+ * Return an array of classes.
+ *
+ * @return {Array}
+ * @api public
+ */
+
+
+ClassList.prototype.array = function () {
+  var className = this.el.getAttribute('class') || '';
+  var str = className.replace(/^\s+|\s+$/g, '');
+  var arr = str.split(re);
+  if ('' === arr[0]) arr.shift();
+  return arr;
+};
+/**
+ * Check if class `name` is present.
+ *
+ * @param {String} name
+ * @return {ClassList}
+ * @api public
+ */
+
+
+ClassList.prototype.has = ClassList.prototype.contains = function (name) {
+  return this.list ? this.list.contains(name) : !!~index(this.array(), name);
+};
+
+/***/ }),
+
+/***/ "./src/utils/events.js":
+/*!*****************************!*\
+  !*** ./src/utils/events.js ***!
+  \*****************************/
+/*! default exports */
+/*! export bind [provided] [no usage info] [missing usage info prevents renaming] */
+/*! export debounce [provided] [no usage info] [missing usage info prevents renaming] */
+/*! export unbind [provided] [no usage info] [missing usage info prevents renaming] */
+/*! other exports [not provided] [no usage info] */
+/*! runtime requirements: __webpack_exports__, __webpack_require__ */
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+var bind = window.addEventListener ? 'addEventListener' : 'attachEvent',
+    unbind = window.removeEventListener ? 'removeEventListener' : 'detachEvent',
+    prefix = bind !== 'addEventListener' ? 'on' : '',
+    toArray = __webpack_require__(/*! ./to-array */ "./src/utils/to-array.js");
+/**
+ * Bind `el` event `type` to `fn`.
+ *
+ * @param {Element} el, NodeList, HTMLCollection or Array
+ * @param {String} type
+ * @param {Function} fn
+ * @param {Boolean} capture
+ * @api public
+ */
+
+
+exports.bind = function (el, type, fn, capture) {
+  el = toArray(el);
+
+  for (var i = 0, il = el.length; i < il; i++) {
+    el[i][bind](prefix + type, fn, capture || false);
+  }
+};
+/**
+ * Unbind `el` event `type`'s callback `fn`.
+ *
+ * @param {Element} el, NodeList, HTMLCollection or Array
+ * @param {String} type
+ * @param {Function} fn
+ * @param {Boolean} capture
+ * @api public
+ */
+
+
+exports.unbind = function (el, type, fn, capture) {
+  el = toArray(el);
+
+  for (var i = 0, il = el.length; i < il; i++) {
+    el[i][unbind](prefix + type, fn, capture || false);
+  }
+};
+/**
+ * Returns a function, that, as long as it continues to be invoked, will not
+ * be triggered. The function will be called after it stops being called for
+ * `wait` milliseconds. If `immediate` is true, trigger the function on the
+ * leading edge, instead of the trailing.
+ *
+ * @param {Function} fn
+ * @param {Integer} wait
+ * @param {Boolean} immediate
+ * @api public
+ */
+
+
+exports.debounce = function (fn, wait, immediate) {
+  var timeout;
+  return wait ? function () {
+    var context = this,
+        args = arguments;
+
+    var later = function later() {
+      timeout = null;
+      if (!immediate) fn.apply(context, args);
+    };
+
+    var callNow = immediate && !timeout;
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+    if (callNow) fn.apply(context, args);
+  } : fn;
+};
+
+/***/ }),
+
+/***/ "./src/utils/extend.js":
+/*!*****************************!*\
+  !*** ./src/utils/extend.js ***!
+  \*****************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 4:0-14 */
+/***/ (function(module) {
+
+/*
+ * Source: https://github.com/segmentio/extend
+ */
+module.exports = function extend(object) {
+  // Takes an unlimited number of extenders.
+  var args = Array.prototype.slice.call(arguments, 1); // For each extender, copy their properties on our object.
+
+  for (var i = 0, source; source = args[i]; i++) {
+    if (!source) continue;
+
+    for (var property in source) {
+      object[property] = source[property];
+    }
+  }
+
+  return object;
+};
+
+/***/ }),
+
+/***/ "./src/utils/fuzzy.js":
+/*!****************************!*\
+  !*** ./src/utils/fuzzy.js ***!
+  \****************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (text, pattern, options) {
+  // Aproximately where in the text is the pattern expected to be found?
+  var Match_Location = options.location || 0; //Determines how close the match must be to the fuzzy location (specified above). An exact letter match which is 'distance' characters away from the fuzzy location would score as a complete mismatch. A distance of '0' requires the match be at the exact location specified, a threshold of '1000' would require a perfect match to be within 800 characters of the fuzzy location to be found using a 0.8 threshold.
+
+  var Match_Distance = options.distance || 100; // At what point does the match algorithm give up. A threshold of '0.0' requires a perfect match (of both letters and location), a threshold of '1.0' would match anything.
+
+  var Match_Threshold = options.threshold || 0.4;
+  if (pattern === text) return true; // Exact match
+
+  if (pattern.length > 32) return false; // This algorithm cannot be used
+  // Set starting location at beginning text and initialise the alphabet.
+
+  var loc = Match_Location,
+      s = function () {
+    var q = {},
+        i;
+
+    for (i = 0; i < pattern.length; i++) {
+      q[pattern.charAt(i)] = 0;
+    }
+
+    for (i = 0; i < pattern.length; i++) {
+      q[pattern.charAt(i)] |= 1 << pattern.length - i - 1;
+    }
+
+    return q;
+  }(); // Compute and return the score for a match with e errors and x location.
+  // Accesses loc and pattern through being a closure.
+
+
+  function match_bitapScore_(e, x) {
+    var accuracy = e / pattern.length,
+        proximity = Math.abs(loc - x);
+
+    if (!Match_Distance) {
+      // Dodge divide by zero error.
+      return proximity ? 1.0 : accuracy;
+    }
+
+    return accuracy + proximity / Match_Distance;
+  }
+
+  var score_threshold = Match_Threshold,
+      // Highest score beyond which we give up.
+  best_loc = text.indexOf(pattern, loc); // Is there a nearby exact match? (speedup)
+
+  if (best_loc != -1) {
+    score_threshold = Math.min(match_bitapScore_(0, best_loc), score_threshold); // What about in the other direction? (speedup)
+
+    best_loc = text.lastIndexOf(pattern, loc + pattern.length);
+
+    if (best_loc != -1) {
+      score_threshold = Math.min(match_bitapScore_(0, best_loc), score_threshold);
+    }
+  } // Initialise the bit arrays.
+
+
+  var matchmask = 1 << pattern.length - 1;
+  best_loc = -1;
+  var bin_min, bin_mid;
+  var bin_max = pattern.length + text.length;
+  var last_rd;
+
+  for (var d = 0; d < pattern.length; d++) {
+    // Scan for the best match; each iteration allows for one more error.
+    // Run a binary search to determine how far from 'loc' we can stray at this
+    // error level.
+    bin_min = 0;
+    bin_mid = bin_max;
+
+    while (bin_min < bin_mid) {
+      if (match_bitapScore_(d, loc + bin_mid) <= score_threshold) {
+        bin_min = bin_mid;
+      } else {
+        bin_max = bin_mid;
+      }
+
+      bin_mid = Math.floor((bin_max - bin_min) / 2 + bin_min);
+    } // Use the result from this iteration as the maximum for the next.
+
+
+    bin_max = bin_mid;
+    var start = Math.max(1, loc - bin_mid + 1);
+    var finish = Math.min(loc + bin_mid, text.length) + pattern.length;
+    var rd = Array(finish + 2);
+    rd[finish + 1] = (1 << d) - 1;
+
+    for (var j = finish; j >= start; j--) {
+      // The alphabet (s) is a sparse hash, so the following line generates
+      // warnings.
+      var charMatch = s[text.charAt(j - 1)];
+
+      if (d === 0) {
+        // First pass: exact match.
+        rd[j] = (rd[j + 1] << 1 | 1) & charMatch;
+      } else {
+        // Subsequent passes: fuzzy match.
+        rd[j] = (rd[j + 1] << 1 | 1) & charMatch | ((last_rd[j + 1] | last_rd[j]) << 1 | 1) | last_rd[j + 1];
+      }
+
+      if (rd[j] & matchmask) {
+        var score = match_bitapScore_(d, j - 1); // This match will almost certainly be better than any existing match.
+        // But check anyway.
+
+        if (score <= score_threshold) {
+          // Told you so.
+          score_threshold = score;
+          best_loc = j - 1;
+
+          if (best_loc > loc) {
+            // When passing loc, don't exceed our current distance from loc.
+            start = Math.max(1, 2 * loc - best_loc);
+          } else {
+            // Already passed loc, downhill from here on in.
+            break;
+          }
+        }
+      }
+    } // No hope for a (better) match at greater error levels.
+
+
+    if (match_bitapScore_(d + 1, loc) > score_threshold) {
+      break;
+    }
+
+    last_rd = rd;
+  }
+
+  return best_loc < 0 ? false : true;
+};
+
+/***/ }),
+
+/***/ "./src/utils/get-attribute.js":
+/*!************************************!*\
+  !*** ./src/utils/get-attribute.js ***!
+  \************************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 11:0-14 */
+/***/ (function(module) {
+
+/**
+ * A cross-browser implementation of getAttribute.
+ * Source found here: http://stackoverflow.com/a/3755343/361337 written by Vivin Paliath
+ *
+ * Return the value for `attr` at `element`.
+ *
+ * @param {Element} el
+ * @param {String} attr
+ * @api public
+ */
+module.exports = function (el, attr) {
+  var result = el.getAttribute && el.getAttribute(attr) || null;
+
+  if (!result) {
+    var attrs = el.attributes;
+    var length = attrs.length;
+
+    for (var i = 0; i < length; i++) {
+      if (attrs[i] !== undefined) {
+        if (attrs[i].nodeName === attr) {
+          result = attrs[i].nodeValue;
+        }
+      }
+    }
+  }
+
+  return result;
+};
+
+/***/ }),
+
+/***/ "./src/utils/get-by-class.js":
+/*!***********************************!*\
+  !*** ./src/utils/get-by-class.js ***!
+  \***********************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 53:0-14 */
+/***/ (function(module) {
+
+/**
+ * A cross-browser implementation of getElementsByClass.
+ * Heavily based on Dustin Diaz's function: http://dustindiaz.com/getelementsbyclass.
+ *
+ * Find all elements with class `className` inside `container`.
+ * Use `single = true` to increase performance in older browsers
+ * when only one element is needed.
+ *
+ * @param {String} className
+ * @param {Element} container
+ * @param {Boolean} single
+ * @api public
+ */
+var getElementsByClassName = function getElementsByClassName(container, className, single) {
+  if (single) {
+    return container.getElementsByClassName(className)[0];
+  } else {
+    return container.getElementsByClassName(className);
+  }
+};
+
+var querySelector = function querySelector(container, className, single) {
+  className = '.' + className;
+
+  if (single) {
+    return container.querySelector(className);
+  } else {
+    return container.querySelectorAll(className);
+  }
+};
+
+var polyfill = function polyfill(container, className, single) {
+  var classElements = [],
+      tag = '*';
+  var els = container.getElementsByTagName(tag);
+  var elsLen = els.length;
+  var pattern = new RegExp('(^|\\s)' + className + '(\\s|$)');
+
+  for (var i = 0, j = 0; i < elsLen; i++) {
+    if (pattern.test(els[i].className)) {
+      if (single) {
+        return els[i];
+      } else {
+        classElements[j] = els[i];
+        j++;
+      }
+    }
+  }
+
+  return classElements;
+};
+
+module.exports = function () {
+  return function (container, className, single, options) {
+    options = options || {};
+
+    if (options.test && options.getElementsByClassName || !options.test && document.getElementsByClassName) {
+      return getElementsByClassName(container, className, single);
+    } else if (options.test && options.querySelector || !options.test && document.querySelector) {
+      return querySelector(container, className, single);
+    } else {
+      return polyfill(container, className, single);
+    }
+  };
+}();
+
+/***/ }),
+
+/***/ "./src/utils/index-of.js":
+/*!*******************************!*\
+  !*** ./src/utils/index-of.js ***!
+  \*******************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 3:0-14 */
+/***/ (function(module) {
+
+var indexOf = [].indexOf;
+
+module.exports = function (arr, obj) {
+  if (indexOf) return arr.indexOf(obj);
+
+  for (var i = 0, il = arr.length; i < il; ++i) {
+    if (arr[i] === obj) return i;
+  }
+
+  return -1;
+};
+
+/***/ }),
+
+/***/ "./src/utils/to-array.js":
+/*!*******************************!*\
+  !*** ./src/utils/to-array.js ***!
+  \*******************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 11:0-14 */
+/***/ (function(module) {
+
+/**
+ * Source: https://github.com/timoxley/to-array
+ *
+ * Convert an array-like object into an `Array`.
+ * If `collection` is already an `Array`, then will return a clone of `collection`.
+ *
+ * @param {Array | Mixed} collection An `Array` or array-like object to convert e.g. `arguments` or `NodeList`
+ * @return {Array} Naive conversion of `collection` to a new `Array`.
+ * @api public
+ */
+module.exports = function toArray(collection) {
+  if (typeof collection === 'undefined') return [];
+  if (collection === null) return [null];
+  if (collection === window) return [window];
+  if (typeof collection === 'string') return [collection];
+  if (isArray(collection)) return collection;
+  if (typeof collection.length != 'number') return [collection];
+  if (typeof collection === 'function' && collection instanceof Function) return [collection];
+  var arr = [];
+
+  for (var i = 0, il = collection.length; i < il; i++) {
+    if (Object.prototype.hasOwnProperty.call(collection, i) || i in collection) {
+      arr.push(collection[i]);
+    }
+  }
+
+  if (!arr.length) return [];
+  return arr;
+};
+
+function isArray(arr) {
+  return Object.prototype.toString.call(arr) === '[object Array]';
+}
+
+/***/ }),
+
+/***/ "./src/utils/to-string.js":
+/*!********************************!*\
+  !*** ./src/utils/to-string.js ***!
+  \********************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 1:0-14 */
+/***/ (function(module) {
+
+module.exports = function (s) {
+  s = s === undefined ? '' : s;
+  s = s === null ? '' : s;
+  s = s.toString();
+  return s;
+};
+
+/***/ }),
+
+/***/ "./node_modules/string-natural-compare/natural-compare.js":
+/*!****************************************************************!*\
+  !*** ./node_modules/string-natural-compare/natural-compare.js ***!
+  \****************************************************************/
+/*! unknown exports (runtime-defined) */
+/*! runtime requirements: module */
+/*! CommonJS bailout: module.exports is used directly at 124:0-14 */
+/***/ (function(module) {
+
+"use strict";
+
+
+var alphabet;
+var alphabetIndexMap;
+var alphabetIndexMapLength = 0;
+
+function isNumberCode(code) {
+  return code >= 48 && code <= 57;
+}
+
+function naturalCompare(a, b) {
+  var lengthA = (a += '').length;
+  var lengthB = (b += '').length;
+  var aIndex = 0;
+  var bIndex = 0;
+
+  while (aIndex < lengthA && bIndex < lengthB) {
+    var charCodeA = a.charCodeAt(aIndex);
+    var charCodeB = b.charCodeAt(bIndex);
+
+    if (isNumberCode(charCodeA)) {
+      if (!isNumberCode(charCodeB)) {
+        return charCodeA - charCodeB;
+      }
+
+      var numStartA = aIndex;
+      var numStartB = bIndex;
+
+      while (charCodeA === 48 && ++numStartA < lengthA) {
+        charCodeA = a.charCodeAt(numStartA);
+      }
+      while (charCodeB === 48 && ++numStartB < lengthB) {
+        charCodeB = b.charCodeAt(numStartB);
+      }
+
+      var numEndA = numStartA;
+      var numEndB = numStartB;
+
+      while (numEndA < lengthA && isNumberCode(a.charCodeAt(numEndA))) {
+        ++numEndA;
+      }
+      while (numEndB < lengthB && isNumberCode(b.charCodeAt(numEndB))) {
+        ++numEndB;
+      }
+
+      var difference = numEndA - numStartA - numEndB + numStartB; // numA length - numB length
+      if (difference) {
+        return difference;
+      }
+
+      while (numStartA < numEndA) {
+        difference = a.charCodeAt(numStartA++) - b.charCodeAt(numStartB++);
+        if (difference) {
+          return difference;
+        }
+      }
+
+      aIndex = numEndA;
+      bIndex = numEndB;
+      continue;
+    }
+
+    if (charCodeA !== charCodeB) {
+      if (
+        charCodeA < alphabetIndexMapLength &&
+        charCodeB < alphabetIndexMapLength &&
+        alphabetIndexMap[charCodeA] !== -1 &&
+        alphabetIndexMap[charCodeB] !== -1
+      ) {
+        return alphabetIndexMap[charCodeA] - alphabetIndexMap[charCodeB];
+      }
+
+      return charCodeA - charCodeB;
+    }
+
+    ++aIndex;
+    ++bIndex;
+  }
+
+  if (aIndex >= lengthA && bIndex < lengthB && lengthA >= lengthB) {
+    return -1;
+  }
+
+  if (bIndex >= lengthB && aIndex < lengthA && lengthB >= lengthA) {
+    return 1;
+  }
+
+  return lengthA - lengthB;
+}
+
+naturalCompare.caseInsensitive = naturalCompare.i = function(a, b) {
+  return naturalCompare(('' + a).toLowerCase(), ('' + b).toLowerCase());
+};
+
+Object.defineProperties(naturalCompare, {
+  alphabet: {
+    get: function() {
+      return alphabet;
+    },
+
+    set: function(value) {
+      alphabet = value;
+      alphabetIndexMap = [];
+
+      var i = 0;
+
+      if (alphabet) {
+        for (; i < alphabet.length; i++) {
+          alphabetIndexMap[alphabet.charCodeAt(i)] = i;
+        }
+      }
+
+      alphabetIndexMapLength = alphabetIndexMap.length;
+
+      for (i = 0; i < alphabetIndexMapLength; i++) {
+        if (alphabetIndexMap[i] === undefined) {
+          alphabetIndexMap[i] = -1;
+        }
+      }
+    },
+  },
+});
+
+module.exports = naturalCompare;
+
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	// The module cache
+/******/ 	var __webpack_module_cache__ = {};
+/******/ 	
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/ 		// Check if module is in cache
+/******/ 		if(__webpack_module_cache__[moduleId]) {
+/******/ 			return __webpack_module_cache__[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
+/******/ 			exports: {}
+/******/ 		};
+/******/ 	
+/******/ 		// Execute the module function
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 	
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/ 	
+/************************************************************************/
+/******/ 	// module exports must be returned from runtime so entry inlining is disabled
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__("./src/index.js");
+/******/ })()
+;
+//# sourceMappingURL=./list.js.map
\ No newline at end of file
diff --git a/customprompts/list.js.map b/customprompts/list.js.map
new file mode 100644
index 00000000..7f040d38
--- /dev/null
+++ b/customprompts/list.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"list.js","mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;ACfA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;AC3BA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAIA;AACA;AACA;AAGA;AACA;AACA;AACA;;;;;;;ACrEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;ACtQA;AACA;AACA;AAEA;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAMA;AAEA;AACA;AACA;AAEA;AACA;AACA;;;;;;;AC3DA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;;;;;;;AC3GA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;AC7CA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAIA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;ACtIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAIA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;;;;;;;AClHA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;;;;;;;AClMA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;;;;;;ACjKA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;;;;ACnEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;ACjBA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;AC1HA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;ACzBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;AC9DA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;ACRA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;;;;;;AChCA;AACA;AACA;AACA;AACA;AACA;;;;;;;;ACLA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;AC1IA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AEvBA;AACA;AACA;AACA","sources":["webpack://List/./src/add-async.js","webpack://List/./src/filter.js","webpack://List/./src/fuzzy-search.js","webpack://List/./src/index.js","webpack://List/./src/item.js","webpack://List/./src/pagination.js","webpack://List/./src/parse.js","webpack://List/./src/search.js","webpack://List/./src/sort.js","webpack://List/./src/templater.js","webpack://List/./src/utils/classes.js","webpack://List/./src/utils/events.js","webpack://List/./src/utils/extend.js","webpack://List/./src/utils/fuzzy.js","webpack://List/./src/utils/get-attribute.js","webpack://List/./src/utils/get-by-class.js","webpack://List/./src/utils/index-of.js","webpack://List/./src/utils/to-array.js","webpack://List/./src/utils/to-string.js","webpack://List/./node_modules/string-natural-compare/natural-compare.js","webpack://List/webpack/bootstrap","webpack://List/webpack/before-startup","webpack://List/webpack/startup","webpack://List/webpack/after-startup"],"sourcesContent":["module.exports = function (list) {\n  var addAsync = function (values, callback, items) {\n    var valuesToAdd = values.splice(0, 50)\n    items = items || []\n    items = items.concat(list.add(valuesToAdd))\n    if (values.length > 0) {\n      setTimeout(function () {\n        addAsync(values, callback, items)\n      }, 1)\n    } else {\n      list.update()\n      callback(items)\n    }\n  }\n  return addAsync\n}\n","module.exports = function (list) {\n  // Add handlers\n  list.handlers.filterStart = list.handlers.filterStart || []\n  list.handlers.filterComplete = list.handlers.filterComplete || []\n\n  return function (filterFunction) {\n    list.trigger('filterStart')\n    list.i = 1 // Reset paging\n    list.reset.filter()\n    if (filterFunction === undefined) {\n      list.filtered = false\n    } else {\n      list.filtered = true\n      var is = list.items\n      for (var i = 0, il = is.length; i < il; i++) {\n        var item = is[i]\n        if (filterFunction(item)) {\n          item.filtered = true\n        } else {\n          item.filtered = false\n        }\n      }\n    }\n    list.update()\n    list.trigger('filterComplete')\n    return list.visibleItems\n  }\n}\n","var classes = require('./utils/classes'),\n  events = require('./utils/events'),\n  extend = require('./utils/extend'),\n  toString = require('./utils/to-string'),\n  getByClass = require('./utils/get-by-class'),\n  fuzzy = require('./utils/fuzzy')\n\nmodule.exports = function (list, options) {\n  options = options || {}\n\n  options = extend(\n    {\n      location: 0,\n      distance: 100,\n      threshold: 0.4,\n      multiSearch: true,\n      searchClass: 'fuzzy-search',\n    },\n    options\n  )\n\n  var fuzzySearch = {\n    search: function (searchString, columns) {\n      // Substract arguments from the searchString or put searchString as only argument\n      var searchArguments = options.multiSearch ? searchString.replace(/ +$/, '').split(/ +/) : [searchString]\n\n      for (var k = 0, kl = list.items.length; k < kl; k++) {\n        fuzzySearch.item(list.items[k], columns, searchArguments)\n      }\n    },\n    item: function (item, columns, searchArguments) {\n      var found = true\n      for (var i = 0; i < searchArguments.length; i++) {\n        var foundArgument = false\n        for (var j = 0, jl = columns.length; j < jl; j++) {\n          if (fuzzySearch.values(item.values(), columns[j], searchArguments[i])) {\n            foundArgument = true\n          }\n        }\n        if (!foundArgument) {\n          found = false\n        }\n      }\n      item.found = found\n    },\n    values: function (values, value, searchArgument) {\n      if (values.hasOwnProperty(value)) {\n        var text = toString(values[value]).toLowerCase()\n\n        if (fuzzy(text, searchArgument, options)) {\n          return true\n        }\n      }\n      return false\n    },\n  }\n\n  events.bind(\n    getByClass(list.listContainer, options.searchClass),\n    'keyup',\n    list.utils.events.debounce(function (e) {\n      var target = e.target || e.srcElement // IE have srcElement\n      list.search(target.value, fuzzySearch.search)\n    }, list.searchDelay)\n  )\n\n  return function (str, columns) {\n    list.search(str, columns, fuzzySearch.search)\n  }\n}\n","var naturalSort = require('string-natural-compare'),\n  getByClass = require('./utils/get-by-class'),\n  extend = require('./utils/extend'),\n  indexOf = require('./utils/index-of'),\n  events = require('./utils/events'),\n  toString = require('./utils/to-string'),\n  classes = require('./utils/classes'),\n  getAttribute = require('./utils/get-attribute'),\n  toArray = require('./utils/to-array')\n\nmodule.exports = function (id, options, values) {\n  var self = this,\n    init,\n    Item = require('./item')(self),\n    addAsync = require('./add-async')(self),\n    initPagination = require('./pagination')(self)\n\n  init = {\n    start: function () {\n      self.listClass = 'list'\n      self.searchClass = 'search'\n      self.sortClass = 'sort'\n      self.page = 10000\n      self.i = 1\n      self.items = []\n      self.visibleItems = []\n      self.matchingItems = []\n      self.searched = false\n      self.filtered = false\n      self.searchColumns = undefined\n      self.searchDelay = 0\n      self.handlers = { updated: [] }\n      self.valueNames = []\n      self.utils = {\n        getByClass: getByClass,\n        extend: extend,\n        indexOf: indexOf,\n        events: events,\n        toString: toString,\n        naturalSort: naturalSort,\n        classes: classes,\n        getAttribute: getAttribute,\n        toArray: toArray,\n      }\n\n      self.utils.extend(self, options)\n\n      self.listContainer = typeof id === 'string' ? document.getElementById(id) : id\n      if (!self.listContainer) {\n        return\n      }\n      self.list = getByClass(self.listContainer, self.listClass, true)\n\n      self.parse = require('./parse')(self)\n      self.templater = require('./templater')(self)\n      self.search = require('./search')(self)\n      self.filter = require('./filter')(self)\n      self.sort = require('./sort')(self)\n      self.fuzzySearch = require('./fuzzy-search')(self, options.fuzzySearch)\n\n      this.handlers()\n      this.items()\n      this.pagination()\n\n      self.update()\n    },\n    handlers: function () {\n      for (var handler in self.handlers) {\n        if (self[handler] && self.handlers.hasOwnProperty(handler)) {\n          self.on(handler, self[handler])\n        }\n      }\n    },\n    items: function () {\n      self.parse(self.list)\n      if (values !== undefined) {\n        self.add(values)\n      }\n    },\n    pagination: function () {\n      if (options.pagination !== undefined) {\n        if (options.pagination === true) {\n          options.pagination = [{}]\n        }\n        if (options.pagination[0] === undefined) {\n          options.pagination = [options.pagination]\n        }\n        for (var i = 0, il = options.pagination.length; i < il; i++) {\n          initPagination(options.pagination[i])\n        }\n      }\n    },\n  }\n\n  /*\n   * Re-parse the List, use if html have changed\n   */\n  this.reIndex = function () {\n    self.items = []\n    self.visibleItems = []\n    self.matchingItems = []\n    self.searched = false\n    self.filtered = false\n    self.parse(self.list)\n  }\n\n  this.toJSON = function () {\n    var json = []\n    for (var i = 0, il = self.items.length; i < il; i++) {\n      json.push(self.items[i].values())\n    }\n    return json\n  }\n\n  /*\n   * Add object to list\n   */\n  this.add = function (values, callback) {\n    if (values.length === 0) {\n      return\n    }\n    if (callback) {\n      addAsync(values.slice(0), callback)\n      return\n    }\n    var added = [],\n      notCreate = false\n    if (values[0] === undefined) {\n      values = [values]\n    }\n    for (var i = 0, il = values.length; i < il; i++) {\n      var item = null\n      notCreate = self.items.length > self.page ? true : false\n      item = new Item(values[i], undefined, notCreate)\n      self.items.push(item)\n      added.push(item)\n    }\n    self.update()\n    return added\n  }\n\n  this.show = function (i, page) {\n    this.i = i\n    this.page = page\n    self.update()\n    return self\n  }\n\n  /* Removes object from list.\n   * Loops through the list and removes objects where\n   * property \"valuename\" === value\n   */\n  this.remove = function (valueName, value, options) {\n    var found = 0\n    for (var i = 0, il = self.items.length; i < il; i++) {\n      if (self.items[i].values()[valueName] == value) {\n        self.templater.remove(self.items[i], options)\n        self.items.splice(i, 1)\n        il--\n        i--\n        found++\n      }\n    }\n    self.update()\n    return found\n  }\n\n  /* Gets the objects in the list which\n   * property \"valueName\" === value\n   */\n  this.get = function (valueName, value) {\n    var matchedItems = []\n    for (var i = 0, il = self.items.length; i < il; i++) {\n      var item = self.items[i]\n      if (item.values()[valueName] == value) {\n        matchedItems.push(item)\n      }\n    }\n    return matchedItems\n  }\n\n  /*\n   * Get size of the list\n   */\n  this.size = function () {\n    return self.items.length\n  }\n\n  /*\n   * Removes all items from the list\n   */\n  this.clear = function () {\n    self.templater.clear()\n    self.items = []\n    return self\n  }\n\n  this.on = function (event, callback) {\n    self.handlers[event].push(callback)\n    return self\n  }\n\n  this.off = function (event, callback) {\n    var e = self.handlers[event]\n    var index = indexOf(e, callback)\n    if (index > -1) {\n      e.splice(index, 1)\n    }\n    return self\n  }\n\n  this.trigger = function (event) {\n    var i = self.handlers[event].length\n    while (i--) {\n      self.handlers[event][i](self)\n    }\n    return self\n  }\n\n  this.reset = {\n    filter: function () {\n      var is = self.items,\n        il = is.length\n      while (il--) {\n        is[il].filtered = false\n      }\n      return self\n    },\n    search: function () {\n      var is = self.items,\n        il = is.length\n      while (il--) {\n        is[il].found = false\n      }\n      return self\n    },\n  }\n\n  this.update = function () {\n    var is = self.items,\n      il = is.length\n\n    self.visibleItems = []\n    self.matchingItems = []\n    self.templater.clear()\n    for (var i = 0; i < il; i++) {\n      if (is[i].matching() && self.matchingItems.length + 1 >= self.i && self.visibleItems.length < self.page) {\n        is[i].show()\n        self.visibleItems.push(is[i])\n        self.matchingItems.push(is[i])\n      } else if (is[i].matching()) {\n        self.matchingItems.push(is[i])\n        is[i].hide()\n      } else {\n        is[i].hide()\n      }\n    }\n    self.trigger('updated')\n    return self\n  }\n\n  init.start()\n}\n","module.exports = function (list) {\n  return function (initValues, element, notCreate) {\n    var item = this\n\n    this._values = {}\n\n    this.found = false // Show if list.searched == true and this.found == true\n    this.filtered = false // Show if list.filtered == true and this.filtered == true\n\n    var init = function (initValues, element, notCreate) {\n      if (element === undefined) {\n        if (notCreate) {\n          item.values(initValues, notCreate)\n        } else {\n          item.values(initValues)\n        }\n      } else {\n        item.elm = element\n        var values = list.templater.get(item, initValues)\n        item.values(values)\n      }\n    }\n\n    this.values = function (newValues, notCreate) {\n      if (newValues !== undefined) {\n        for (var name in newValues) {\n          item._values[name] = newValues[name]\n        }\n        if (notCreate !== true) {\n          list.templater.set(item, item.values())\n        }\n      } else {\n        return item._values\n      }\n    }\n\n    this.show = function () {\n      list.templater.show(item)\n    }\n\n    this.hide = function () {\n      list.templater.hide(item)\n    }\n\n    this.matching = function () {\n      return (\n        (list.filtered && list.searched && item.found && item.filtered) ||\n        (list.filtered && !list.searched && item.filtered) ||\n        (!list.filtered && list.searched && item.found) ||\n        (!list.filtered && !list.searched)\n      )\n    }\n\n    this.visible = function () {\n      return item.elm && item.elm.parentNode == list.list ? true : false\n    }\n\n    init(initValues, element, notCreate)\n  }\n}\n","var classes = require('./utils/classes'),\n  events = require('./utils/events'),\n  List = require('./index')\n\nmodule.exports = function (list) {\n  var isHidden = false\n\n  var refresh = function (pagingList, options) {\n    if (list.page < 1) {\n      list.listContainer.style.display = 'none'\n      isHidden = true\n      return\n    } else if (isHidden) {\n      list.listContainer.style.display = 'block'\n    }\n\n    var item,\n      l = list.matchingItems.length,\n      index = list.i,\n      page = list.page,\n      pages = Math.ceil(l / page),\n      currentPage = Math.ceil(index / page),\n      innerWindow = options.innerWindow || 2,\n      left = options.left || options.outerWindow || 0,\n      right = options.right || options.outerWindow || 0\n\n    right = pages - right\n    pagingList.clear()\n    for (var i = 1; i <= pages; i++) {\n      var className = currentPage === i ? 'active' : ''\n\n      //console.log(i, left, right, currentPage, (currentPage - innerWindow), (currentPage + innerWindow), className);\n\n      if (is.number(i, left, right, currentPage, innerWindow)) {\n        item = pagingList.add({\n          page: i,\n          dotted: false,\n        })[0]\n        if (className) {\n          classes(item.elm).add(className)\n        }\n        item.elm.firstChild.setAttribute('data-i', i)\n        item.elm.firstChild.setAttribute('data-page', page)\n      } else if (is.dotted(pagingList, i, left, right, currentPage, innerWindow, pagingList.size())) {\n        item = pagingList.add({\n          page: '...',\n          dotted: true,\n        })[0]\n        classes(item.elm).add('disabled')\n      }\n    }\n  }\n\n  var is = {\n    number: function (i, left, right, currentPage, innerWindow) {\n      return this.left(i, left) || this.right(i, right) || this.innerWindow(i, currentPage, innerWindow)\n    },\n    left: function (i, left) {\n      return i <= left\n    },\n    right: function (i, right) {\n      return i > right\n    },\n    innerWindow: function (i, currentPage, innerWindow) {\n      return i >= currentPage - innerWindow && i <= currentPage + innerWindow\n    },\n    dotted: function (pagingList, i, left, right, currentPage, innerWindow, currentPageItem) {\n      return (\n        this.dottedLeft(pagingList, i, left, right, currentPage, innerWindow) ||\n        this.dottedRight(pagingList, i, left, right, currentPage, innerWindow, currentPageItem)\n      )\n    },\n    dottedLeft: function (pagingList, i, left, right, currentPage, innerWindow) {\n      return i == left + 1 && !this.innerWindow(i, currentPage, innerWindow) && !this.right(i, right)\n    },\n    dottedRight: function (pagingList, i, left, right, currentPage, innerWindow, currentPageItem) {\n      if (pagingList.items[currentPageItem - 1].values().dotted) {\n        return false\n      } else {\n        return i == right && !this.innerWindow(i, currentPage, innerWindow) && !this.right(i, right)\n      }\n    },\n  }\n\n  return function (options) {\n    var pagingList = new List(list.listContainer.id, {\n      listClass: options.paginationClass || 'pagination',\n      item: options.item || \"<li><a class='page' href='#'></a></li>\",\n      valueNames: ['page', 'dotted'],\n      searchClass: 'pagination-search-that-is-not-supposed-to-exist',\n      sortClass: 'pagination-sort-that-is-not-supposed-to-exist',\n    })\n\n    events.bind(pagingList.listContainer, 'click', function (e) {\n      var target = e.target || e.srcElement,\n        page = list.utils.getAttribute(target, 'data-page'),\n        i = list.utils.getAttribute(target, 'data-i')\n      if (i) {\n        list.show((i - 1) * page + 1, page)\n      }\n    })\n\n    list.on('updated', function () {\n      refresh(pagingList, options)\n    })\n    refresh(pagingList, options)\n  }\n}\n","module.exports = function (list) {\n  var Item = require('./item')(list)\n\n  var getChildren = function (parent) {\n    var nodes = parent.childNodes,\n      items = []\n    for (var i = 0, il = nodes.length; i < il; i++) {\n      // Only textnodes have a data attribute\n      if (nodes[i].data === undefined) {\n        items.push(nodes[i])\n      }\n    }\n    return items\n  }\n\n  var parse = function (itemElements, valueNames) {\n    for (var i = 0, il = itemElements.length; i < il; i++) {\n      list.items.push(new Item(valueNames, itemElements[i]))\n    }\n  }\n  var parseAsync = function (itemElements, valueNames) {\n    var itemsToIndex = itemElements.splice(0, 50) // TODO: If < 100 items, what happens in IE etc?\n    parse(itemsToIndex, valueNames)\n    if (itemElements.length > 0) {\n      setTimeout(function () {\n        parseAsync(itemElements, valueNames)\n      }, 1)\n    } else {\n      list.update()\n      list.trigger('parseComplete')\n    }\n  }\n\n  list.handlers.parseComplete = list.handlers.parseComplete || []\n\n  return function () {\n    var itemsToIndex = getChildren(list.list),\n      valueNames = list.valueNames\n\n    if (list.indexAsync) {\n      parseAsync(itemsToIndex, valueNames)\n    } else {\n      parse(itemsToIndex, valueNames)\n    }\n  }\n}\n","module.exports = function (list) {\n  var item, text, columns, searchString, customSearch\n\n  var prepare = {\n    resetList: function () {\n      list.i = 1\n      list.templater.clear()\n      customSearch = undefined\n    },\n    setOptions: function (args) {\n      if (args.length == 2 && args[1] instanceof Array) {\n        columns = args[1]\n      } else if (args.length == 2 && typeof args[1] == 'function') {\n        columns = undefined\n        customSearch = args[1]\n      } else if (args.length == 3) {\n        columns = args[1]\n        customSearch = args[2]\n      } else {\n        columns = undefined\n      }\n    },\n    setColumns: function () {\n      if (list.items.length === 0) return\n      if (columns === undefined) {\n        columns = list.searchColumns === undefined ? prepare.toArray(list.items[0].values()) : list.searchColumns\n      }\n    },\n    setSearchString: function (s) {\n      s = list.utils.toString(s).toLowerCase()\n      searchString = s\n    },\n    toArray: function (values) {\n      var tmpColumn = []\n      for (var name in values) {\n        tmpColumn.push(name)\n      }\n      return tmpColumn\n    },\n  }\n  var search = {\n    list: function () {\n      // Extract quoted phrases \"word1 word2\" from original searchString\n      // searchString is converted to lowercase by List.js\n      var words = [],\n        phrase,\n        ss = searchString\n      while ((phrase = ss.match(/\"([^\"]+)\"/)) !== null) {\n        words.push(phrase[1])\n        ss = ss.substring(0, phrase.index) + ss.substring(phrase.index + phrase[0].length)\n      }\n      // Get remaining space-separated words (if any)\n      ss = ss.trim()\n      if (ss.length) words = words.concat(ss.split(/\\s+/))\n      for (var k = 0, kl = list.items.length; k < kl; k++) {\n        var item = list.items[k]\n        item.found = false\n        if (!words.length) continue\n        for (var i = 0, il = words.length; i < il; i++) {\n          var word_found = false\n          for (var j = 0, jl = columns.length; j < jl; j++) {\n            var values = item.values(),\n              column = columns[j]\n            if (values.hasOwnProperty(column) && values[column] !== undefined && values[column] !== null) {\n              var text = typeof values[column] !== 'string' ? values[column].toString() : values[column]\n              if (text.toLowerCase().indexOf(words[i]) !== -1) {\n                // word found, so no need to check it against any other columns\n                word_found = true\n                break\n              }\n            }\n          }\n          // this word not found? no need to check any other words, the item cannot match\n          if (!word_found) break\n        }\n        item.found = word_found\n      }\n    },\n    // Removed search.item() and search.values()\n    reset: function () {\n      list.reset.search()\n      list.searched = false\n    },\n  }\n\n  var searchMethod = function (str) {\n    list.trigger('searchStart')\n\n    prepare.resetList()\n    prepare.setSearchString(str)\n    prepare.setOptions(arguments) // str, cols|searchFunction, searchFunction\n    prepare.setColumns()\n\n    if (searchString === '') {\n      search.reset()\n    } else {\n      list.searched = true\n      if (customSearch) {\n        customSearch(searchString, columns)\n      } else {\n        search.list()\n      }\n    }\n\n    list.update()\n    list.trigger('searchComplete')\n    return list.visibleItems\n  }\n\n  list.handlers.searchStart = list.handlers.searchStart || []\n  list.handlers.searchComplete = list.handlers.searchComplete || []\n\n  list.utils.events.bind(\n    list.utils.getByClass(list.listContainer, list.searchClass),\n    'keyup',\n    list.utils.events.debounce(function (e) {\n      var target = e.target || e.srcElement, // IE have srcElement\n        alreadyCleared = target.value === '' && !list.searched\n      if (!alreadyCleared) {\n        // If oninput already have resetted the list, do nothing\n        searchMethod(target.value)\n      }\n    }, list.searchDelay)\n  )\n\n  // Used to detect click on HTML5 clear button\n  list.utils.events.bind(list.utils.getByClass(list.listContainer, list.searchClass), 'input', function (e) {\n    var target = e.target || e.srcElement\n    if (target.value === '') {\n      searchMethod('')\n    }\n  })\n\n  return searchMethod\n}\n","module.exports = function (list) {\n  var buttons = {\n    els: undefined,\n    clear: function () {\n      for (var i = 0, il = buttons.els.length; i < il; i++) {\n        list.utils.classes(buttons.els[i]).remove('asc')\n        list.utils.classes(buttons.els[i]).remove('desc')\n      }\n    },\n    getOrder: function (btn) {\n      var predefinedOrder = list.utils.getAttribute(btn, 'data-order')\n      if (predefinedOrder == 'asc' || predefinedOrder == 'desc') {\n        return predefinedOrder\n      } else if (list.utils.classes(btn).has('desc')) {\n        return 'asc'\n      } else if (list.utils.classes(btn).has('asc')) {\n        return 'desc'\n      } else {\n        return 'asc'\n      }\n    },\n    getInSensitive: function (btn, options) {\n      var insensitive = list.utils.getAttribute(btn, 'data-insensitive')\n      if (insensitive === 'false') {\n        options.insensitive = false\n      } else {\n        options.insensitive = true\n      }\n    },\n    setOrder: function (options) {\n      for (var i = 0, il = buttons.els.length; i < il; i++) {\n        var btn = buttons.els[i]\n        if (list.utils.getAttribute(btn, 'data-sort') !== options.valueName) {\n          continue\n        }\n        var predefinedOrder = list.utils.getAttribute(btn, 'data-order')\n        if (predefinedOrder == 'asc' || predefinedOrder == 'desc') {\n          if (predefinedOrder == options.order) {\n            list.utils.classes(btn).add(options.order)\n          }\n        } else {\n          list.utils.classes(btn).add(options.order)\n        }\n      }\n    },\n  }\n\n  const floatRegex = /^[+-]?([0-9]*[.])?[0-9]+(e[0-9]+)?$/;\n\n  var sort = function () {\n    list.trigger('sortStart')\n    var options = {}\n\n    var target = arguments[0].currentTarget || arguments[0].srcElement || undefined // arg[0] : val, arg[1] : { order: 'asc' }\n\n    if (target) {\n      options.valueName = list.utils.getAttribute(target, 'data-sort')\n      buttons.getInSensitive(target, options)\n      options.order = buttons.getOrder(target)\n    } else {\n      options = arguments[1] || options\n      options.valueName = arguments[0]\n      options.order = options.order || 'asc'\n      options.insensitive = typeof options.insensitive == 'undefined' ? true : options.insensitive\n    }\n\n    buttons.clear()\n    buttons.setOrder(options)\n\n    // caseInsensitive\n    // alphabet\n    var customSortFunction = options.sortFunction || list.sortFunction || null,\n        multi = options.order === 'desc' ? -1 : 1,\n        sortFunction\n\n    if (customSortFunction) {\n      sortFunction = function (itemA, itemB) {\n        return customSortFunction(itemA, itemB, options) * multi\n      }\n    } else {\n      sortFunction = function (itemA, itemB) {\n        const itemAValue = itemA.values()[options.valueName]\n        const itemBValue = itemB.values()[options.valueName]\n\n        if (floatRegex.test(itemAValue) && floatRegex.test(itemBValue)) {\n          return (parseFloat(itemAValue) - parseFloat(itemBValue)) * multi\n        }\n\n\treturn list.utils.naturalSort(\n          itemA.values()[options.valueName] + '',\n          itemB.values()[options.valueName] + '',\n          { \n            caseInsensitive: !sort.alphabet && options.insensitive,\n            alphabet: list.alphabet || options.alphabet || undefined\n          }\n        ) * multi\n      }\n    }\n\n    list.items.sort(sortFunction)\n    list.update()\n    list.trigger('sortComplete')\n  }\n\n  // Add handlers\n  list.handlers.sortStart = list.handlers.sortStart || []\n  list.handlers.sortComplete = list.handlers.sortComplete || []\n\n  buttons.els = list.utils.getByClass(list.listContainer, list.sortClass)\n  list.utils.events.bind(buttons.els, 'click', sort)\n  list.on('searchStart', buttons.clear)\n  list.on('filterStart', buttons.clear)\n\n  return sort\n}\n","var Templater = function (list) {\n  var createItem,\n    templater = this\n\n  var init = function () {\n    var itemSource\n\n    if (typeof list.item === 'function') {\n      createItem = function (values) {\n        var item = list.item(values)\n        return getItemSource(item)\n      }\n      return\n    }\n\n    if (typeof list.item === 'string') {\n      if (list.item.indexOf('<') === -1) {\n        itemSource = document.getElementById(list.item)\n      } else {\n        itemSource = getItemSource(list.item)\n      }\n    } else {\n      /* If item source does not exists, use the first item in list as\n      source for new items */\n      itemSource = getFirstListItem()\n    }\n\n    if (!itemSource) {\n      throw new Error(\"The list needs to have at least one item on init otherwise you'll have to add a template.\")\n    }\n\n    itemSource = createCleanTemplateItem(itemSource, list.valueNames)\n\n    createItem = function () {\n      return itemSource.cloneNode(true)\n    }\n  }\n\n  var createCleanTemplateItem = function (templateNode, valueNames) {\n    var el = templateNode.cloneNode(true)\n    el.removeAttribute('id')\n\n    for (var i = 0, il = valueNames.length; i < il; i++) {\n      var elm = undefined,\n        valueName = valueNames[i]\n      if (valueName.data) {\n        for (var j = 0, jl = valueName.data.length; j < jl; j++) {\n          el.setAttribute('data-' + valueName.data[j], '')\n        }\n      } else if (valueName.attr && valueName.name) {\n        elm = list.utils.getByClass(el, valueName.name, true)\n        if (elm) {\n          elm.setAttribute(valueName.attr, '')\n        }\n      } else {\n        elm = list.utils.getByClass(el, valueName, true)\n        if (elm) {\n          elm.innerHTML = ''\n        }\n      }\n    }\n    return el\n  }\n\n  var getFirstListItem = function () {\n    var nodes = list.list.childNodes\n\n    for (var i = 0, il = nodes.length; i < il; i++) {\n      // Only textnodes have a data attribute\n      if (nodes[i].data === undefined) {\n        return nodes[i].cloneNode(true)\n      }\n    }\n    return undefined\n  }\n\n  var getItemSource = function (itemHTML) {\n    if (typeof itemHTML !== 'string') return undefined\n    if (/<tr[\\s>]/g.exec(itemHTML)) {\n      var tbody = document.createElement('tbody')\n      tbody.innerHTML = itemHTML\n      return tbody.firstElementChild\n    } else if (itemHTML.indexOf('<') !== -1) {\n      var div = document.createElement('div')\n      div.innerHTML = itemHTML\n      return div.firstElementChild\n    }\n    return undefined\n  }\n\n  var getValueName = function (name) {\n    for (var i = 0, il = list.valueNames.length; i < il; i++) {\n      var valueName = list.valueNames[i]\n      if (valueName.data) {\n        var data = valueName.data\n        for (var j = 0, jl = data.length; j < jl; j++) {\n          if (data[j] === name) {\n            return { data: name }\n          }\n        }\n      } else if (valueName.attr && valueName.name && valueName.name == name) {\n        return valueName\n      } else if (valueName === name) {\n        return name\n      }\n    }\n  }\n\n  var setValue = function (item, name, value) {\n    var elm = undefined,\n      valueName = getValueName(name)\n    if (!valueName) return\n    if (valueName.data) {\n      item.elm.setAttribute('data-' + valueName.data, value)\n    } else if (valueName.attr && valueName.name) {\n      elm = list.utils.getByClass(item.elm, valueName.name, true)\n      if (elm) {\n        elm.setAttribute(valueName.attr, value)\n      }\n    } else {\n      elm = list.utils.getByClass(item.elm, valueName, true)\n      if (elm) {\n        elm.innerHTML = value\n      }\n    }\n  }\n\n  this.get = function (item, valueNames) {\n    templater.create(item)\n    var values = {}\n    for (var i = 0, il = valueNames.length; i < il; i++) {\n      var elm = undefined,\n        valueName = valueNames[i]\n      if (valueName.data) {\n        for (var j = 0, jl = valueName.data.length; j < jl; j++) {\n          values[valueName.data[j]] = list.utils.getAttribute(item.elm, 'data-' + valueName.data[j])\n        }\n      } else if (valueName.attr && valueName.name) {\n        elm = list.utils.getByClass(item.elm, valueName.name, true)\n        values[valueName.name] = elm ? list.utils.getAttribute(elm, valueName.attr) : ''\n      } else {\n        elm = list.utils.getByClass(item.elm, valueName, true)\n        values[valueName] = elm ? elm.innerHTML : ''\n      }\n    }\n    return values\n  }\n\n  this.set = function (item, values) {\n    if (!templater.create(item)) {\n      for (var v in values) {\n        if (values.hasOwnProperty(v)) {\n          setValue(item, v, values[v])\n        }\n      }\n    }\n  }\n\n  this.create = function (item) {\n    if (item.elm !== undefined) {\n      return false\n    }\n    item.elm = createItem(item.values())\n    templater.set(item, item.values())\n    return true\n  }\n  this.remove = function (item) {\n    if (item.elm.parentNode === list.list) {\n      list.list.removeChild(item.elm)\n    }\n  }\n  this.show = function (item) {\n    templater.create(item)\n    list.list.appendChild(item.elm)\n  }\n  this.hide = function (item) {\n    if (item.elm !== undefined && item.elm.parentNode === list.list) {\n      list.list.removeChild(item.elm)\n    }\n  }\n  this.clear = function () {\n    /* .innerHTML = ''; fucks up IE */\n    if (list.list.hasChildNodes()) {\n      while (list.list.childNodes.length >= 1) {\n        list.list.removeChild(list.list.firstChild)\n      }\n    }\n  }\n\n  init()\n}\n\nmodule.exports = function (list) {\n  return new Templater(list)\n}\n","/**\n * Module dependencies.\n */\n\nvar index = require('./index-of')\n\n/**\n * Whitespace regexp.\n */\n\nvar re = /\\s+/\n\n/**\n * toString reference.\n */\n\nvar toString = Object.prototype.toString\n\n/**\n * Wrap `el` in a `ClassList`.\n *\n * @param {Element} el\n * @return {ClassList}\n * @api public\n */\n\nmodule.exports = function (el) {\n  return new ClassList(el)\n}\n\n/**\n * Initialize a new ClassList for `el`.\n *\n * @param {Element} el\n * @api private\n */\n\nfunction ClassList(el) {\n  if (!el || !el.nodeType) {\n    throw new Error('A DOM element reference is required')\n  }\n  this.el = el\n  this.list = el.classList\n}\n\n/**\n * Add class `name` if not already present.\n *\n * @param {String} name\n * @return {ClassList}\n * @api public\n */\n\nClassList.prototype.add = function (name) {\n  // classList\n  if (this.list) {\n    this.list.add(name)\n    return this\n  }\n\n  // fallback\n  var arr = this.array()\n  var i = index(arr, name)\n  if (!~i) arr.push(name)\n  this.el.className = arr.join(' ')\n  return this\n}\n\n/**\n * Remove class `name` when present, or\n * pass a regular expression to remove\n * any which match.\n *\n * @param {String|RegExp} name\n * @return {ClassList}\n * @api public\n */\n\nClassList.prototype.remove = function (name) {\n  // classList\n  if (this.list) {\n    this.list.remove(name)\n    return this\n  }\n\n  // fallback\n  var arr = this.array()\n  var i = index(arr, name)\n  if (~i) arr.splice(i, 1)\n  this.el.className = arr.join(' ')\n  return this\n}\n\n/**\n * Toggle class `name`, can force state via `force`.\n *\n * For browsers that support classList, but do not support `force` yet,\n * the mistake will be detected and corrected.\n *\n * @param {String} name\n * @param {Boolean} force\n * @return {ClassList}\n * @api public\n */\n\nClassList.prototype.toggle = function (name, force) {\n  // classList\n  if (this.list) {\n    if ('undefined' !== typeof force) {\n      if (force !== this.list.toggle(name, force)) {\n        this.list.toggle(name) // toggle again to correct\n      }\n    } else {\n      this.list.toggle(name)\n    }\n    return this\n  }\n\n  // fallback\n  if ('undefined' !== typeof force) {\n    if (!force) {\n      this.remove(name)\n    } else {\n      this.add(name)\n    }\n  } else {\n    if (this.has(name)) {\n      this.remove(name)\n    } else {\n      this.add(name)\n    }\n  }\n\n  return this\n}\n\n/**\n * Return an array of classes.\n *\n * @return {Array}\n * @api public\n */\n\nClassList.prototype.array = function () {\n  var className = this.el.getAttribute('class') || ''\n  var str = className.replace(/^\\s+|\\s+$/g, '')\n  var arr = str.split(re)\n  if ('' === arr[0]) arr.shift()\n  return arr\n}\n\n/**\n * Check if class `name` is present.\n *\n * @param {String} name\n * @return {ClassList}\n * @api public\n */\n\nClassList.prototype.has = ClassList.prototype.contains = function (name) {\n  return this.list ? this.list.contains(name) : !!~index(this.array(), name)\n}\n","var bind = window.addEventListener ? 'addEventListener' : 'attachEvent',\n  unbind = window.removeEventListener ? 'removeEventListener' : 'detachEvent',\n  prefix = bind !== 'addEventListener' ? 'on' : '',\n  toArray = require('./to-array')\n\n/**\n * Bind `el` event `type` to `fn`.\n *\n * @param {Element} el, NodeList, HTMLCollection or Array\n * @param {String} type\n * @param {Function} fn\n * @param {Boolean} capture\n * @api public\n */\n\nexports.bind = function (el, type, fn, capture) {\n  el = toArray(el)\n  for (var i = 0, il = el.length; i < il; i++) {\n    el[i][bind](prefix + type, fn, capture || false)\n  }\n}\n\n/**\n * Unbind `el` event `type`'s callback `fn`.\n *\n * @param {Element} el, NodeList, HTMLCollection or Array\n * @param {String} type\n * @param {Function} fn\n * @param {Boolean} capture\n * @api public\n */\n\nexports.unbind = function (el, type, fn, capture) {\n  el = toArray(el)\n  for (var i = 0, il = el.length; i < il; i++) {\n    el[i][unbind](prefix + type, fn, capture || false)\n  }\n}\n\n/**\n * Returns a function, that, as long as it continues to be invoked, will not\n * be triggered. The function will be called after it stops being called for\n * `wait` milliseconds. If `immediate` is true, trigger the function on the\n * leading edge, instead of the trailing.\n *\n * @param {Function} fn\n * @param {Integer} wait\n * @param {Boolean} immediate\n * @api public\n */\n\nexports.debounce = function (fn, wait, immediate) {\n  var timeout\n  return wait\n    ? function () {\n        var context = this,\n          args = arguments\n        var later = function () {\n          timeout = null\n          if (!immediate) fn.apply(context, args)\n        }\n        var callNow = immediate && !timeout\n        clearTimeout(timeout)\n        timeout = setTimeout(later, wait)\n        if (callNow) fn.apply(context, args)\n      }\n    : fn\n}\n","/*\n * Source: https://github.com/segmentio/extend\n */\n\nmodule.exports = function extend(object) {\n  // Takes an unlimited number of extenders.\n  var args = Array.prototype.slice.call(arguments, 1)\n\n  // For each extender, copy their properties on our object.\n  for (var i = 0, source; (source = args[i]); i++) {\n    if (!source) continue\n    for (var property in source) {\n      object[property] = source[property]\n    }\n  }\n\n  return object\n}\n","module.exports = function (text, pattern, options) {\n  // Aproximately where in the text is the pattern expected to be found?\n  var Match_Location = options.location || 0\n\n  //Determines how close the match must be to the fuzzy location (specified above). An exact letter match which is 'distance' characters away from the fuzzy location would score as a complete mismatch. A distance of '0' requires the match be at the exact location specified, a threshold of '1000' would require a perfect match to be within 800 characters of the fuzzy location to be found using a 0.8 threshold.\n  var Match_Distance = options.distance || 100\n\n  // At what point does the match algorithm give up. A threshold of '0.0' requires a perfect match (of both letters and location), a threshold of '1.0' would match anything.\n  var Match_Threshold = options.threshold || 0.4\n\n  if (pattern === text) return true // Exact match\n  if (pattern.length > 32) return false // This algorithm cannot be used\n\n  // Set starting location at beginning text and initialise the alphabet.\n  var loc = Match_Location,\n    s = (function () {\n      var q = {},\n        i\n\n      for (i = 0; i < pattern.length; i++) {\n        q[pattern.charAt(i)] = 0\n      }\n\n      for (i = 0; i < pattern.length; i++) {\n        q[pattern.charAt(i)] |= 1 << (pattern.length - i - 1)\n      }\n\n      return q\n    })()\n\n  // Compute and return the score for a match with e errors and x location.\n  // Accesses loc and pattern through being a closure.\n\n  function match_bitapScore_(e, x) {\n    var accuracy = e / pattern.length,\n      proximity = Math.abs(loc - x)\n\n    if (!Match_Distance) {\n      // Dodge divide by zero error.\n      return proximity ? 1.0 : accuracy\n    }\n    return accuracy + proximity / Match_Distance\n  }\n\n  var score_threshold = Match_Threshold, // Highest score beyond which we give up.\n    best_loc = text.indexOf(pattern, loc) // Is there a nearby exact match? (speedup)\n\n  if (best_loc != -1) {\n    score_threshold = Math.min(match_bitapScore_(0, best_loc), score_threshold)\n    // What about in the other direction? (speedup)\n    best_loc = text.lastIndexOf(pattern, loc + pattern.length)\n\n    if (best_loc != -1) {\n      score_threshold = Math.min(match_bitapScore_(0, best_loc), score_threshold)\n    }\n  }\n\n  // Initialise the bit arrays.\n  var matchmask = 1 << (pattern.length - 1)\n  best_loc = -1\n\n  var bin_min, bin_mid\n  var bin_max = pattern.length + text.length\n  var last_rd\n  for (var d = 0; d < pattern.length; d++) {\n    // Scan for the best match; each iteration allows for one more error.\n    // Run a binary search to determine how far from 'loc' we can stray at this\n    // error level.\n    bin_min = 0\n    bin_mid = bin_max\n    while (bin_min < bin_mid) {\n      if (match_bitapScore_(d, loc + bin_mid) <= score_threshold) {\n        bin_min = bin_mid\n      } else {\n        bin_max = bin_mid\n      }\n      bin_mid = Math.floor((bin_max - bin_min) / 2 + bin_min)\n    }\n    // Use the result from this iteration as the maximum for the next.\n    bin_max = bin_mid\n    var start = Math.max(1, loc - bin_mid + 1)\n    var finish = Math.min(loc + bin_mid, text.length) + pattern.length\n\n    var rd = Array(finish + 2)\n    rd[finish + 1] = (1 << d) - 1\n    for (var j = finish; j >= start; j--) {\n      // The alphabet (s) is a sparse hash, so the following line generates\n      // warnings.\n      var charMatch = s[text.charAt(j - 1)]\n      if (d === 0) {\n        // First pass: exact match.\n        rd[j] = ((rd[j + 1] << 1) | 1) & charMatch\n      } else {\n        // Subsequent passes: fuzzy match.\n        rd[j] = (((rd[j + 1] << 1) | 1) & charMatch) | (((last_rd[j + 1] | last_rd[j]) << 1) | 1) | last_rd[j + 1]\n      }\n      if (rd[j] & matchmask) {\n        var score = match_bitapScore_(d, j - 1)\n        // This match will almost certainly be better than any existing match.\n        // But check anyway.\n        if (score <= score_threshold) {\n          // Told you so.\n          score_threshold = score\n          best_loc = j - 1\n          if (best_loc > loc) {\n            // When passing loc, don't exceed our current distance from loc.\n            start = Math.max(1, 2 * loc - best_loc)\n          } else {\n            // Already passed loc, downhill from here on in.\n            break\n          }\n        }\n      }\n    }\n    // No hope for a (better) match at greater error levels.\n    if (match_bitapScore_(d + 1, loc) > score_threshold) {\n      break\n    }\n    last_rd = rd\n  }\n\n  return best_loc < 0 ? false : true\n}\n","/**\n * A cross-browser implementation of getAttribute.\n * Source found here: http://stackoverflow.com/a/3755343/361337 written by Vivin Paliath\n *\n * Return the value for `attr` at `element`.\n *\n * @param {Element} el\n * @param {String} attr\n * @api public\n */\n\nmodule.exports = function (el, attr) {\n  var result = (el.getAttribute && el.getAttribute(attr)) || null\n  if (!result) {\n    var attrs = el.attributes\n    var length = attrs.length\n    for (var i = 0; i < length; i++) {\n      if (attrs[i] !== undefined) {\n        if (attrs[i].nodeName === attr) {\n          result = attrs[i].nodeValue\n        }\n      }\n    }\n  }\n  return result\n}\n","/**\n * A cross-browser implementation of getElementsByClass.\n * Heavily based on Dustin Diaz's function: http://dustindiaz.com/getelementsbyclass.\n *\n * Find all elements with class `className` inside `container`.\n * Use `single = true` to increase performance in older browsers\n * when only one element is needed.\n *\n * @param {String} className\n * @param {Element} container\n * @param {Boolean} single\n * @api public\n */\n\nvar getElementsByClassName = function (container, className, single) {\n  if (single) {\n    return container.getElementsByClassName(className)[0]\n  } else {\n    return container.getElementsByClassName(className)\n  }\n}\n\nvar querySelector = function (container, className, single) {\n  className = '.' + className\n  if (single) {\n    return container.querySelector(className)\n  } else {\n    return container.querySelectorAll(className)\n  }\n}\n\nvar polyfill = function (container, className, single) {\n  var classElements = [],\n    tag = '*'\n\n  var els = container.getElementsByTagName(tag)\n  var elsLen = els.length\n  var pattern = new RegExp('(^|\\\\s)' + className + '(\\\\s|$)')\n  for (var i = 0, j = 0; i < elsLen; i++) {\n    if (pattern.test(els[i].className)) {\n      if (single) {\n        return els[i]\n      } else {\n        classElements[j] = els[i]\n        j++\n      }\n    }\n  }\n  return classElements\n}\n\nmodule.exports = (function () {\n  return function (container, className, single, options) {\n    options = options || {}\n    if ((options.test && options.getElementsByClassName) || (!options.test && document.getElementsByClassName)) {\n      return getElementsByClassName(container, className, single)\n    } else if ((options.test && options.querySelector) || (!options.test && document.querySelector)) {\n      return querySelector(container, className, single)\n    } else {\n      return polyfill(container, className, single)\n    }\n  }\n})()\n","var indexOf = [].indexOf\n\nmodule.exports = function(arr, obj){\n  if (indexOf) return arr.indexOf(obj);\n  for (var i = 0, il = arr.length; i < il; ++i) {\n    if (arr[i] === obj) return i;\n  }\n  return -1\n}\n","/**\n * Source: https://github.com/timoxley/to-array\n *\n * Convert an array-like object into an `Array`.\n * If `collection` is already an `Array`, then will return a clone of `collection`.\n *\n * @param {Array | Mixed} collection An `Array` or array-like object to convert e.g. `arguments` or `NodeList`\n * @return {Array} Naive conversion of `collection` to a new `Array`.\n * @api public\n */\n\nmodule.exports = function toArray(collection) {\n  if (typeof collection === 'undefined') return []\n  if (collection === null) return [null]\n  if (collection === window) return [window]\n  if (typeof collection === 'string') return [collection]\n  if (isArray(collection)) return collection\n  if (typeof collection.length != 'number') return [collection]\n  if (typeof collection === 'function' && collection instanceof Function) return [collection]\n\n  var arr = [];\n  for (var i = 0, il = collection.length; i < il; i++) {\n    if (Object.prototype.hasOwnProperty.call(collection, i) || i in collection) {\n      arr.push(collection[i])\n    }\n  }\n  if (!arr.length) return []\n  return arr\n}\n\nfunction isArray(arr) {\n  return Object.prototype.toString.call(arr) === '[object Array]'\n}\n","module.exports = function (s) {\n  s = s === undefined ? '' : s\n  s = s === null ? '' : s\n  s = s.toString()\n  return s\n}\n","'use strict';\n\nconst defaultAlphabetIndexMap = [];\n\nfunction isNumberCode(code) {\n  return code >= 48/* '0' */ && code <= 57/* '9' */;\n}\n\nfunction naturalCompare(a, b, opts) {\n  if (typeof a !== 'string') {\n    throw new TypeError(`The first argument must be a string. Received type '${typeof a}'`);\n  }\n  if (typeof b !== 'string') {\n    throw new TypeError(`The second argument must be a string. Received type '${typeof b}'`);\n  }\n\n  const lengthA = a.length;\n  const lengthB = b.length;\n  let indexA = 0;\n  let indexB = 0;\n  let alphabetIndexMap = defaultAlphabetIndexMap;\n  let firstDifferenceInLeadingZeros = 0;\n\n  if (opts) {\n    if (opts.caseInsensitive) {\n      a = a.toLowerCase();\n      b = b.toLowerCase();\n    }\n\n    if (opts.alphabet) {\n      alphabetIndexMap = buildAlphabetIndexMap(opts.alphabet);\n    }\n  }\n\n  while (indexA < lengthA && indexB < lengthB) {\n    let charCodeA = a.charCodeAt(indexA);\n    let charCodeB = b.charCodeAt(indexB);\n\n    if (isNumberCode(charCodeA)) {\n      if (!isNumberCode(charCodeB)) {\n        return charCodeA - charCodeB;\n      }\n\n      let numStartA = indexA;\n      let numStartB = indexB;\n\n      while (charCodeA === 48/* '0' */ && ++numStartA < lengthA) {\n        charCodeA = a.charCodeAt(numStartA);\n      }\n      while (charCodeB === 48/* '0' */ && ++numStartB < lengthB) {\n        charCodeB = b.charCodeAt(numStartB);\n      }\n\n      if (numStartA !== numStartB && firstDifferenceInLeadingZeros === 0) {\n        firstDifferenceInLeadingZeros = numStartA - numStartB;\n      }\n\n      let numEndA = numStartA;\n      let numEndB = numStartB;\n\n      while (numEndA < lengthA && isNumberCode(a.charCodeAt(numEndA))) {\n        ++numEndA;\n      }\n      while (numEndB < lengthB && isNumberCode(b.charCodeAt(numEndB))) {\n        ++numEndB;\n      }\n\n      let difference = numEndA - numStartA - numEndB + numStartB; // numA length - numB length\n      if (difference !== 0) {\n        return difference;\n      }\n\n      while (numStartA < numEndA) {\n        difference = a.charCodeAt(numStartA++) - b.charCodeAt(numStartB++);\n        if (difference !== 0) {\n          return difference;\n        }\n      }\n\n      indexA = numEndA;\n      indexB = numEndB;\n      continue;\n    }\n\n    if (charCodeA !== charCodeB) {\n      if (\n        charCodeA < alphabetIndexMap.length &&\n        charCodeB < alphabetIndexMap.length &&\n        alphabetIndexMap[charCodeA] !== -1 &&\n        alphabetIndexMap[charCodeB] !== -1\n      ) {\n        return alphabetIndexMap[charCodeA] - alphabetIndexMap[charCodeB];\n      }\n\n      return charCodeA - charCodeB;\n    }\n\n    ++indexA;\n    ++indexB;\n  }\n\n  if (indexA < lengthA) { // `b` is a substring of `a`\n    return 1;\n  }\n\n  if (indexB < lengthB) { // `a` is a substring of `b`\n    return -1;\n  }\n\n  return firstDifferenceInLeadingZeros;\n}\n\nconst alphabetIndexMapCache = {};\n\nfunction buildAlphabetIndexMap(alphabet) {\n  const existingMap = alphabetIndexMapCache[alphabet];\n  if (existingMap !== undefined) {\n    return existingMap;\n  }\n\n  const indexMap = [];\n  const maxCharCode = alphabet.split('').reduce((maxCode, char) => {\n    return Math.max(maxCode, char.charCodeAt(0));\n  }, 0);\n\n  for (let i = 0; i <= maxCharCode; i++) {\n    indexMap.push(-1);\n  }\n\n  for (let i = 0; i < alphabet.length; i++) {\n    indexMap[alphabet.charCodeAt(i)] = i;\n  }\n\n  alphabetIndexMapCache[alphabet] = indexMap;\n\n  return indexMap;\n}\n\nmodule.exports = naturalCompare;\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(352);\n",""],"names":[],"sourceRoot":""}
\ No newline at end of file
diff --git a/customprompts/mzta-custom-prompts.css b/customprompts/mzta-custom-prompts.css
new file mode 100644
index 00000000..fd043b48
--- /dev/null
+++ b/customprompts/mzta-custom-prompts.css
@@ -0,0 +1,172 @@
+@media (prefers-color-scheme: light) {
+    table th {
+        background-color: #ffffff;
+    }
+
+    #command_palette{
+        background-color: #ffffff; 
+    }
+
+    table.prompts_list tr:nth-child(even) {
+        background-color: #e9e9e9;
+    }
+
+    table.prompts_list tr:nth-child(odd) {
+        background-color: #f3f3f3;
+    }
+}
+
+
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #1C1B22;
+        color: rgb(251, 251, 254);
+    }
+    
+    a:link { color: #409EFF; }   
+    a:visited { color: #409EFF; }  
+    a:hover { color: #66B1FF; }   
+    a:active { color: #66B1FF; }
+
+    table {
+        background-color: #1C1B22;
+        border: 1px solid #ccc;
+    }
+
+    table.prompts_list th {
+        background-color: #4c4e58;
+        border: 1px solid rgb(251, 251, 254);
+        color: rgb(194, 194, 194);
+    }
+
+    #command_palette{
+        background-color: inherit; 
+    }
+
+    table.prompts_list tr:nth-child(even) {
+        background-color: #2E2F36;
+    }
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+    border: 1px solid #ccc;
+}
+
+thead {
+    position: sticky;
+    top: 26px;
+}
+
+#command_palette{
+    position: sticky;
+    top: 0;
+    padding-top: 1px;
+    height: 26px;
+    width: 100%;
+}
+
+#btnNew{
+    float: right;
+}
+
+#btnSaveAll{
+    float: left;
+}
+
+#msgDisplay{
+    padding-left: 40px;
+}
+
+table tr {
+    border-bottom: 1px solid #ccc;
+}
+
+table.prompts_list th {
+    padding: 8px;
+    text-align: left;
+}
+
+table td {
+    border: 1px solid #ddd;
+    padding: 8px;
+}
+
+table td.w08{
+    width: 8vw;
+}
+
+table td.w17{
+    width: 17vw;
+}
+
+table td.w19{
+    width: 19vw;
+}
+
+table td.w25{
+    width: 25vw;
+}
+
+table td.w40{
+    width: 40vw;
+}
+
+table.prompts_list td.properties{
+    white-space: nowrap;
+}
+
+table .sort {
+    background-image: url(../images/listjs-arrow-sort-inactive.png);
+    background-repeat: no-repeat;
+    background-position: right center;
+    padding-right: 14px;
+    cursor: pointer;
+    cursor: hand;
+}
+
+table .sort.asc {
+    background-image: url(../images/listjs-arrow-sort-active-down.png);
+}
+
+table .sort.desc {
+    background-image: url(../images/listjs-arrow-sort-active-up.png);
+}
+
+.hiddendata{
+    display: none;
+}
+
+#formNew{
+    display: none;
+    width: 100%;
+    padding-bottom: 7px;
+}
+
+.text_output{
+    width: 98%;
+    height: 9em;
+}
+
+.go_right_float{
+    float: right;
+}
+
+.go_right{
+    width: 100%;
+    text-align: right;
+}
+
+.width_all{
+    width: 100%;
+}
+
+.small_label{
+    font-size: small;
+    font-style: italic;
+}
+
+#txtIdNew, .id_output{
+    text-transform: lowercase;
+}
\ No newline at end of file
diff --git a/customprompts/mzta-custom-prompts.html b/customprompts/mzta-custom-prompts.html
new file mode 100644
index 00000000..98d10370
--- /dev/null
+++ b/customprompts/mzta-custom-prompts.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>ThunderAI - __MSG_customPrompts_managePrompts__</title>
+    <link rel="stylesheet" href="mzta-custom-prompts.css">
+</head>
+<body>
+    <div>
+        <h1>__MSG_customPrompts_managePrompts__</h1>
+        <p>__MSG_customPrompts_managePrompts_statement__</p>
+    </div>
+    <div id="command_palette">
+      <button id="btnSaveAll" disabled>__MSG_customPrompts_btnSaveAll__</button>
+      <span id="msgDisplay"></span>
+      <button id="btnNew">__MSG_customPrompts_btnNew__</button>
+    </div>
+    <div id="formNew">
+      <table class="width_all">
+        <tr>
+            <td class="w19">
+                <label for="txtIdNew">*__MSG_customPrompts_form_label_ID__:</label>
+                <br>
+                <input type="text" id="txtIdNew" name="id" class="input_new">
+                <br><span class="small_label">[__MSG_customPrompts_form_label_ID_rules__]</span>                
+            </td>
+            <td rowspan="2" class="w25">
+                <label for="txtTextNew">*__MSG_customPrompts_form_label_Text__:</label>
+                <br>
+                <textarea id="txtTextNew" name="text" class="input_new text_output"></textarea>
+            </td>
+            <td class="w19">
+                <label for="selectTypeNew">__MSG_customPrompts_add_to_menu__:</label>
+                <br>
+                <select id="selectTypeNew" name="type">
+                    <option value="0">__MSG_customPrompts_add_to_menu_always__</option>
+                    <option value="1">__MSG_customPrompts_add_to_menu_reading__</option>
+                    <option value="2">__MSG_customPrompts_add_to_menu_composing__</option>
+                </select>
+            </td>
+            <td rowspan="2" class="w19">
+                <input type="checkbox" id="checkboxNeedSelectedNew" name="need_selected" value="1"> <label for="checkboxNeedSelectedNew">__MSG_customPrompts_form_label_need_selected__</label>
+                <br>
+                <input type="checkbox" id="checkboxNeedSignatureNew" name="need_signature" value="1"> <label for="checkboxNeedSignatureNew">__MSG_customPrompts_form_label_need_signature__</label>
+                <br>
+                <input type="checkbox" id="checkboxNeedCustomTextNew" name="need_custom_text" value="1"> <label for="checkboxNeedCustomTextNew">__MSG_customPrompts_form_label_need_custom_text__</label>
+            </td>
+        </tr>
+        <tr>
+            <td class="w19">
+              <label for="txtNameNew">*__MSG_customPrompts_form_label_Name__:</label>
+              <br>
+              <input type="text" id="txtNameNew" name="name" class="input_new">
+            </td>
+            <td class="w19">
+              <label for="selectActionNew">__MSG_customPrompts_form_label_Action__:</label>
+              <br>
+              <select id="selectActionNew" name="action">
+                  <option value="0">__MSG_customPrompts_close_button__</option>
+                  <option value="1">__MSG_customPrompts_do_reply__</option>
+                  <option value="2">__MSG_customPrompts_substitute_text__</option>
+              </select>
+            </td>
+        </tr>
+    </table>
+        <div class="go_right_float">* __MSG_customPrompts_form_required_fields__</div>
+        <br>
+        <div class="go_right"><button id="btnAddNew" disabled>__MSG_customPrompts_btnAddNewCommit__</button></div>
+    </div>
+    <div id="all_prompts">
+        <table class="prompts_list">
+            <thead>
+              <tr>
+                <th class="sort" data-sort="id">__MSG_customPrompts_form_label_ID__</th>
+                <th class="sort" data-sort="name">__MSG_customPrompts_form_label_Name__</th>
+                <th class="sort" data-sort="text">__MSG_customPrompts_form_label_Text__</th>
+                <th class="sort" data-sort="type">__MSG_customPrompts_add_to_menu__</th>
+                <th>Properties</th>
+                <th>__MSG_customPrompts_form_label_Action__</th>
+              </tr>
+            </thead>
+            <tbody class="list">
+            </tbody>
+          </table>
+    </div>
+    <script src="list.js"></script>
+    <script src="mzta-custom-prompts.js" type="module"></script>
+    <script src="../js/mzta-i18n.js"></script>
+</body>
+</html>
+
diff --git a/customprompts/mzta-custom-prompts.js b/customprompts/mzta-custom-prompts.js
new file mode 100644
index 00000000..54b6b524
--- /dev/null
+++ b/customprompts/mzta-custom-prompts.js
@@ -0,0 +1,525 @@
+/*
+ *  ThunderAI [https://micz.it/thunderdbird-addon-thunderai/]
+ *  Copyright (C) 2024  Mic (m@micz.it)
+
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { getPrompts, setDefaultPromptsProperties, setCustomPrompts } from "../js/mzta-prompts.js";
+
+var promptsList = null;
+var somethingChanged = false;
+var positionMax_compose = 0;
+var positionMax_display = 0;
+var idnumMax = 0;
+var msgTimeout = null;
+
+document.addEventListener('DOMContentLoaded', async () => {
+    let options = {
+        valueNames: [ { data: ['idnum'] }, 'is_default', 'id', 'name', 'text', 'type', 'action', 'position_compose', 'position_display', { name: 'need_selected', attr: 'checked_val'}, { name: 'need_signature', attr: 'checked_val'}, { name: 'need_custom_text', attr: 'checked_val'}, { name: 'enabled', attr: 'checked_val'} ],
+        item: function(values) {
+            let type_output = '';
+            switch(String(values.type)){
+                case "0":
+                    type_output = `__MSG_customPrompts_add_to_menu_always__`;
+                    break;
+                case "1":
+                    type_output = `__MSG_customPrompts_add_to_menu_reading__`;
+                    break;
+                case "2":
+                    type_output = `__MSG_customPrompts_add_to_menu_composing__`;
+                    break;
+            }
+
+            let action_output = '';
+            switch(String(values.action)){
+                case "0":
+                    action_output = `__MSG_customPrompts_close_button__`;
+                    break;
+                case "1":
+                    action_output = `__MSG_customPrompts_do_reply__`;
+                    break;
+                case "2":
+                    action_output = `__MSG_customPrompts_substitute_text__`;
+                    break;
+            }
+            //console.log('>>>>>>>>>>>>> action_output: ' + JSON.stringify(action_output));
+
+            let output = `<tr ` + ((values.is_default == 1) ? 'class="is_default"':'') + `>
+                <td class="w08"><span class="id id_show"></span><input type="text" class="hiddendata id_output" value="` + values.id + `" /></td>
+                <td class="w08"><span class="name name_show"></span><input type="text" class="hiddendata name_output" value="` + values.name + `" /></td>
+                <td class="w40"><span class="text text_show"></span><textarea class="hiddendata text_output">` + values.text + `</textarea></td>
+                <td><span class="type_show">` + type_output + `</span>
+                <select class="type_output hiddendata">
+                <option value="0"` + ((values.type == "0") ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_always__</option>
+                <option value="1"` + ((values.type == "1") ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_reading__</option>
+                <option value="2"` + ((values.type == "2") ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_composing__</option>
+              </select>` +
+              `<span class="type hiddendata"></span>
+              </td>
+                <td class="w17">
+                    Action: <span class="action_show">` + action_output + `</span>
+                    <select class="action_output hiddendata">
+                    <option value="0"` + ((values.action == "0") ? ' selected':'') + `>__MSG_customPrompts_close_button__</option>
+                    <option value="1"` + ((values.action == "1") ? ' selected':'') + `>__MSG_customPrompts_do_reply__</option>
+                    <option value="2"` + ((values.action == "2") ? ' selected':'') + `>__MSG_customPrompts_substitute_text__</option>
+                  </select>` +
+                  `<span class="action hiddendata"></span>
+                    <br>
+                    <input type="checkbox" class="need_selected" disabled> __MSG_customPrompts_form_label_need_selected__
+                    <br>
+                    <input type="checkbox" class="need_signature" disabled> __MSG_customPrompts_form_label_need_signature__
+                    <br>
+                    <input type="checkbox" class="need_custom_text" disabled> __MSG_customPrompts_form_label_need_custom_text__
+                    <br>
+                    <input type="checkbox" class="enabled input_mod"> __MSG_customPrompts_form_label_enabled__
+                    <span class="is_default hiddendata"></span>
+                    <span class="position_compose hiddendata"></span>
+                    <span class="position_display hiddendata"></span>
+                </td>
+                <td>
+                <button class="btnEditItem"` + ((values.is_default == 1) ? ' disabled':'') + `>__MSG_customPrompts_btnEdit__</button>
+                <button class="btnCancelItem hiddendata"` + ((values.is_default == 1) ? ' disabled':'') + `>__MSG_customPrompts_btnCancel__</button>
+                <br><br>
+                <button class="btnConfirmItem hiddendata"` + ((values.is_default == 1) ? ' disabled':'') + `>__MSG_customPrompts_btnOK__</button>
+                <button class="btnDeleteItem"` + ((values.is_default == 1) ? ' disabled':'') + `>__MSG_customPrompts_btnDelete__</button>
+               </td>
+            </tr>`;
+            //console.log('>>>>>>>> values.name: ' + JSON.stringify(values.name));
+            positionMax_compose = Math.max(positionMax_compose, values.position_compose);
+            positionMax_display = Math.max(positionMax_display, values.position_display);
+            idnumMax = Math.max(idnumMax, values.idnum);
+            return output;
+        }
+    };
+
+    let values = await getPrompts();
+
+    console.log('>>>>>>>>>>>>>>>> values: ' + JSON.stringify(values));
+
+    promptsList = new List('all_prompts', options, values);
+
+    checkSelectedBoxes();
+
+    const btnSaveAll = document.getElementById('btnSaveAll');
+    btnSaveAll.disabled = true;
+    
+    // Disable save button and handle save actions
+    function handleSaveAllClick(e) {
+        e.preventDefault();
+        saveAll();
+        clearFields();
+    }
+    btnSaveAll.addEventListener('click', handleSaveAllClick);
+
+    const btnNew = document.getElementById('btnNew');
+    
+    // Show the new item form
+    function handleNewClick(e) {
+        e.preventDefault();
+        e.target.disabled = true;
+        document.getElementById('formNew').style.display = 'block';
+        window.scrollTo({
+            top: 0,
+            behavior: 'smooth'
+        });
+    }
+    btnNew.addEventListener('click', handleNewClick);
+    
+    // Enable save button on input change
+    function handleInputChange(e) {
+        e.preventDefault();
+        setSomethingChanged();
+    }
+    document.querySelectorAll('.input_mod').forEach(element => {
+        element.addEventListener('change', handleInputChange);
+    });
+    
+    // Display selected value next to select input
+    // function handleSelectChange(e) {
+    //     e.preventDefault();
+    //     const spanElement = e.target.nextElementSibling;
+    //     spanElement.textContent = e.target.value;
+    // }
+    // document.querySelectorAll('select.input_mod').forEach(element => {
+    //     element.addEventListener('change', handleSelectChange);
+    // });
+    
+    // Log data ID number from item row and prepare for edit action
+    function handleEditClick(e) {
+        e.preventDefault();
+        const tr = e.target.parentNode.parentNode;
+        //console.log('>>>>>>>> tr: ' + tr.getAttribute('data-idnum'));
+        e.target.style.display = 'none';    // Edit btn
+        tr.querySelector('.btnConfirmItem').style.display = 'inline';   // Save btn
+        tr.querySelector('.btnCancelItem').style.display = 'inline';   // Cancel btn
+//        tr.querySelector('.btnEditItem').style.display = 'none';   // Edit btn
+        tr.querySelector('.btnDeleteItem').style.display = 'none';   // Delete btn
+        showItemRowEditor(tr);
+    }
+    let btnEditItem_elements = document.querySelectorAll(".btnEditItem");
+    btnEditItem_elements.forEach(element => {
+        element.addEventListener('click', handleEditClick);
+    });
+
+    function showItemRowEditor(tr) {
+        tr.querySelector('.id_output').style.display = 'inline';
+        tr.querySelector('.id_show').style.display = 'none';
+        tr.querySelector('.name_output').style.display = 'inline';
+        tr.querySelector('.name_show').style.display = 'none';
+        tr.querySelector('.text_output').style.display = 'inline';
+        tr.querySelector('.text_show').style.display = 'none';
+        tr.querySelector('.type_output').style.display = 'inline';
+        tr.querySelector('.type_show').style.display = 'none';
+        tr.querySelector('.action_output').style.display = 'inline';
+        tr.querySelector('.action_show').style.display = 'none';
+        tr.querySelector('input.need_selected').disabled = false;
+        tr.querySelector('input.need_signature').disabled = false;
+        tr.querySelector('input.need_custom_text').disabled = false;
+    }
+
+    function hideItemRowEditor(tr) {
+        tr.querySelector('.id_output').style.display = 'none';
+        tr.querySelector('.id_show').style.display = 'inline';
+        tr.querySelector('.name_output').style.display = 'none';
+        tr.querySelector('.name_show').style.display = 'inline';
+        tr.querySelector('.text_output').style.display = 'none';
+        tr.querySelector('.text_show').style.display = 'inline';
+        tr.querySelector('.type_output').style.display = 'none';
+        tr.querySelector('.type_show').style.display = 'inline';
+        tr.querySelector('.action_output').style.display = 'none';
+        tr.querySelector('.action_show').style.display = 'inline';
+        tr.querySelector('input.need_selected').disabled = true;
+        tr.querySelector('input.need_signature').disabled = true;
+        tr.querySelector('input.need_custom_text').disabled = true;
+    }
+    
+    
+    // Confirm and log deletion action
+    function handleDeleteClick(e) {
+        e.preventDefault();
+        const checkConfirm = window.confirm(browser.i18n.getMessage("customPrompts_btnDelete_confirmText"));
+        if (!checkConfirm) {
+            return;
+        }
+        const tr = e.target.parentNode.parentNode;
+        //console.log('>>>>>>>> tr: ' + tr.getAttribute('data-idnum'));
+        promptsList.remove("id", tr.querySelector('span.id').innerText);
+        setSomethingChanged();
+    }
+    let btnDeleteItem_elements = document.querySelectorAll(".btnDeleteItem");
+    btnDeleteItem_elements.forEach(element => {
+        element.addEventListener('click', handleDeleteClick);
+    });
+
+    function handleCancelClick(e) {
+        e.preventDefault();
+        const tr = e.target.parentNode.parentNode;
+        e.target.style.display = 'none';    // Cancel btn
+        tr.querySelector('.btnConfirmItem').style.display = 'none';   // Save btn
+//        tr.querySelector('.btnCancelItem').style.display = 'none';   // Cancel btn
+        tr.querySelector('.btnEditItem').style.display = 'inline';   // Edit btn
+        tr.querySelector('.btnDeleteItem').style.display = 'inline';   // Delete btn
+        hideItemRowEditor(tr);
+    }
+    let btnCancelItem_elements = document.querySelectorAll(".btnCancelItem");
+    btnCancelItem_elements.forEach(element => {
+        element.addEventListener('click', handleCancelClick);
+    });
+
+    function handleConfirmClick(e) {
+        e.preventDefault();
+        const tr = e.target.parentNode.parentNode;
+        e.target.style.display = 'none';    // Ok btn
+//        tr.querySelector('.btnConfirmItem').style.display = 'none';   // Ok btn
+        tr.querySelector('.btnCancelItem').style.display = 'none';   // Cancel btn
+        tr.querySelector('.btnEditItem').style.display = 'inline';   // Edit btn
+        tr.querySelector('.btnDeleteItem').style.display = 'inline';   // Delete btn
+        // Update item data
+        tr.querySelector('.id_show').innerText = String(tr.querySelector('.id_output').value).toLocaleLowerCase();
+        tr.querySelector('.name_show').innerText = tr.querySelector('.name_output').value;
+        tr.querySelector('.text_show').innerText = tr.querySelector('.text_output').value;
+        tr.querySelector('.type').innerText = tr.querySelector('.type_output').value;
+        tr.querySelector('.type_show').innerText = tr.querySelector('.type_output').selectedOptions[0].text;
+        tr.querySelector('.action').innerText = tr.querySelector('.action_output').value;
+        tr.querySelector('.action_show').innerText = tr.querySelector('.action_output').selectedOptions[0].text;
+        // the checkboxes update is handled directly by themselves
+        hideItemRowEditor(tr);
+        setSomethingChanged();
+    }
+    let btnConfirmItem_elements = document.querySelectorAll(".btnConfirmItem");
+    btnConfirmItem_elements.forEach(element => {
+        element.addEventListener('click', handleConfirmClick);
+    });
+
+    // Handle checkbox changes and log new state
+    function handleCheckboxChange(e) {
+        e.preventDefault();
+        e.target.setAttribute('checked_val', e.target.checked ? '1' : '0');
+        //console.log('>>>>>>>> checked_val: ' + e.target.getAttribute('checked_val'));
+    }
+    let checkbox_elements = document.querySelectorAll("input[type='checkbox']");
+    checkbox_elements.forEach(element => {
+        element.addEventListener('change', handleCheckboxChange);
+    });
+
+    // Handle "type" select changes and log new state
+    // function handleTypeSelectChange(e) {
+    //     e.preventDefault();
+    //     const spanElement = e.target.nextElementSibling;
+    //     spanElement.textContent = e.target.value;
+    // }
+    // let type_select_elements = document.querySelectorAll("select.type_output");
+    // type_select_elements.forEach(element => {
+    //     element.addEventListener('change', handleTypeSelectChange);
+    // });
+    
+    // Handle "action" select changes and log new state
+    // function handleActionSelectChange(e) {
+    //     e.preventDefault();
+    //     const spanElement = e.target.nextElementSibling;
+    //     spanElement.textContent = e.target.value;
+    // }
+    // let action_select_elements = document.querySelectorAll("select.action_output");
+    // action_select_elements.forEach(element => {
+    //     element.addEventListener('change', handleActionSelectChange);
+    // });
+
+    // for the new prompt form
+    let btnNew_elements = document.querySelectorAll(".input_new");
+    if(btnNew_elements) {
+        btnNew_elements.forEach(element => {
+            element.addEventListener('change', (e) => {
+                e.preventDefault();
+                checkFields();
+            });
+        });
+    }
+
+    i18n.updateDocument();
+
+    //To add a new item
+    var txtIdNew = document.getElementById('txtIdNew');
+    var txtNameNew = document.getElementById('txtNameNew');
+    var txtTextNew = document.getElementById('txtTextNew');
+    var selectTypeNew = document.getElementById('selectTypeNew');
+    var selectActionNew = document.getElementById('selectActionNew');
+    var checkboxNeedSelectedNew = document.getElementById('checkboxNeedSelectedNew');
+    var checkboxNeedSignatureNew = document.getElementById('checkboxNeedSignatureNew');
+    var checkboxNeedCustomTextNew = document.getElementById('checkboxNeedCustomTextNew');
+
+    const btnAddNew = document.getElementById('btnAddNew');
+    btnAddNew.addEventListener('click', (e) => {
+        e.preventDefault();
+        if(!checkFields()) {
+            return;
+        }
+        let newItem = promptsList.add({
+            id: String(txtIdNew.value.trim()).toLocaleLowerCase(),
+            name: txtNameNew.value.trim(),
+            text: txtTextNew.value.trim(),
+            type: selectTypeNew.value,
+            action: selectActionNew.value,
+            need_selected: (checkboxNeedSelectedNew.checked) ? 1 : 0,
+            need_signature: (checkboxNeedSignatureNew.checked) ? 1 : 0,
+            need_custom_text: (checkboxNeedCustomTextNew.checked) ? 1 : 0,
+            enabled: 1,
+            position_compose: positionMax_compose + 1,
+            position_display: positionMax_display + 1,
+            is_default: 0,
+            idnum: idnumMax + 1,
+        });
+        idnumMax++;
+        let curr_idnum = newItem[0].values().idnum;
+        let checkboxes = document.querySelectorAll(`tr[data-idnum="${curr_idnum}"] input[type="checkbox"]`);
+        checkSelectedBoxes(checkboxes);
+        let editBtn = document.querySelector(`tr[data-idnum="${curr_idnum}"] button.btnEditItem`);
+        //console.log(`>>>>>>>>>>>> tr[data-idnum="${curr_idnum}"] button.btnEditItem`);
+        editBtn.addEventListener('click', handleEditClick);
+        //console.log('>>>>>>>>>>>>> editBtn: ' + JSON.stringify(editBtn));
+        let deleteBtn = document.querySelector(`tr[data-idnum="${curr_idnum}"] button.btnDeleteItem`);
+        //console.log(`>>>>>>>>>>>> tr[data-idnum="${curr_idnum}"] button.btnDeleteItem`);
+        deleteBtn.addEventListener('click', handleDeleteClick);
+        let okBtn = document.querySelector(`tr[data-idnum="${curr_idnum}"] button.btnConfirmItem`);
+        okBtn.addEventListener('click', handleConfirmClick);
+        let cancelBtn = document.querySelector(`tr[data-idnum="${curr_idnum}"] button.btnCancelItem`);
+        cancelBtn.addEventListener('click', handleCancelClick);
+        // console.log('>>>>>>>>>>>>> deleteBtn: ' + JSON.stringify(deleteBtn));
+        // console.log('>>>>>>>>>>>>> newItem: ' + JSON.stringify(newItem));
+        document.getElementById('btnNew').disabled = false;
+        clearFields();
+        setSomethingChanged();
+        i18n.updateDocument();
+        window.scrollTo({
+            top: document.body.scrollHeight,
+            behavior: 'smooth'
+          });
+    });
+
+}, { once: true });
+ 
+
+function checkFields() {
+    //console.log('>>>>>>>>>>>>> typeof promptsList: ' + typeof promptsList);
+    //console.log('>>>>>>>>>>>>> Array.isArray(promptsList): ' + Array.isArray(promptsList));
+    // the id must be unique and without spaces
+    let is_error = false;
+    let id_value = document.getElementById('txtIdNew').value.trim();
+    if ((id_value == '')||
+    (/\s/.test(id_value))) {
+        inputSetError('txtIdNew');
+        is_error = true;
+    } else {
+        let exists = promptsList.get("id", id_value);
+        //console.log('>>>>>>>>>>>>> exists: ' + JSON.stringify(exists));
+        if(exists && exists.length > 0) {
+            inputSetError('txtIdNew');
+            is_error = true;
+        } else {
+            inputClearError('txtIdNew');
+        }
+    }
+    if (document.getElementById('txtNameNew').value.trim() == '') {
+        inputSetError('txtNameNew');
+        is_error = true;
+    } else {
+        inputClearError('txtNameNew');
+    }
+    if (document.getElementById('txtTextNew').value.trim() == '') {
+        inputSetError('txtTextNew');
+        is_error = true;
+    } else {
+        inputClearError('txtTextNew');
+    }
+    document.getElementById('btnAddNew').disabled = is_error;
+    return !is_error;
+}
+
+
+function clearFields() {
+    document.getElementById('txtIdNew').value = '';
+    document.getElementById('txtNameNew').value = '';
+    document.getElementById('txtTextNew').value = '';
+    document.getElementById('selectTypeNew').value = '0';
+    document.getElementById('selectActionNew').value = '0';
+    document.getElementById('checkboxNeedSelectedNew').value = '0';
+    document.getElementById('checkboxNeedSignatureNew').value = '0';
+    document.getElementById('checkboxNeedCustomTextNew').value = '0';
+    document.getElementById('formNew').style.display = 'none';
+}
+
+function inputSetError(input) {
+    document.getElementById(input).style.borderColor = 'red';
+}
+
+function inputClearError(input) {
+    document.getElementById(input).style.borderColor = 'green';
+}
+
+function setSomethingChanged(){
+    clearTimeout(msgTimeout);
+    somethingChanged = true;
+    document.getElementById('btnSaveAll').disabled = false;
+    let msgDisplay = document.getElementById('msgDisplay');
+    msgDisplay.innerHTML = browser.i18n.getMessage('customPrompts_unsaved_changes');
+    msgDisplay.style.display = 'inline';
+    msgDisplay.style.color = 'red';
+}
+
+function setNothingChanged(){
+    somethingChanged = false;
+    document.getElementById('btnSaveAll').disabled = true;
+    let msgDisplay = document.getElementById('msgDisplay');
+    msgDisplay.disabled = true;
+    msgDisplay.innerHTML = ''
+    msgDisplay.style.display = 'none';
+    msgDisplay.style.color = '';
+}
+
+function checkSelectedBoxes(checkboxes = null) {
+    if(checkboxes == null){
+        checkboxes = [
+            ...document.querySelectorAll('.need_selected[type="checkbox"]'),
+            ...document.querySelectorAll('.need_signature[type="checkbox"]'),
+            ...document.querySelectorAll('.need_custom_text[type="checkbox"]'),
+            ...document.querySelectorAll('.enabled[type="checkbox"]'),
+        ];
+    }
+
+    // Iterate through the checkboxes
+    checkboxes.forEach(checkbox => {
+        // Check if the 'checked' attribute is "0"
+        if (checkbox.getAttribute('checked_val') == "0") {
+            // Uncheck the checkbox
+            checkbox.checked = false;
+        } else {
+            checkbox.checked = true;
+        }
+    });
+}
+
+//Save all prompts
+async function saveAll() {
+    setMessage(browser.i18n.getMessage('customPrompts_start_saving'));
+    setNothingChanged();
+    if(promptsList != null) {
+        setMessage(browser.i18n.getMessage('customPrompts_reindexing_list'));
+        promptsList.reIndex();
+        let newPrompts = promptsList.items.map(item => {
+            // For each item in the array, return only the '_values' part
+            return item.values();
+        });
+        // newPrompts.forEach(prompt => {
+        //     console.log('>>>>>>>>>>>>> id: ' + JSON.stringify(prompt));
+        // });
+        //console.log('>>>>>>>>>>>>> saveAll: ' + JSON.stringify(newPrompts));
+        setMessage(browser.i18n.getMessage('customPrompts_filtering_prompts'));
+        let newDefaultPrompts = newPrompts.filter(item => item.is_default == 1);
+        //console.log('>>>>>>>>>>>>> newDefaultPrompts: ' + JSON.stringify(newDefaultPrompts));
+        let newCustomPrompts = newPrompts.filter(item => item.is_default == 0);
+        setMessage(browser.i18n.getMessage('customPrompts_saving_default_prompts'));
+        await setDefaultPromptsProperties(newDefaultPrompts);
+        setMessage(browser.i18n.getMessage('customPrompts_saving_custom_prompts'));
+        await setCustomPrompts(newCustomPrompts);
+        setMessage(browser.i18n.getMessage('customPrompts_reloading_menus'));
+        browser.runtime.sendMessage({command: "reload_menus"});
+        setMessage(browser.i18n.getMessage('customPrompts_saved'),'green');
+        msgTimeout = setTimeout(() => {
+            clearMessage();
+        }, 10000)
+    }
+}
+
+function setMessage(msg, color = '') {
+    clearTimeout(msgTimeout);
+    let msgDisplay = document.getElementById('msgDisplay');
+    msgDisplay.innerHTML = msg;
+    msgDisplay.style.display = 'inline';
+    msgDisplay.style.color = color;
+}
+
+function clearMessage() {
+    let msgDisplay = document.getElementById('msgDisplay');
+    msgDisplay.innerHTML = '';
+    msgDisplay.style.display = 'none';
+    msgDisplay.style.color = '';
+}
+
+
+// window.addEventListener('beforeunload', function (event) {
+//     // Check if any changes have been made
+//     if (somethingChanged) {
+//         event.preventDefault();
+//     }
+// });
\ No newline at end of file
diff --git a/images/listjs-arrow-sort-active-down.png b/images/listjs-arrow-sort-active-down.png
new file mode 100644
index 00000000..2736114f
Binary files /dev/null and b/images/listjs-arrow-sort-active-down.png differ
diff --git a/images/listjs-arrow-sort-active-up.png b/images/listjs-arrow-sort-active-up.png
new file mode 100644
index 00000000..4ff00d3c
Binary files /dev/null and b/images/listjs-arrow-sort-active-up.png differ
diff --git a/images/listjs-arrow-sort-inactive.png b/images/listjs-arrow-sort-inactive.png
new file mode 100644
index 00000000..79bc16a6
Binary files /dev/null and b/images/listjs-arrow-sort-inactive.png differ
diff --git a/js/mzta-chatgpt.js b/js/mzta-chatgpt.js
index 0dc0f114..4e6c8ac7 100644
--- a/js/mzta-chatgpt.js
+++ b/js/mzta-chatgpt.js
@@ -47,7 +47,7 @@ async function chatgpt_isIdle() {
 
 function chatgpt_getRegenerateButton() {
     for (const mainSVG of document.querySelectorAll('main svg')) {
-        if (mainSVG.querySelector('path[d*="M4.5 2.5C5.05228"]')) // regen icon found
+        if (mainSVG.querySelector('path[d*="M3.07 10.876C3.623"]')) // regen icon found
             return mainSVG.parentNode.parentNode;
     }
 }
@@ -120,7 +120,8 @@ function addCustomDiv(prompt_action,tabId) {
     style.innerHTML += "#mzta-model_warn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-height:100%px;min-width:30%;max-width:50%;padding:3px;border-radius:5px;text-align:center;background-color:#FFBABA;border:1px solid;font-size:13px;color:#D8000C;display:none;}";
     style.innerHTML += "#mzta-btn_gpt35 {background-color: #007bff;border: none;color: white;padding: 2px 4px;text-align: center;text-decoration: none;display: none;font-size: 13px;margin-left: 4px;transition-duration: 0.4s;cursor: pointer;border-radius: 2px;}";
     style.innerHTML += "#mzta-status-page{position:fixed;bottom:0;left:0;padding-left:5px;font-size:13px;font-style:italic;text-decoration:underline;color:#919191;}";
-    style.innerHTML += "#mzta-status-page:hover{color:#007bff;}";
+    style.innerHTML += "#mzta-force-completion{cursor:pointer;position:fixed;bottom:0;right:0;padding-right:5px;font-size:13px;font-style:italic;text-decoration:underline;color:#919191;}";
+    style.innerHTML += "#mzta-status-page:hover, #mzta-force-completion:hover{color:#007bff;}";
     style.innerHTML += "#mzta-custom_text{padding:10px;width:auto;max-width:80%;height:auto;max-height:80%;border-radius:5px;overflow:auto;position:fixed;top:50%;left:50%;display:none;transform:translate(-50%,-50%);text-align:center;background:#333;color:white;border:3px solid white;}";
     style.innerHTML += "#mzta-custom_loading{height:50px;display:none;}";
     style.innerHTML += "#mzta-custom_textarea{color:black;padding:1px;font-size:15px;width:100%;}";
@@ -155,6 +156,16 @@ function addCustomDiv(prompt_action,tabId) {
     status_page_div.innerHTML = '<a href="https://micz.it/thunderdbird-addon-thunderai/status/">'+ mztaStatusPageDesc +'</a>';
     fixedDiv.appendChild(status_page_div);
 
+    //force completion
+    var force_completion_div = document.createElement('div');
+    force_completion_div.id = 'mzta-force-completion';
+    force_completion_div.innerHTML = mztaForceCompletionDesc;
+    force_completion_div.title = mztaForceCompletionTitle;
+    force_completion_div.addEventListener('click', function() {
+        operation_done();
+    });
+    fixedDiv.appendChild(force_completion_div);
+
     // span for the text
     var curr_msg = document.createElement('span');
     curr_msg.id='mzta-curr_msg';
@@ -275,6 +286,7 @@ function operation_done(){
     document.getElementById('mzta-curr_msg').innerHTML = browser.i18n.getMessage("chatgpt_win_job_completed")+"<br>";
     document.getElementById('mzta-btn_ok').style.display = 'inline';
     document.getElementById('mzta-loading').style.display = 'none';
+    document.getElementById('mzta-force-completion').style.display = 'none';
     chatpgt_scrollToBottom();
 }
 
diff --git a/js/mzta-menus.js b/js/mzta-menus.js
index 3ea432f8..dba7df8b 100644
--- a/js/mzta-menus.js
+++ b/js/mzta-menus.js
@@ -18,14 +18,15 @@
 
 // Some original methods are derived from https://github.com/ali-raheem/Aify/blob/cfadf52f576b7be3720b5b73af7c8d3129c054da/plugin/html/actions.js
 
-import { defaultPrompts } from './mzta-prompts.js';
-import { getLanguageDisplayName } from './mzta-utils.js'
+import { getPrompts } from './mzta-prompts.js';
+import { getLanguageDisplayName, getMenuContextCompose, getMenuContextDisplay } from './mzta-utils.js'
 
 export class mzta_Menus {
 
+    allPrompts = [];
     openChatGPT = null;
-    menu_context_compose = 'compose_action_menu';
-    menu_context_display = 'message_display_action_menu';
+    menu_context_compose = null;
+    menu_context_display = null;
     menu_listeners = {};
 
     rootMenu = [
@@ -33,16 +34,35 @@ export class mzta_Menus {
     ];
 
     constructor(openChatGPT) {
+        this.menu_context_compose = getMenuContextCompose();
+        this.menu_context_display = getMenuContextDisplay();
         this.openChatGPT = openChatGPT;
-        defaultPrompts.forEach((prompt) => {
+        this.allPrompts = [];
+        this.listener = this.listener.bind(this);
+    }
+
+
+    async initialize() {
+        this.allPrompts = [];
+        this.rootMenu = [];
+        this.menu_listeners = {};
+        this.allPrompts = await getPrompts(true);
+        this.allPrompts.forEach((prompt) => {
             this.addAction(prompt)
         });
-        //this.addMenu(this.rootMenu);
+    }
+
+    async reload(){
+        await browser.menus.removeAll().catch(error => {
+                console.error(">>>>>>>> ERROR removing the menus: ", error);
+            });
+        this.removeClickListener();
+        this.loadMenus();
     }
 
     addAction = (curr_prompt) => {
 
-        let curr_menu_entry = {id: curr_prompt.id };
+        let curr_menu_entry = {id: curr_prompt.id, is_default: curr_prompt.is_default, name: curr_prompt.name};
     
         const getHighlight = async () => {
             const tabs = await browser.tabs.query({ active: true, currentWindow: true });
@@ -56,7 +76,7 @@ export class mzta_Menus {
             const msg_text = await getHighlight();
     
             //check if a selection is needed
-            if(curr_prompt.need_selected && (msg_text.selection==='')){
+            if(String(curr_prompt.need_selected) == "1" && (msg_text.selection==='')){
                 //A selection is needed, but nothing is selected!
                 //alert(browser.i18n.getMessage('prompt_selection_needed'));
                 const tabs = await browser.tabs.query({ active: true, currentWindow: true });
@@ -75,7 +95,7 @@ export class mzta_Menus {
             let prefs = await browser.storage.sync.get({default_chatgpt_lang: getLanguageDisplayName(browser.i18n.getUILanguage())});
             let chatgpt_lang = prefs.default_chatgpt_lang;
     
-            var fullPrompt = curr_prompt.text + (curr_prompt.need_signature ? " " + await this.getDefaultSignature():"") + " " + browser.i18n.getMessage("prompt_lang") + chatgpt_lang + ". \"" + body_text + "\" ";
+            var fullPrompt = curr_prompt.text + (String(curr_prompt.need_signature) == "1" ? " " + await this.getDefaultSignature():"") + " " + browser.i18n.getMessage("prompt_lang") + chatgpt_lang + ". \"" + body_text + "\" ";
     
             switch(curr_prompt.id){
                 case 'prompt_translate_this':
@@ -105,47 +125,66 @@ export class mzta_Menus {
         }
     }
 
-    loadMenus() {
-        this.addMenu(this.rootMenu);
-        let listeners = this.menu_listeners;
-        browser.menus.onClicked.addListener((info, tab) => {
-            listeners[info.menuItemId] && listeners[info.menuItemId] (info, tab);
-          });
+    async loadMenus() {
+        await this.initialize();
+        await this.addMenu(this.rootMenu);
+        this.addClickListener();
     }
 
-    addMenu = (menu, root = null) => {
-        for (let item of menu) {
-          let {id, menu, act} = item;
+    listener(info, tab) {
+        let listeners = this.menu_listeners;
+        if (listeners[info.menuItemId]) {
+            listeners[info.menuItemId](info, tab);
+        }
+    }
 
-          browser.menus.create({
-            id: id,
-            title: this.getCustomTextAttribute(id) + browser.i18n.getMessage(id),
-            contexts: this.getContexts(id),
-            parentId: root
-          });
+    addClickListener() {
+        browser.menus.onClicked.addListener(this.listener);
+    }
+
+    removeClickListener() {
+        browser.menus.onClicked.removeListener(this.listener);
+    }
+
+    addMenu = async (menu, root = null) => {
+        for (let item of menu) {
+          let {id, is_default, name, menu, act} = item;
+
+          await new Promise(resolve =>
+            browser.menus.create({
+                id: id,
+                title: this.getCustomTextAttribute(id) + is_default == 1 ? (browser.i18n.getMessage(id) || name) : name,
+                contexts: this.getContexts(id),
+                parentId: root
+              },
+              resolve
+            )
+          );
       
           if (act) {
             this.menu_listeners[id] = act;
           }
       
           if (menu) {
-            this.addMenu(menu, id);
+            await this.addMenu(menu, id);
           }
         }
       
     };
 
     getContexts(id){
-        const curr_prompt = defaultPrompts.find(p => p.id === id);
+        //console.log(">>>>>>>>> id: " + id);
+        const curr_prompt = this.allPrompts.find(p => p.id === id);
+        //console.log(">>>>>>>>>> curr_prompt: " + JSON.stringify(curr_prompt));
         if (!curr_prompt) {
           return [];
         }
-        switch(curr_prompt.type){
-            case 0:
+        switch(String(curr_prompt.type)){
+            case "0":
                 return [this.menu_context_compose, this.menu_context_display];
-            case 1:
+            case "1":
                 return [this.menu_context_display];
-            case 2:
+            case "2":
                 return [this.menu_context_compose];
             default:
                 return [];
@@ -154,11 +193,11 @@ export class mzta_Menus {
     }
 
     getCustomTextAttribute(id){
-        const curr_prompt = defaultPrompts.find(p => p.id === id);
+        const curr_prompt = this.allPrompts.find(p => p.id === id);
         if (!curr_prompt) {
           return "";
         }
-        if(curr_prompt.need_custom_text === 1){
+        if(String(curr_prompt.need_custom_text) === "1"){
             return "*";
         }else{
             return "";
diff --git a/js/mzta-prompts.js b/js/mzta-prompts.js
index bbd08da6..5dcabc93 100644
--- a/js/mzta-prompts.js
+++ b/js/mzta-prompts.js
@@ -16,9 +16,13 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-// Modified version derived from https://github.com/ali-raheem/Aify/blob/13ff87583bc520fb80f555ab90a90c5c9df797a7/plugin/html/globals.js
+// Modified prompts text derived from https://github.com/ali-raheem/Aify/blob/13ff87583bc520fb80f555ab90a90c5c9df797a7/plugin/html/globals.js
 
-/*  Types (type attribute):
+/*  ================= PROMPTS PROPERTIES ========================================
+
+    ================ BASE PROPERTIES
+
+    Types (type attribute):
     0: always show (when composing a part of the text must be selected if need_selected = 1)
     1: show when reading an email
     2: show when composing a mail (a part of the text must be selected if need_selected = 1)
@@ -39,14 +43,166 @@
     Custom Text (need_custom_text attribute):
     0: No custom text needed
     1: Custom text needed
+
+    ================ USER PROPERTIES
+    Enabled (enabled attribute):
+    0: Disabled
+    1: Enabled
+
+    Position Display Message (position_display attribute):
+    <num>: position number
+
+    Position Compose Message (position_compose attribute):
+    <num>: position number
+
 */
 
-export const defaultPrompts = [
-    { id: 'prompt_reply', name: "__MSG_prompt_reply__", text: "Reply to the following email.", type: 1, action: 1, need_selected: 0, need_signature: 1, need_custom_text: 1 },  // need_custom_text set to 1 only for testing
-    { id: 'prompt_rewrite_polite', name: "__MSG_prompt_rewrite_polite__", text: "Rewrite the following text to be more polite. Reply with only the re-written text and with no extra comments or other text.", type: 2, action: 2, need_selected: 1, need_signature: 0, need_custom_text: 0 },
-    { id: 'prompt_rewrite_formal', name: "__MSG_prompt_rewrite_formal__", text: "Rewrite the following text to be more formal. Reply with only the re-written text and with no extra comments or other text.", type: 2, action: 2, need_selected: 1, need_signature: 0, need_custom_text: 0 },
-    { id: 'prompt_classify', name: "__MSG_prompt_classify__", text: "Classify the following text in terms of Politeness, Warmth, Formality, Assertiveness, Offensiveness giving a percentage for each category. Reply with only the category and score with no extra comments or other text.", type: 0, action: 0, need_selected: 0, need_signature: 0, need_custom_text: 0 },
-    { id: 'prompt_summarize_this', name: "__MSG_prompt_summarize_this__", text: "Summarize the following email into a bullet point list.", type: 0, action: 0, need_selected: 0, need_signature: 0, need_custom_text: 0 },
-    { id: 'prompt_translate_this', name: "__MSG_prompt_translate_this__", text: "Translate the following email in ", type: 0, action: 0, need_selected: 0, need_signature: 0, need_custom_text: 0 },
-    { id: 'prompt_this', name: "__MSG_prompt_this__", text: "Reply with only the needed text and with no extra comments or other text.", type: 2, action: 2, need_selected: 1, need_signature: 0, need_custom_text: 0 },
+const defaultPrompts = [
+    {
+        id: 'prompt_reply',
+        name: "__MSG_prompt_reply__",
+        text: "Reply to the following email.",
+        type: "1",
+        action: "1",
+        need_selected: "0",
+        need_signature: "1",
+        need_custom_text: "0",
+        is_default: "1",
+    },
+    {
+        id: 'prompt_rewrite_polite',
+        name: "__MSG_prompt_rewrite_polite__",
+        text: "Rewrite the following text to be more polite. Reply with only the re-written text and with no extra comments or other text.",
+        type: "2",
+        action: "2",
+        need_selected: "1",
+        need_signature: "0",
+        need_custom_text: "0",
+        is_default: "1",
+    },
+    {
+        id: 'prompt_rewrite_formal',
+        name: "__MSG_prompt_rewrite_formal__",
+        text: "Rewrite the following text to be more formal. Reply with only the re-written text and with no extra comments or other text.",
+        type: "2",
+        action: "2",
+        need_selected: "1",
+        need_signature: "0",
+        need_custom_text: "0",
+        is_default: "1",
+    },
+    {
+        id: 'prompt_classify',
+        name: "__MSG_prompt_classify__",
+        text: "Classify the following text in terms of Politeness, Warmth, Formality, Assertiveness, Offensiveness giving a percentage for each category. Reply with only the category and score with no extra comments or other text.",
+        type: "0",
+        action: "0",
+        need_selected: "0",
+        need_signature: "0",
+        need_custom_text: "0",
+        is_default: "1",
+    },
+    {
+        id: 'prompt_summarize_this',
+        name: "__MSG_prompt_summarize_this__",
+        text: "Summarize the following email into a bullet point list.",
+        type: "0",
+        action: "0",
+        need_selected: "0",
+        need_signature: "0",
+        need_custom_text: "0",
+        is_default: "1",
+    },
+    {
+        id: 'prompt_translate_this',
+        name: "__MSG_prompt_translate_this__",
+        text: "Translate the following email in ",
+        type: "0",
+        action: "0",
+        need_selected: "0",
+        need_signature: "0",
+        need_custom_text: "0",
+        is_default: "1",
+    },
+    {
+        id: 'prompt_this',
+        name: "__MSG_prompt_this__",
+        text: "Reply with only the needed text and with no extra comments or other text.",
+        type: "2",
+        action: "2",
+        need_selected: "1",
+        need_signature: "0",
+        need_custom_text: "0",
+        is_default: "1",
+    },
 ];
+
+
+export async function getPrompts(filterDisabled = false){
+    const defaultPrompts = await getDefaultPrompts_withProps();
+    const customPrompts = await getCustomPrompts();
+    let output = defaultPrompts.concat(customPrompts);
+    if(filterDisabled){
+        output = output.filter(obj => obj.enabled != 0);
+    }
+    output.sort((a, b) => a.id.localeCompare(b.id));
+    for(let i=1; i<=output.length; i++){
+        output[i-1].idnum = i;
+    }
+    return output;
+}
+
+
+async function getDefaultPrompts_withProps() {
+    let prefs = await browser.storage.sync.get({_default_prompts_properties: null}); //production
+    let defaultPrompts_prop = [...defaultPrompts];
+    if(prefs._default_prompts_properties === null){     // no default prompts properties saved
+        let pos = 1;
+        defaultPrompts_prop.forEach((prompt) => {
+            prompt.position_display = pos;
+            prompt.position_compose = pos;
+            prompt.enabled = 1;
+            pos++;
+        })
+    } else {    // we have saved default prompts properties
+        let pos = 1000;
+        defaultPrompts_prop.forEach((prompt) => {
+            if(prefs._default_prompts_properties?.[prompt.id]){
+                prompt.position_compose = prefs._default_prompts_properties[prompt.id].position_compose;
+                prompt.position_display = prefs._default_prompts_properties[prompt.id].position_display;
+                prompt.enabled = prefs._default_prompts_properties[prompt.id].enabled;
+            }else{
+                prompt.position_display = pos;
+                prompt.position_compose = pos;
+                prompt.enabled = 1;
+                pos++;
+            }
+        })
+    }
+    return defaultPrompts_prop;
+}
+
+
+async function getCustomPrompts() {
+    let prefs = await browser.storage.sync.get({_custom_prompt: null});
+    if(prefs._custom_prompt === null){
+        return [];
+    } else {
+        return prefs._custom_prompt;
+    }
+}
+
+export async function setDefaultPromptsProperties(prompts) {
+    let default_prompts_properties = {};
+    prompts.forEach((prompt) => {
+        default_prompts_properties[prompt.id] = {position_compose: prompt.position_compose, position_display: prompt.position_display, enabled: prompt.enabled};
+    });
+    console.log('>>>>>>>>>>>>>> default_prompts_properties: ' + JSON.stringify(default_prompts_properties));
+    await browser.storage.sync.set({_default_prompts_properties: default_prompts_properties});
+}
+
+
+export async function setCustomPrompts(prompts) {
+    await browser.storage.sync.set({_custom_prompt: prompts});
+}
+
diff --git a/js/mzta-utils.js b/js/mzta-utils.js
index 24efbfdc..336f2010 100644
--- a/js/mzta-utils.js
+++ b/js/mzta-utils.js
@@ -16,6 +16,9 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
+export const getMenuContextCompose = () => 'compose_action_menu';
+export const getMenuContextDisplay = () => 'message_display_action_menu';
+
 
 export function getLanguageDisplayName(languageCode) {
    const languageDisplay = new Intl.DisplayNames([languageCode], {type: 'language'});
diff --git a/mzta-background.js b/mzta-background.js
index 71ef5ff4..ca23d104 100644
--- a/mzta-background.js
+++ b/mzta-background.js
@@ -113,6 +113,10 @@ messenger.runtime.onMessage.addListener(async (message, sender, sendResponse) =>
                 await setBody(message.tabId, original_html);
                 await setBody(message.tabId, modified_html);
                 break;
+            case 'reload_menus':
+                await menus.reload();
+                console.log('>>>>>>>>>>>>>>>>> Reloaded menus');
+                break;
             default:
                 break;
         }
@@ -162,6 +166,8 @@ async function openChatGPT(promptText, action, curr_tabId, do_custom_text = 0) {
     });
 
     let pre_script = `let mztaStatusPageDesc="`+ browser.i18n.getMessage("prefs_status_page") +`";
+    let mztaForceCompletionDesc="`+ browser.i18n.getMessage("chatgpt_force_completion") +`";
+    let mztaForceCompletionTitle="`+ browser.i18n.getMessage("chatgpt_force_completion_title") +`";
     let mztaDoCustomText=`+ do_custom_text +`;
     `;
 
diff --git a/options/mzta-options.css b/options/mzta-options.css
index adb05909..27483aea 100644
--- a/options/mzta-options.css
+++ b/options/mzta-options.css
@@ -1,3 +1,16 @@
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: rgb(35, 34, 43);
+        color: rgb(251, 251, 254);
+    }
+    
+    a:link { color: #409EFF; }   
+    a:visited { color: #409EFF; }  
+    a:hover { color: #66B1FF; }   
+    a:active { color: #66B1FF; }
+    
+}
+
 div#miczDescription{
     padding:0px 15px 0px 15px;
     font-size: 13px;
@@ -71,4 +84,10 @@ input#chatgpt_win_height{
 span.dims_label{
     width: 75px;
     display: inline-block;
+}
+
+#btn_custom_prompts{
+    text-align: center;
+    width: 100%;
+    margin: 10px 0px;
 }
\ No newline at end of file
diff --git a/options/mzta-options.html b/options/mzta-options.html
index 4d8e79a3..b7fab2ef 100644
--- a/options/mzta-options.html
+++ b/options/mzta-options.html
@@ -71,6 +71,9 @@
         </td>
       </tr>
     </table>
+    <div id="btn_custom_prompts">
+        <button id="btnManagePrompts">__MSG_prefs_OptionText_btnManagePrompts__</button>
+    </div>
     <div id="miczDescription">
       <h1>__MSG_prefsInfoTitle__</h1>
       <p>__MSG_prefsInfoDesc_1__<br/>
diff --git a/options/mzta-options.js b/options/mzta-options.js
index 1d443b30..394b0ca6 100644
--- a/options/mzta-options.js
+++ b/options/mzta-options.js
@@ -93,4 +93,16 @@ document.addEventListener('DOMContentLoaded', () => {
   document.querySelectorAll(".option-input").forEach(element => {
     element.addEventListener("change", saveOptions);
   });
+  document.getElementById('btnManagePrompts').addEventListener('click', () => {
+    // check if the tab is already there
+    browser.tabs.query({url: browser.runtime.getURL('../customprompts/mzta-custom-prompts.html')}).then((tabs) => {
+      if (tabs.length > 0) {
+        // if the tab is already there, focus it
+        browser.tabs.update(tabs[0].id, {active: true});
+      } else {
+        // if the tab is not there, create it
+        browser.tabs.create({url: browser.runtime.getURL('../customprompts/mzta-custom-prompts.html')});
+      }
+    })
+  });
 }, { once: true });
diff --git a/options/mzta-release-notes.css b/options/mzta-release-notes.css
index 1cd3e410..766207ad 100644
--- a/options/mzta-release-notes.css
+++ b/options/mzta-release-notes.css
@@ -1,3 +1,16 @@
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: rgb(35, 34, 43);
+        color: rgb(251, 251, 254);
+    }
+    
+    a:link { color: #409EFF; }   
+    a:visited { color: #409EFF; }  
+    a:hover { color: #66B1FF; }   
+    a:active { color: #66B1FF; }
+    
+}
+
 div#miczRelNotes{
     padding: 10px;
 }
diff --git a/options/mzta-release-notes.html b/options/mzta-release-notes.html
index e17bd08a..ce580c4d 100644
--- a/options/mzta-release-notes.html
+++ b/options/mzta-release-notes.html
@@ -10,7 +10,13 @@
       <h2>Version 1.1.0 - ??/??/2024</h2>
       <ul>
         <li>A prompt can be configured to request additional text from the user.</li>
-        <li>...</li>
+        <li>Added custom prompts. See more info <a href="https://micz.it/thunderdbird-addon-thunderai/custom-prompts/">here</a>.</li>
+        <li>Dark mode added.</li>
+      </ul>
+      <h2>Version 1.0.6 - 08/05/2024</h2>
+      <ul>
+        <li>Correctly handling a change in the ChatGPT web interface. See issue <a href="https://github.com/micz/ThunderAI/issues/43">#43</a></li>
+        <li>Added a button to force the completion to display the 'Use last answer' button if ChatGPT has finished its work but the button has not appeared.</li>
       </ul>
       <h2>Version 1.0.5 - 03/05/2024</h2>
       <ul>