Use latest EventEmitter from Skeletor

package-lock.json

@@ -1835,8 +1835,8 @@
     },
     "node_modules/@converse/skeletor": {
       "version": "0.0.8",
-      "resolved": "git+ssh://git@github.com/conversejs/skeletor.git#c845797101e21a163ac403fc65eac6db069a16b1",
-      "integrity": "sha512-lAMl9FCtNa2TXmp5+WQWZnIOa35+6MHRWx/PvZd4xQSHB1HOZqYxc00sBRh8E/XvpYvHwknDT7pkND8I+rL+UA==",
+      "resolved": "git+ssh://git@github.com/conversejs/skeletor.git#dc5acf92369fffef548252d5ba2e9ba754fa262c",
+      "integrity": "sha512-z6ghozaR2H9BqPyHe5NK5By4G6zUaN1vWhHbtjP7FAM5Y0+PReB8Xhw3VJpp9S8PLw6VI9xMP68VaUfixt7Uiw==",
       "license": "MIT",
       "dependencies": {
         "@converse/localforage-getitems": "1.4.3",
@@ -11419,7 +11419,7 @@
       "license": "MPL-2.0",
       "dependencies": {
         "@converse/openpromise": "^0.0.1",
-        "@converse/skeletor": "conversejs/skeletor#c845797101e21a163ac403fc65eac6db069a16b1",
+        "@converse/skeletor": "conversejs/skeletor#dc5acf92369fffef548252d5ba2e9ba754fa262c",
         "dayjs": "^1.11.8",
         "dompurify": "^2.3.1",
         "filesize": "^10.0.7",

src/headless/package.json

@@ -32,7 +32,7 @@
   },
   "dependencies": {
     "@converse/openpromise": "^0.0.1",
-    "@converse/skeletor": "conversejs/skeletor#c845797101e21a163ac403fc65eac6db069a16b1",
+    "@converse/skeletor": "conversejs/skeletor#dc5acf92369fffef548252d5ba2e9ba754fa262c",
     "dayjs": "^1.11.8",
     "dompurify": "^2.3.1",
     "filesize": "^10.0.7",

src/headless/plugins/chat/model-with-contact.js

@@ -1,5 +1,5 @@
 import api from "../../shared/api/index.js";
-import { Model } from '@converse/skeletor/src/model.js';
+import { Model } from '@converse/skeletor';
 import { getOpenPromise } from '@converse/openpromise';
 
 class ModelWithContact extends Model {
@@ -9,6 +9,9 @@ class ModelWithContact extends Model {
         this.rosterContactAdded = getOpenPromise();
     }
 
+    /**
+     * @param {string} jid
+     */
     async setRosterContact (jid) {
         const contact = await api.contacts.get(jid);
         if (contact) {

src/headless/plugins/chat/model.js

@@ -5,6 +5,7 @@ import pick from "lodash-es/pick";
 import _converse from '../../shared/_converse.js';
 import api, { converse } from '../../shared/api/index.js';
 import { Model } from '@converse/skeletor/src/model.js';
+import { PRIVATE_CHAT_TYPE } from '@converse/headless/shared/constants.js';
 import { TimeoutError } from '../../shared/errors.js';
 import { debouncedPruneHistory, handleCorrection } from '../../shared/chat/utils.js';
 import { filesize } from "filesize";
@@ -12,10 +13,10 @@ import { getMediaURLsMetadata } from '../../shared/parsers.js';
 import { getOpenPromise } from '@converse/openpromise';
 import { initStorage } from '../../utils/storage.js';
 import { isEmptyMessage } from '../../utils/index.js';
+import { isNewMessage } from './utils.js';
 import { isUniView } from '../../utils/session.js';
 import { parseMessage } from './parsers.js';
 import { sendMarker } from '../../shared/actions.js';
-import { isNewMessage } from './utils.js';
 
 const { Strophe, $msg } = converse.env;
 
@@ -38,7 +39,7 @@ class ChatBox extends ModelWithContact {
             'num_unread': 0,
             'time_opened': this.get('time_opened') || (new Date()).getTime(),
             'time_sent': (new Date(0)).toISOString(),
-            'type': _converse.PRIVATE_CHAT_TYPE,
+            'type': PRIVATE_CHAT_TYPE,
             'url': ''
         }
     }
@@ -62,7 +63,7 @@ class ChatBox extends ModelWithContact {
         this.initUI();
         this.initMessages();
 
-        if (this.get('type') === _converse.PRIVATE_CHAT_TYPE) {
+        if (this.get('type') === PRIVATE_CHAT_TYPE) {
             this.presence = _converse.presences.get(jid) || _converse.presences.create({ jid });
             await this.setRosterContact(jid);
             this.presence.on('change:show', item => this.onPresenceChanged(item));

src/headless/shared/_converse.js

@@ -1,7 +1,6 @@
 import i18n from './i18n.js';
-import log from '../log.js';
 import pluggable from 'pluggable.js/src/pluggable.js';
-import { Events } from '@converse/skeletor/src/events.js';
+import { EventEmitter } from '@converse/skeletor';
 import { getOpenPromise } from '@converse/openpromise';
 
 import {
@@ -30,60 +29,68 @@ import {
 
 
 /**
- * A private, closured object containing the private api (via {@link _converse.api})
+ * A private, closured namespace containing the private api (via {@link _converse.api})
  * as well as private methods and internal data-structures.
  * @global
  * @namespace _converse
  */
-const _converse = {
-    VERSION_NAME,
+class ConverseNamespace extends EventEmitter(Object) {
 
-    templates: {},
-    promises: {
-        'initialized': getOpenPromise()
-    },
+    constructor () {
+        super();
 
-    // TODO: remove constants in next major release
-    ANONYMOUS,
-    CLOSED,
-    EXTERNAL,
-    LOGIN,
-    LOGOUT,
-    OPENED,
-    PREBIND,
+        this.VERSION_NAME = VERSION_NAME;
 
-    SUCCESS,
-    FAILURE,
+        this.templates = {};
+        this.promises = {
+            'initialized': getOpenPromise()
+        };
 
-    DEFAULT_IMAGE_TYPE,
-    DEFAULT_IMAGE,
 
-    INACTIVE,
-    ACTIVE,
-    COMPOSING,
-    PAUSED,
-    GONE,
+        Object.assign(this, {
+            ANONYMOUS,
+            CLOSED,
+            EXTERNAL,
+            LOGIN,
+            LOGOUT,
+            OPENED,
+            PREBIND,
 
-    PRIVATE_CHAT_TYPE,
-    CHATROOMS_TYPE,
-    HEADLINES_TYPE,
-    CONTROLBOX_TYPE,
+            SUCCESS,
+            FAILURE,
+
+            DEFAULT_IMAGE_TYPE,
+            DEFAULT_IMAGE,
+
+            INACTIVE,
+            ACTIVE,
+            COMPOSING,
+            PAUSED,
+            GONE,
+
+            PRIVATE_CHAT_TYPE,
+            CHATROOMS_TYPE,
+            HEADLINES_TYPE,
+            CONTROLBOX_TYPE,
 
-    // Set as module attr so that we can override in tests.
-    // TODO: replace with config settings
-    TIMEOUTS: {
-        PAUSED: 10000,
-        INACTIVE: 90000
-    },
+            // Set as module attr so that we can override in tests.
+            // TODO: replace with config settings
+            TIMEOUTS: {
+                PAUSED: 10000,
+                INACTIVE: 90000
+            },
+        });
+    }
 
     /**
      * Translate the given string based on the current locale.
      * @method __
-     * @private
      * @memberOf _converse
      * @param { ...String } args
      */
-    '__': (...args) => i18n.__(...args),
+    __ (...args) {
+        return i18n.__(...args);
+    }
 
     /**
      * A no-op method which is used to signal to gettext that the passed in string
@@ -97,15 +104,15 @@ const _converse = {
      * and we don't yet have the variables at scan time.
      *
      * @method ___
-     * @private
      * @memberOf _converse
      * @param { String } str
      */
-    '___': str => str
+    ___ (str) {
+        return str;
+    }
 }
 
-// Make _converse an event emitter
-Object.assign(_converse, Events);
+const _converse = new ConverseNamespace();
 
 // Make _converse pluggable
 pluggable.enable(_converse, '_converse', 'pluggable');

src/headless/shared/api/index.js

@@ -29,6 +29,7 @@ const api = {
 
     disco: null,
     elements: null,
+    contacts: null,
 };
 
 export default api;

src/headless/shared/settings/utils.js

@@ -1,17 +1,20 @@
+import EventEmitter from '@converse/skeletor/src/eventemitter.js';
 import _converse from '../_converse.js';
 import isEqual from "lodash-es/isEqual.js";
 import log from '../../log.js';
 import pick from 'lodash-es/pick';
-import { merge } from '../../utils/object.js';
 import { DEFAULT_SETTINGS } from './constants.js';
-import { Events } from '@converse/skeletor/src/events.js';
 import { Model } from '@converse/skeletor/src/model.js';
 import { initStorage } from '../../utils/storage.js';
+import { merge } from '../../utils/object.js';
+
 
 let app_settings;
 let init_settings = {}; // Container for settings passed in via converse.initialize
 let user_settings; // User settings, populated via api.users.settings
 
+class AppSettings extends EventEmitter(Object) {}
+
 export function getAppSettings () {
     return app_settings;
 }
@@ -19,8 +22,7 @@ export function getAppSettings () {
 export function initAppSettings (settings) {
     init_settings = settings;
 
-    app_settings = {};
-    Object.assign(app_settings, Events);
+    app_settings = new AppSettings();
 
     // Allow only whitelisted settings to be overwritten via converse.initialize
     const allowed_settings = pick(settings, Object.keys(DEFAULT_SETTINGS));

src/shared/autocomplete/autocomplete.js

@@ -1,26 +1,40 @@
 /**
  * @copyright Lea Verou and the Converse.js contributors
- * @description
- *  Started as a fork of Lea Verou's "Awesomplete"
- *  https://leaverou.github.io/awesomplete/
+ * @description Started as a fork of Lea Verou's "Awesomplete"
  * @license Mozilla Public License (MPLv2)
  */
 
 import Suggestion from './suggestion.js';
-import { Events } from '@converse/skeletor/src/events.js';
+import { EventEmitter } from '@converse/skeletor';
 import { converse } from "@converse/headless";
 import { helpers, FILTER_CONTAINS, ITEM, SORT_BY_QUERY_POSITION } from './utils.js';
 import { siblingIndex } from '@converse/headless/utils/html.js';
 
-
 const u = converse.env.utils;
 
 
-export class AutoComplete {
+export class AutoComplete extends EventEmitter(Object) {
 
+    /**
+     * @param {HTMLElement} el
+     * @param {any} config
+     */
     constructor (el, config={}) {
+        super();
+
         this.suggestions = [];
         this.is_opened = false;
+        this.auto_evaluate = true; // evaluate automatically without any particular key as trigger
+        this.match_current_word = false; // Match only the current word, otherwise all input is matched
+        this.sort = config.sort === false ? false : SORT_BY_QUERY_POSITION;
+        this.filter = FILTER_CONTAINS;
+        this.ac_triggers = []; // Array of keys (`ev.key`) values that will trigger auto-complete
+        this.include_triggers = []; // Array of trigger keys which should be included in the returned value
+        this.min_chars = 2;
+        this.max_items = 10;
+        this.auto_first = false; // Should the first element be automatically selected?
+        this.data = (a) => a;
+        this.item = ITEM;
 
         if (u.hasClass('suggestion-box', el)) {
             this.container = el;
@@ -33,19 +47,7 @@ export class AutoComplete {
         this.ul = this.container.querySelector('.suggestion-box__results');
         this.status = this.container.querySelector('.suggestion-box__additions');
 
-        Object.assign(this, {
-            'match_current_word': false, // Match only the current word, otherwise all input is matched
-            'ac_triggers': [], // Array of keys (`ev.key`) values that will trigger auto-complete
-            'include_triggers': [], // Array of trigger keys which should be included in the returned value
-            'min_chars': 2,
-            'max_items': 10,
-            'auto_evaluate': true, // Should evaluation happen automatically without any particular key as trigger?
-            'auto_first': false, // Should the first element be automatically selected?
-            'data': a => a,
-            'filter': FILTER_CONTAINS,
-            'sort': config.sort === false ? false : SORT_BY_QUERY_POSITION,
-            'item': ITEM
-        }, config);
+        Object.assign(this, config);
 
         this.index = -1;
 
@@ -316,7 +318,4 @@ export class AutoComplete {
     }
 }
 
-// Make it an event emitter
-Object.assign(AutoComplete.prototype, Events);
-
 export default AutoComplete;

src/shared/components/element.js

@@ -1,8 +1,8 @@
+import { EventEmitter } from '@converse/skeletor';
 import { LitElement } from 'lit';
-import { Events } from '@converse/skeletor/src/events.js';
 
 
-export class CustomElement extends LitElement {
+export class CustomElement extends EventEmitter(LitElement) {
 
     createRenderRoot () {
         // Render without the shadow DOM
@@ -23,5 +23,3 @@ export class CustomElement extends LitElement {
         this.stopListening();
     }
 }
-
-Object.assign(CustomElement.prototype, Events);