Add spinner component

.gitignore

@@ -24,7 +24,7 @@ media
 .sass-cache
 pip-selfcheck.json
 
-3rdparty/libsignal-protocol-javascript/
+3rdparty/
 *.map
 
 locale.zip

src/index.js

@@ -5,8 +5,9 @@
  */
 import 'shared/styles/index.scss';
 
-import "./i18n/index.js";
+import "i18n/index.js";
 import "shared/registry.js";
+import 'shared/components/index.js';
 import { CustomElement } from 'shared/components/element';
 import { VIEW_PLUGINS } from './shared/constants.js';
 import { _converse, converse } from "@converse/headless";

src/plugins/adhoc-views/templates/ad-hoc.js

@@ -2,7 +2,6 @@
  * @typedef {import('../adhoc-commands').default} AdHocCommands
  */
 import tplCommand from './ad-hoc-command.js';
-import tplSpinner from 'templates/spinner.js';
 import { __ } from 'i18n';
 import { getAutoCompleteList } from 'plugins/muc-views/utils.js';
 import { html } from 'lit';
@@ -39,7 +38,7 @@ export default (el) => {
             </fieldset>
             <fieldset>
                 ${el.fetching
-                    ? tplSpinner()
+                    ? html`<converse-spinner></converse-spinner>`
                     : html`<input type="submit" class="btn btn-primary" value="${i18n_fetch_commands}" />`}
             </fieldset>
             ${el.view === 'list-commands'

src/plugins/controlbox/index.js

@@ -3,22 +3,21 @@
  * @license Mozilla Public License (MPLv2)
  */
 import { _converse, api, converse, log, constants } from '@converse/headless';
-import "shared/components/brand-heading.js";
-import "../chatview/index.js";
-import './loginform.js';
-import './navback.js';
-import './buttons.js';
+import LoginForm from './loginform.js';
 import ControlBox from './model.js';
 import ControlBoxToggle from './toggle.js';
 import ControlBoxView from './controlbox.js';
 import controlbox_api from './api.js';
 import { addControlBox, clearSession, disconnect, onChatBoxesFetched } from './utils.js';
+import 'shared/components/brand-heading.js';
+import '../chatview/index.js';
+import './navback.js';
+import './buttons.js';
 
 import './styles/_controlbox.scss';
 
 const { CONTROLBOX_TYPE } = constants;
 
-
 converse.plugins.add('converse-controlbox', {
     /* Plugin dependencies are other plugins which might be
      * overridden or relied upon, and therefore need to be loaded before
@@ -30,11 +29,11 @@ converse.plugins.add('converse-controlbox', {
      */
     dependencies: ['converse-modal', 'converse-chatboxes', 'converse-chat', 'converse-rosterview', 'converse-chatview'],
 
-    enabled (_converse) {
+    enabled(_converse) {
         return !_converse.api.settings.get('singleton');
     },
 
-    initialize () {
+    initialize() {
         api.settings.extend({
             allow_logout: true,
             allow_user_trust_override: true,
@@ -42,13 +41,13 @@ converse.plugins.add('converse-controlbox', {
             locked_domain: undefined,
             show_connection_url_input: false,
             show_controlbox_by_default: false,
-            sticky_controlbox: false
+            sticky_controlbox: false,
         });
 
         api.promises.add('controlBoxInitialized', false);
         Object.assign(api, controlbox_api);
 
-        const exports = { ControlBox, ControlBoxView, ControlBoxToggle };
+        const exports = { ControlBox, ControlBoxView, ControlBoxToggle, LoginForm };
         Object.assign(_converse, exports); // DEPRECATED
         Object.assign(_converse.exports, exports);
 
@@ -60,6 +59,6 @@ converse.plugins.add('converse-controlbox', {
 
         api.waitUntil('chatBoxViewsInitialized')
             .then(addControlBox)
-            .catch(e => log.fatal(e));
-    }
+            .catch((e) => log.fatal(e));
+    },
 });

src/shared/components/index.js

@@ -0,0 +1,11 @@
+import './brand-heading.js';
+import './brand-logo.js';
+import './dropdown.js';
+import './font-awesome.js';
+import './icons.js';
+import './image-picker.js';
+import './list-filter.js';
+import './message-versions.js';
+import './observable.js';
+import './spinner.js';
+import './split-resize.js';

src/shared/components/spinner.js

@@ -0,0 +1,11 @@
+import { api } from '@converse/headless';
+import tplSpinner from 'templates/spinner.js';
+import { CustomElement } from './element.js';
+
+export default class Spinner extends CustomElement {
+    render() {
+        return tplSpinner();
+    }
+}
+
+api.elements.define('converse-spinner', Spinner);

src/types/shared/components/index.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.d.ts.map

src/types/shared/components/spinner.d.ts

@@ -0,0 +1,5 @@
+export default class Spinner extends CustomElement {
+    render(): import("lit-html").TemplateResult<1>;
+}
+import { CustomElement } from './element.js';
+//# sourceMappingURL=spinner.d.ts.map