@inboxsdk/core 0.2.28-alpha.3 → 0.2.28-alpha.5

package/src/platform-implementation-js/widgets/buttons/dropdown-button-view-controller.js

@@ -0,0 +1,98 @@
+import kefirStopper from 'kefir-stopper';
+import DropdownView from './dropdown-view';
+export default class DropdownButtonViewController {
+    _view;
+    _dropdownShowFunction;
+    _dropdownView = null;
+    _DropdownViewDriverClass;
+    _dropdownPositionOptions;
+    _stopper = kefirStopper();
+    constructor(options) {
+        this._dropdownShowFunction = options.dropdownShowFunction;
+        this._DropdownViewDriverClass = options.dropdownViewDriverClass;
+        const view = (this._view = options.buttonView);
+        this._dropdownPositionOptions = options.dropdownPositionOptions;
+        view.getElement().setAttribute('aria-haspopup', 'true');
+        view.getElement().setAttribute('aria-pressed', 'false');
+        view.getElement().setAttribute('aria-expanded', 'false');
+        this._bindToViewEvents();
+    }
+    getStopper() {
+        return this._stopper;
+    }
+    destroy() {
+        if (this._view) {
+            this._view.destroy();
+            this._view = null;
+        }
+        if (this._dropdownView) {
+            this._dropdownView.close();
+            this._dropdownView = null;
+        }
+        this._stopper.destroy();
+    }
+    update(options) {
+        this.getView().update(options);
+        this.setDropdownShowFunction(options && options.dropdownShowFunction);
+    }
+    getView() {
+        if (!this._view)
+            throw new Error('Already destroyed');
+        return this._view;
+    }
+    setDropdownShowFunction(func) {
+        this._dropdownShowFunction = func;
+    }
+    showDropdown() {
+        this.hideDropdown();
+        const view = this._view;
+        if (!view)
+            throw new Error('Already destroyed');
+        view.activate();
+        const dropdownView = (this._dropdownView = new DropdownView(new this._DropdownViewDriverClass(), view.getElement(), undefined));
+        if (this._dropdownPositionOptions) {
+            dropdownView.setPlacementOptions(this._dropdownPositionOptions);
+        }
+        dropdownView.on('destroy', this._dropdownClosed.bind(this));
+        if (this._dropdownShowFunction) {
+            this._dropdownShowFunction({ dropdown: this._dropdownView });
+        }
+        view.getElement().setAttribute('aria-pressed', 'true');
+        view.getElement().setAttribute('aria-expanded', 'true');
+    }
+    hideDropdown() {
+        if (this._dropdownView) {
+            this._dropdownView.close();
+        }
+    }
+    isDropdownVisible() {
+        return !!this._dropdownView;
+    }
+    _bindToViewEvents() {
+        if (!this._view)
+            throw new Error('Already destroyed');
+        this._view
+            .getEventStream()
+            .filter((event) => event.eventName === 'click')
+            .onValue(() => {
+            this._toggleDropdownState();
+        });
+    }
+    _toggleDropdownState() {
+        if (this._dropdownView) {
+            this._dropdownView.close();
+        }
+        else {
+            this.showDropdown();
+        }
+    }
+    _dropdownClosed() {
+        const view = this._view;
+        if (view) {
+            view.deactivate();
+            this._dropdownView = null;
+            view.getElement().setAttribute('aria-pressed', 'false');
+            view.getElement().setAttribute('aria-expanded', 'false');
+        }
+    }
+}

package/src/platform-implementation-js/widgets/buttons/dropdown-view.js

@@ -0,0 +1,122 @@
+import asap from 'asap';
+import EventEmitter from '../../lib/safe-event-emitter';
+import Kefir from 'kefir';
+import makeMutationObserverChunkedStream from '../../lib/dom/make-mutation-observer-chunked-stream';
+import ScrollableContainByScreen from '../../lib/ScrollableContainByScreen';
+import outsideClicksAndEscape from '../../lib/dom/outsideClicksAndEscape';
+// documented in src/docs/
+export default class DropdownView extends EventEmitter {
+    _dropdownViewDriver;
+    destroyed = false;
+    /*deprecated*/ closed = false;
+    _options;
+    _userPlacementOptions = { hAlign: 'left' };
+    _scrollableContainByScreen = null;
+    _didInsertContainerEl;
+    el;
+    constructor(dropdownViewDriver, anchorElement, options) {
+        super();
+        this._dropdownViewDriver = dropdownViewDriver;
+        this._options = {
+            ...(dropdownViewDriver.getDropdownOptions &&
+                dropdownViewDriver.getDropdownOptions()),
+            ...options,
+        };
+        this.el = dropdownViewDriver.getContentElement();
+        const containerEl = dropdownViewDriver.getContainerElement();
+        if (document.contains(containerEl)) {
+            this._didInsertContainerEl = false;
+        }
+        else {
+            document.body.insertBefore(containerEl, document.body.firstElementChild);
+            this._didInsertContainerEl = true;
+        }
+        if (!containerEl.hasAttribute('tabindex')) {
+            // makes the element focusable, but not tab-focusable
+            containerEl.setAttribute('tabindex', '-1');
+        }
+        const onDestroy = Kefir.fromEvents(this, 'destroy');
+        const elementsToIgnore = [anchorElement, containerEl];
+        if (this._options.extraElementsToIgnore) {
+            elementsToIgnore.push(...this._options.extraElementsToIgnore);
+        }
+        outsideClicksAndEscape(elementsToIgnore)
+            .takeUntilBy(onDestroy)
+            .filter((event) => {
+            let isCanceled = false;
+            const appEvent = {
+                type: event.type,
+                cause: event.cause,
+                cancel: () => {
+                    isCanceled = true;
+                },
+            };
+            this.emit('preautoclose', appEvent);
+            return !isCanceled;
+        })
+            .onValue(() => {
+            this.close();
+        });
+        if (!this._options.manualPosition) {
+            containerEl.style.position = 'fixed';
+            asap(() => {
+                if (this.closed)
+                    return;
+                Kefir.fromEvents(this, '_placementOptionsUpdated')
+                    .toProperty(() => null)
+                    .takeUntilBy(onDestroy)
+                    .onValue(() => {
+                    if (this._scrollableContainByScreen) {
+                        this._scrollableContainByScreen.destroy();
+                    }
+                    this._scrollableContainByScreen = new ScrollableContainByScreen(containerEl, anchorElement, this._userPlacementOptions);
+                });
+                makeMutationObserverChunkedStream(dropdownViewDriver.getContentElement(), {
+                    childList: true,
+                    attributes: true,
+                    characterData: true,
+                    subtree: true,
+                })
+                    .throttle(200)
+                    .takeUntilBy(onDestroy)
+                    .onValue(() => this.reposition());
+            });
+        }
+        const startActiveElement = document.activeElement;
+        asap(() => {
+            if (this.closed)
+                return;
+            if (document.activeElement !== startActiveElement)
+                return;
+            // Needs to happen after it's been positioned.
+            containerEl.focus();
+        });
+    }
+    setPlacementOptions(options) {
+        if (this._options.manualPosition) {
+            // eslint-disable-next-line no-console
+            console.error('DropdownView.setPlacementOptions() was called on a manually-positioned DropdownView.');
+            return;
+        }
+        this._userPlacementOptions = { ...this._userPlacementOptions, ...options };
+        this.emit('_placementOptionsUpdated');
+    }
+    close() {
+        if (!this.destroyed) {
+            this.destroyed = this.closed = true;
+            if (this._scrollableContainByScreen) {
+                this._scrollableContainByScreen.destroy();
+            }
+            this.emit('destroy');
+            if (this._didInsertContainerEl) {
+                this._dropdownViewDriver.getContainerElement().remove();
+            }
+            this._dropdownViewDriver.destroy();
+        }
+    }
+    reposition() {
+        if (this._scrollableContainByScreen) {
+            this._scrollableContainByScreen.reposition();
+        }
+    }
+}

package/src/platform-implementation-js/widgets/drawer-view.js

@@ -1,19 +1,21 @@
-/* @flow */
-
-import Kefir from 'kefir';
-import kefirBus from 'kefir-bus';
-import { defn } from 'ud';
-import EventEmitter from '../lib/safe-event-emitter';
-import ComposeView from '../views/compose-view';
-
-import type { DrawerViewDriver } from '../driver-interfaces/driver';
-
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _kefir = _interopRequireDefault(require("kefir"));
+var _kefirBus = _interopRequireDefault(require("kefir-bus"));
+var _ud = require("ud");
+var _safeEventEmitter = _interopRequireDefault(require("../lib/safe-event-emitter"));
+var _composeView = _interopRequireDefault(require("../views/compose-view"));
 // documented in src/docs/
-class DrawerView extends EventEmitter {
-  destroyed: boolean = false;
-  _driver: DrawerViewDriver;
-  constructor(drawerViewDriver: DrawerViewDriver) {
+class DrawerView extends _safeEventEmitter.default {
+  constructor(drawerViewDriver) {
     super();
+    (0, _defineProperty2.default)(this, "destroyed", false);
     this._driver = drawerViewDriver;
     this._driver.getSlideAnimationDone().onValue(() => {
       this.emit('slideAnimationDone');
@@ -25,37 +27,28 @@ class DrawerView extends EventEmitter {
       this.destroyed = true;
       this.emit('destroy');
     });
-    this._driver.getPreAutoCloseStream().onValue((event) => {
+    this._driver.getPreAutoCloseStream().onValue(event => {
       this.emit('preautoclose', event);
     });
-
-    document.dispatchEvent(
-      new CustomEvent('inboxSDKcloseDrawers', {
-        bubbles: false,
-        cancelable: false,
-        detail: null,
-      })
-    );
-    Kefir.fromEvents(document, 'inboxSDKcloseDrawers')
-      .takeUntilBy(Kefir.fromEvents(this, 'closing'))
-      .onValue(() => {
-        this.close();
-      });
+    document.dispatchEvent(new CustomEvent('inboxSDKcloseDrawers', {
+      bubbles: false,
+      cancelable: false,
+      detail: null
+    }));
+    _kefir.default.fromEvents(document, 'inboxSDKcloseDrawers').takeUntilBy(_kefir.default.fromEvents(this, 'closing')).onValue(() => {
+      this.close();
+    });
   }
-
   close() {
     this._driver.close();
   }
-
-  associateComposeView(composeView: ComposeView, closeWithCompose: boolean) {
-    if (!(composeView instanceof ComposeView))
-      throw new Error('argument was not a ComposeView');
+  associateComposeView(composeView, closeWithCompose) {
+    if (!(composeView instanceof _composeView.default)) throw new Error('argument was not a ComposeView');
     this._driver.associateComposeView(composeView, closeWithCompose);
   }
-
   disassociateComposeView() {
     this._driver.disassociateComposeView();
   }
 }
-
-export default defn(module, DrawerView);
+var _default = (0, _ud.defn)(module, DrawerView);
+exports.default = _default;

package/src/platform-implementation-js/widgets/modal-view.js

@@ -1,32 +1,25 @@
-/* @flow */
-
-import Kefir from 'kefir';
-import kefirBus from 'kefir-bus';
-import type { Bus } from 'kefir-bus';
-import { defn } from 'ud';
-import EventEmitter from '../lib/safe-event-emitter';
-
-import type { Backdrop, Driver } from '../driver-interfaces/driver';
-import type GmailModalViewDriver from '../dom-driver/gmail/widgets/gmail-modal-view-driver';
-import type InboxModalView from '../dom-driver/inbox/views/inbox-modal-view';
-
-type ModalViewDriver = GmailModalViewDriver | InboxModalView;
-
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _kefir = _interopRequireDefault(require("kefir"));
+var _kefirBus = _interopRequireDefault(require("kefir-bus"));
+var _ud = require("ud");
+var _safeEventEmitter = _interopRequireDefault(require("../lib/safe-event-emitter"));
 // documented in src/docs/
-class ModalView extends EventEmitter {
-  destroyed: boolean = false;
-  _driver: Driver;
-  _modalViewDriver: ?ModalViewDriver;
-  constructor(options: { driver: Driver, modalViewDriver: ModalViewDriver }) {
+class ModalView extends _safeEventEmitter.default {
+  constructor(options) {
     super();
+    (0, _defineProperty2.default)(this, "destroyed", false);
     this._driver = options.driver;
     this._modalViewDriver = options.modalViewDriver;
-    options.modalViewDriver
-      .getEventStream()
-      .filter((event) => event.eventName === 'closeClick')
-      .onValue(() => {
-        this.close();
-      });
+    options.modalViewDriver.getEventStream().filter(event => event.eventName === 'closeClick').onValue(() => {
+      this.close();
+    });
     options.modalViewDriver.getEventStream().onEnd(() => {
       this._modalViewDriver = null;
       this.destroyed = true;
@@ -34,64 +27,41 @@ class ModalView extends EventEmitter {
       this.emit('destroy');
     });
   }
-
   show() {
     const modalViewDriver = this._modalViewDriver;
     if (!modalViewDriver) {
       throw new Error('Modal can not be shown after being hidden');
     }
-
-    const hideAndDestroyStream = Kefir.merge([
-      Kefir.fromEvents(this, 'destroy'),
-      hideStream.filter((modalView) => modalView === this),
-    ]);
-
-    ((document.body: any): HTMLElement).appendChild(
-      modalViewDriver.getModalContainerElement()
-    );
-
+    const hideAndDestroyStream = _kefir.default.merge([_kefir.default.fromEvents(this, 'destroy'), hideStream.filter(modalView => modalView === this)]);
+    document.body.appendChild(modalViewDriver.getModalContainerElement());
     modalViewDriver.getModalContainerElement().focus();
-
-    Kefir.fromEvents((document.body: any), 'keydown')
-      .filter((domEvent) => domEvent.keyCode === 27)
-      .takeUntilBy(hideAndDestroyStream)
-      .onValue((domEvent) => {
-        domEvent.stopImmediatePropagation();
-        domEvent.stopPropagation();
-        domEvent.preventDefault();
-        this.close();
-      });
-
+    _kefir.default.fromEvents(document.body, 'keydown').filter(domEvent => domEvent.keyCode === 27).takeUntilBy(hideAndDestroyStream).onValue(domEvent => {
+      domEvent.stopImmediatePropagation();
+      domEvent.stopPropagation();
+      domEvent.preventDefault();
+      this.close();
+    });
     _replaceCurrentlyShowingModal(this, modalViewDriver);
   }
-
-  setTitle(title: string) {
+  setTitle(title) {
     if (!this._modalViewDriver) {
       throw new Error('Modal can not be shown after being hidden');
     }
-
     this._modalViewDriver.setTitle(title);
   }
-
   close() {
     if (this._modalViewDriver) {
       this._modalViewDriver.destroy();
     }
   }
-
-  addButton(options: any): void {
+  addButton(options) {
     throw new Error('not implemented');
   }
 }
-
-let activeBackdrop: ?Backdrop = null;
-let currentlyShowingModal: ?{
-  modalView: ModalView,
-  modalViewDriver: ModalViewDriver,
-} = null;
-const hideStream: Bus<ModalView> = kefirBus();
-const hiddenModalStack: Array<ModalView> = [];
-
+let activeBackdrop = null;
+let currentlyShowingModal = null;
+const hideStream = (0, _kefirBus.default)();
+const hiddenModalStack = [];
 function _handleModalStackOnModalDestroy(modalView) {
   if (currentlyShowingModal && currentlyShowingModal.modalView === modalView) {
     currentlyShowingModal = null;
@@ -107,7 +77,6 @@ function _handleModalStackOnModalDestroy(modalView) {
     hiddenModalStack.splice(hiddenModalStack.indexOf(modalView), 1);
   }
 }
-
 function _replaceCurrentlyShowingModal(modalView, modalViewDriver) {
   if (currentlyShowingModal) {
     hideStream.emit(currentlyShowingModal.modalView);
@@ -118,7 +87,7 @@ function _replaceCurrentlyShowingModal(modalView, modalViewDriver) {
       activeBackdrop = modalView._driver.createBackdrop(502);
       activeBackdrop.getStopper().onValue(() => {
         activeBackdrop = null;
-        hiddenModalStack.slice().forEach((modalView) => {
+        hiddenModalStack.slice().forEach(modalView => {
           modalView.close();
         });
         if (currentlyShowingModal) {
@@ -127,8 +96,10 @@ function _replaceCurrentlyShowingModal(modalView, modalViewDriver) {
       });
     }
   }
-
-  currentlyShowingModal = { modalView, modalViewDriver };
+  currentlyShowingModal = {
+    modalView,
+    modalViewDriver
+  };
 }
-
-export default defn(module, ModalView);
+var _default = (0, _ud.defn)(module, ModalView);
+exports.default = _default;

package/src/platform-implementation-js/widgets/mole-view.js

@@ -1,22 +1,25 @@
-/* @flow */
-
-import get from '../../common/get-or-fail';
-import EventEmitter from '../lib/safe-event-emitter';
-
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _getOrFail = _interopRequireDefault(require("../../common/get-or-fail"));
+var _safeEventEmitter = _interopRequireDefault(require("../lib/safe-event-emitter"));
 const memberMap = new WeakMap();
 
 // documented in src/docs/
-export default class MoleView extends EventEmitter {
-  destroyed: boolean = false;
-
-  constructor(options: { moleViewDriver: Object }) {
+class MoleView extends _safeEventEmitter.default {
+  constructor(options) {
     super();
+    (0, _defineProperty2.default)(this, "destroyed", false);
     const members = {
-      driver: options.moleViewDriver,
+      driver: options.moleViewDriver
     };
     memberMap.set(this, members);
-
-    members.driver.getEventStream().onValue((e) => {
+    members.driver.getEventStream().onValue(e => {
       this.emit(e.eventName, e.detail);
     });
     members.driver.getEventStream().onEnd(() => {
@@ -24,24 +27,21 @@ export default class MoleView extends EventEmitter {
       this.emit('destroy');
     });
   }
-
   close() {
-    const members = get(memberMap, this);
+    const members = (0, _getOrFail.default)(memberMap, this);
     members.driver.destroy();
   }
-
-  setTitle(text: string) {
-    const members = get(memberMap, this);
+  setTitle(text) {
+    const members = (0, _getOrFail.default)(memberMap, this);
     members.driver.setTitle(text);
   }
-
-  setMinimized(minimized: boolean) {
-    const members = get(memberMap, this);
+  setMinimized(minimized) {
+    const members = (0, _getOrFail.default)(memberMap, this);
     members.driver.setMinimized(minimized);
   }
-
   getMinimized() {
-    const members = get(memberMap, this);
+    const members = (0, _getOrFail.default)(memberMap, this);
     return members.driver.getMinimized();
   }
 }
+exports.default = MoleView;

package/src/platform-implementation-js/widgets/top-message-bar-view.js

@@ -1,20 +1,23 @@
-/* @flow */
-
-import get from '../../common/get-or-fail';
-import EventEmitter from '../lib/safe-event-emitter';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _getOrFail = _interopRequireDefault(require("../../common/get-or-fail"));
+var _safeEventEmitter = _interopRequireDefault(require("../lib/safe-event-emitter"));
 const memberMap = new WeakMap();
-
-export default class TopMessageBarView extends EventEmitter {
-  constructor(options: { topMessageBarViewDriver: Object }) {
+class TopMessageBarView extends _safeEventEmitter.default {
+  constructor(options) {
     super();
     const members = {
-      driver: options.topMessageBarViewDriver,
+      driver: options.topMessageBarViewDriver
     };
     memberMap.set(this, members);
   }
-
   remove() {
-    get(memberMap, this).driver.remove();
+    (0, _getOrFail.default)(memberMap, this).driver.remove();
   }
 }
+exports.default = TopMessageBarView;