@inboxsdk/core 1.1.5 → 1.1.7

package/src/platform-implementation-js/dom-driver/gmail/views/native-gmail-nav-item-view.d.ts

@@ -1,9 +1,37 @@
-import GmailDriver from '../gmail-driver';
-
+import * as Kefir from 'kefir';
+import type { Bus } from 'kefir-bus';
+import GmailNavItemView from './gmail-nav-item-view';
+import type GmailDriver from '../gmail-driver';
 export default class NativeGmailNavItemView {
-  constructor(
-    gmailDriver: GmailDriver,
-    labelElement: HTMLElement,
-    label: string
-  );
+    _driver: GmailDriver;
+    _element: HTMLElement;
+    _navItemName: string;
+    _activeMarkerElement: HTMLElement | null | undefined;
+    _eventStream: Bus<any, unknown>;
+    _elementBus: Bus<HTMLElement, unknown>;
+    _elementStream: Kefir.Observable<HTMLElement, unknown>;
+    _isActive: boolean;
+    _itemContainerElement: HTMLElement | null | undefined;
+    constructor(driver: GmailDriver, nativeElement: HTMLElement, navItemName: string);
+    destroy(): void;
+    getElement(): HTMLElement;
+    getEventStream(): Bus<any, unknown>;
+    addNavItem(orderGroup: number, navItemDescriptor: Kefir.Observable<any, any>): GmailNavItemView;
+    setActive(value: boolean): void;
+    toggleCollapse(): void;
+    setCollapsed(value: string): void;
+    remove(): void;
+    _monitorElementForActiveChanges(): void;
+    _addNavItemElement(gmailNavItemView: GmailNavItemView): void;
+    _getItemContainerElement(): HTMLElement;
+    _createItemContainerElement(): HTMLElement;
+    _createExpando(): void;
+    _toggleCollapse(): void;
+    _collapse(): void;
+    _expand(): void;
+    _isExpanded(): boolean;
+    _setHeights(): void;
+    _createActiveMarkerElement(): void;
+    _removeActiveMarkerElement(): void;
 }
+//# sourceMappingURL=native-gmail-nav-item-view.d.ts.map

package/src/platform-implementation-js/dom-driver/gmail/views/native-gmail-nav-item-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-gmail-nav-item-view.d.ts","sourceRoot":"","sources":["../../../../../../../src/platform-implementation-js/dom-driver/gmail/views/native-gmail-nav-item-view.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAOrC,OAAO,gBAEN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,WAAW,MAAM,iBAAiB,CAAC;AAC/C,MAAM,CAAC,OAAO,OAAO,sBAAsB;IACzC,OAAO,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,oBAAoB,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,CAAQ;IAC5D,YAAY,EAAE,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;IAChC,WAAW,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;IACvC,cAAc,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;IACvD,SAAS,EAAE,OAAO,CAAS;IAC3B,qBAAqB,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,CAAQ;gBAG3D,MAAM,EAAE,WAAW,EACnB,aAAa,EAAE,WAAW,EAC1B,WAAW,EAAE,MAAM;IAmDrB,OAAO;IAWP,UAAU,IAAI,WAAW;IAIzB,cAAc;IAId,UAAU,CACR,UAAU,EAAE,MAAM,EAClB,iBAAiB,EAAE,KAAK,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,GAC5C,gBAAgB;IAYnB,SAAS,CAAC,KAAK,EAAE,OAAO;IAmBxB,cAAc;IAId,YAAY,CAAC,KAAK,EAAE,MAAM;IAc1B,MAAM;IAIN,+BAA+B;IAmB/B,kBAAkB,CAAC,gBAAgB,EAAE,gBAAgB;IAmBrD,wBAAwB,IAAI,WAAW;IAmBvC,2BAA2B,IAAI,WAAW;IAU1C,cAAc;IAwCd,eAAe;IA0Bf,SAAS;IAkBT,OAAO;IAkBP,WAAW,IAAI,OAAO;IAItB,WAAW;IAiBX,0BAA0B;IAe1B,0BAA0B;CAQ3B"}

package/src/platform-implementation-js/dom-driver/gmail/views/native-gmail-nav-item-view.js

@@ -1,236 +1,266 @@
-"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 _getInsertBeforeElement = _interopRequireDefault(require("../../../lib/dom/get-insert-before-element"));
-var _makeMutationObserverChunkedStream = _interopRequireDefault(require("../../../lib/dom/make-mutation-observer-chunked-stream"));
-var _makeMutationObserverStream = _interopRequireDefault(require("../../../lib/dom/make-mutation-observer-stream"));
-var _querySelectorOrFail = _interopRequireDefault(require("../../../lib/dom/querySelectorOrFail"));
-var _findParent = _interopRequireDefault(require("../../../../common/find-parent"));
-var _gmailElementGetter = _interopRequireDefault(require("../gmail-element-getter"));
-var _gmailNavItemView = _interopRequireWildcard(require("./gmail-nav-item-view"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-class NativeGmailNavItemView {
-  constructor(driver, nativeElement, navItemName) {
-    (0, _defineProperty2.default)(this, "_activeMarkerElement", null);
-    (0, _defineProperty2.default)(this, "_isActive", false);
-    (0, _defineProperty2.default)(this, "_itemContainerElement", null);
-    this._driver = driver;
-    this._element = nativeElement;
-    this._eventStream = (0, _kefirBus.default)();
-    this._elementBus = (0, _kefirBus.default)();
-    this._elementStream = this._elementBus.toProperty(() => this._element);
-    this._navItemName = navItemName;
-
-    // gmail v2 continually replaces the native nav elements
-    // so we have to monitor for this replacement and then
-    // readd any sub nav items
-    const parentElement = this._element.parentElement;
-    if (parentElement) {
-      (0, _makeMutationObserverChunkedStream.default)(parentElement, {
-        childList: true
-      }).map(() => parentElement.querySelector(`.aim a[href*="#${this._navItemName}"]`)).filter(Boolean).map(link => (0, _findParent.default)(link, el => el.classList.contains('aim'))).filter(Boolean).filter(newElement => newElement !== this._element).onValue(newElement => {
-        if (newElement) {
-          const currentContainerElement = this._itemContainerElement;
-          if (currentContainerElement) {
-            //if we have an existing container then remove it
-            //so a new one can be created and get things back into a good state
-            currentContainerElement.remove();
-            this._itemContainerElement = null;
-          }
-          this._elementBus.emit(newElement);
-        }
-      });
-    }
-    this._elementStream.onValue(element => {
-      this._element = element;
-      this._monitorElementForActiveChanges();
-      this.setActive(this._isActive);
-    });
-  }
-  destroy() {
-    this._element.classList.remove('inboxsdk__navItem_claimed');
-    this._eventStream.end();
-    this._elementBus.end();
-    if (this._activeMarkerElement) this._activeMarkerElement.remove();
-    if (this._itemContainerElement) this._itemContainerElement.remove();
-  }
-  getElement() {
-    return this._element;
-  }
-  getEventStream() {
-    return this._eventStream;
-  }
-  addNavItem(orderGroup, navItemDescriptor) {
-    const gmailNavItemView = new _gmailNavItemView.default(this._driver, orderGroup, 2);
-    _kefir.default.merge([gmailNavItemView.getEventStream().filter(event => event.eventName === 'orderChanged'), this._elementStream]).onValue(() => this._addNavItemElement(gmailNavItemView));
-    gmailNavItemView.setNavItemDescriptor(navItemDescriptor);
-    return gmailNavItemView;
-  }
-  setActive(value) {
-    this._isActive = value;
-    const toElement = (0, _querySelectorOrFail.default)(this._element, '.TO');
-    if (value) {
-      this._element.classList.add('ain');
-      toElement.classList.add('nZ');
-      toElement.classList.add('aiq');
-    } else {
-      this._element.classList.remove('ain');
-      toElement.classList.remove('nZ');
-      toElement.classList.remove('aiq');
-    }
-    this._setHeights();
-  }
-  toggleCollapse() {
-    this._toggleCollapse();
-  }
-  setCollapsed(value) {
-    localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] = value;
-    if (!this._element.querySelector('.inboxsdk__expando')) {
-      return;
-    }
-    if (value) {
-      this._collapse();
-    } else {
-      this._expand();
-    }
-  }
-  remove() {
-    /* do nothing */
-  }
-  _monitorElementForActiveChanges() {
-    this._element.classList.add('inboxsdk__navItem_claimed');
-    const element = this._element;
-    const classChangeStream = (0, _makeMutationObserverChunkedStream.default)(element, {
-      attributes: true,
-      attributeFilter: ['class']
-    }).takeUntilBy(this._eventStream.filter(() => false).beforeEnd(() => null)).toProperty(() => []).map(() => element);
-    classChangeStream.filter(el => el.classList.contains('ain')).onValue(() => this._createActiveMarkerElement());
-    classChangeStream.filter(el => !el.classList.contains('ain')).onValue(() => this._removeActiveMarkerElement());
-  }
-  _addNavItemElement(gmailNavItemView) {
-    const itemContainerElement = this._getItemContainerElement();
-    const insertBeforeElement = (0, _getInsertBeforeElement.default)(gmailNavItemView.getElement(), itemContainerElement.children, ['data-group-order-hint', 'data-order-hint', 'data-insertion-order-hint']);
-    itemContainerElement.insertBefore(gmailNavItemView.getElement(), insertBeforeElement);
-    const element = gmailNavItemView.getElement();
-    (0, _querySelectorOrFail.default)(element, '.TN').style.marginLeft = (0, _gmailNavItemView.getLeftIndentationPaddingValue)() + 'px';
-    this._setHeights();
-  }
-  _getItemContainerElement() {
-    let itemContainerElement = this._itemContainerElement;
-    if (!itemContainerElement) {
-      itemContainerElement = this._itemContainerElement = this._element.querySelector('.inboxsdk__navItem_container');
-      if (!itemContainerElement) {
-        itemContainerElement = this._createItemContainerElement();
-        this._createExpando();
-      }
-    }
-    return itemContainerElement;
-  }
-  _createItemContainerElement() {
-    const itemContainerElement = this._itemContainerElement = document.createElement('div');
-    itemContainerElement.classList.add('inboxsdk__navItem_container');
-    this._element.appendChild(itemContainerElement);
-    return itemContainerElement;
-  }
-  _createExpando() {
-    const link = this._element.querySelector('a');
-    const expandoElement = document.createElement('div');
-    expandoElement.setAttribute('class', 'TH aih J-J5-Ji inboxsdk__expando');
-    expandoElement.setAttribute('role', 'link');
-    expandoElement.title = `Expand ${link ? link.title || link.textContent : ''}`;
-    expandoElement.addEventListener('click', e => {
-      this._toggleCollapse();
-      e.stopPropagation();
-      e.preventDefault();
-      e.stopImmediatePropagation();
-    }, true);
-    const insertionPoint = this._element.querySelector('.TN');
-    if (insertionPoint) {
-      insertionPoint.insertAdjacentElement('afterbegin', expandoElement);
-    }
-    if (localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] === 'collapsed') {
-      this._collapse();
-    } else {
-      this._expand();
-    }
-  }
-  _toggleCollapse() {
-    if (!this._element.querySelector('.inboxsdk__expando')) {
-      if (localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] === 'collapsed') {
-        localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] = 'expanded';
-      } else {
-        localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] = 'collapsed';
-      }
-      return;
-    }
-    if (localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] === 'collapsed') {
-      this._expand();
-    } else {
-      this._collapse();
-    }
-  }
-  _collapse() {
-    const expandoElement = (0, _querySelectorOrFail.default)(this._element, '.inboxsdk__expando');
-    expandoElement.classList.remove('aih');
-    expandoElement.classList.add('aii');
-    if (this._itemContainerElement) this._itemContainerElement.style.display = 'none';
-    localStorage.setItem('inboxsdk__nativeNavItem__state_' + this._navItemName, 'collapsed');
-    this._eventStream.emit({
-      eventName: 'collapsed'
-    });
-    this._setHeights();
-  }
-  _expand() {
-    const expandoElement = (0, _querySelectorOrFail.default)(this._element, '.inboxsdk__expando');
-    expandoElement.classList.add('aih');
-    expandoElement.classList.remove('aii');
-    if (this._itemContainerElement) this._itemContainerElement.style.display = '';
-    localStorage.setItem('inboxsdk__nativeNavItem__state_' + this._navItemName, 'expanded');
-    this._eventStream.emit({
-      eventName: 'expanded'
-    });
-    this._setHeights();
-  }
-  _isExpanded() {
-    return !!this._element.querySelector('.inboxsdk__expando.aih');
-  }
-  _setHeights() {
-    const toElement = (0, _querySelectorOrFail.default)(this._element, '.TO');
-    if (this._element.classList.contains('ain') && this._itemContainerElement) {
-      this._element.style.height = '';
-      const totalHeight = this._element.clientHeight;
-      const itemHeight = toElement.clientHeight;
-      this._element.style.height = itemHeight + 'px';
-      this._element.style.overflow = 'visible';
-      this._element.style.marginBottom = totalHeight - itemHeight + 'px';
-    } else {
-      this._element.style.height = '';
-      this._element.style.overflow = '';
-      this._element.style.marginBottom = '';
-    }
-  }
-  _createActiveMarkerElement() {
-    this._removeActiveMarkerElement();
-    const activeMarkerElement = this._activeMarkerElement = document.createElement('div');
-    activeMarkerElement.classList.add('inboxsdk__navItem_marker');
-    activeMarkerElement.classList.add('ain');
-    activeMarkerElement.innerHTML = ' ';
-    this._element.insertBefore(activeMarkerElement, this._element.firstElementChild);
-  }
-  _removeActiveMarkerElement() {
-    const activeMarkerElement = this._activeMarkerElement;
-    if (activeMarkerElement) {
-      activeMarkerElement.remove();
-      this._activeMarkerElement = null;
-    }
-  }
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import * as Kefir from 'kefir';
+import kefirBus from 'kefir-bus';
+import getInsertBeforeElement from '../../../lib/dom/get-insert-before-element';
+import makeMutationObserverChunkedStream from '../../../lib/dom/make-mutation-observer-chunked-stream';
+import querySelector from '../../../lib/dom/querySelectorOrFail';
+import findParent from '../../../../common/find-parent';
+import GmailNavItemView, { getLeftIndentationPaddingValue, } from './gmail-nav-item-view';
+export default class NativeGmailNavItemView {
+    _driver;
+    _element;
+    _navItemName;
+    _activeMarkerElement = null;
+    _eventStream;
+    _elementBus;
+    _elementStream;
+    _isActive = false;
+    _itemContainerElement = null;
+    constructor(driver, nativeElement, navItemName) {
+        this._driver = driver;
+        this._element = nativeElement;
+        this._eventStream = kefirBus();
+        this._elementBus = kefirBus();
+        this._elementStream = this._elementBus.toProperty(() => this._element);
+        this._navItemName = navItemName;
+        // gmail v2 continually replaces the native nav elements
+        // so we have to monitor for this replacement and then
+        // readd any sub nav items
+        const parentElement = this._element.parentElement;
+        if (parentElement) {
+            makeMutationObserverChunkedStream(parentElement, {
+                childList: true,
+            })
+                .map(() => parentElement.querySelector(`.aim a[href*="#${this._navItemName}"]`))
+                .filter(Boolean)
+                .map((link) => findParent(link, (el) => el.classList.contains('aim')))
+                .filter(Boolean)
+                .filter((newElement) => newElement !== this._element)
+                .onValue((newElement) => {
+                if (newElement) {
+                    const currentContainerElement = this._itemContainerElement;
+                    if (currentContainerElement) {
+                        //if we have an existing container then remove it
+                        //so a new one can be created and get things back into a good state
+                        currentContainerElement.remove();
+                        this._itemContainerElement = null;
+                    }
+                    this._elementBus.emit(newElement);
+                }
+            });
+        }
+        this._elementStream.onValue((element) => {
+            this._element = element;
+            this._monitorElementForActiveChanges();
+            this.setActive(this._isActive);
+        });
+    }
+    destroy() {
+        this._element.classList.remove('inboxsdk__navItem_claimed');
+        this._eventStream.end();
+        this._elementBus.end();
+        if (this._activeMarkerElement)
+            this._activeMarkerElement.remove();
+        if (this._itemContainerElement)
+            this._itemContainerElement.remove();
+    }
+    getElement() {
+        return this._element;
+    }
+    getEventStream() {
+        return this._eventStream;
+    }
+    addNavItem(orderGroup, navItemDescriptor) {
+        const gmailNavItemView = new GmailNavItemView(this._driver, orderGroup, 2);
+        Kefir.merge([
+            gmailNavItemView
+                .getEventStream()
+                .filter((event) => event.eventName === 'orderChanged'),
+            this._elementStream,
+        ]).onValue(() => this._addNavItemElement(gmailNavItemView));
+        gmailNavItemView.setNavItemDescriptor(navItemDescriptor);
+        return gmailNavItemView;
+    }
+    setActive(value) {
+        this._isActive = value;
+        const toElement = querySelector(this._element, '.TO');
+        if (value) {
+            this._element.classList.add('ain');
+            toElement.classList.add('nZ');
+            toElement.classList.add('aiq');
+        }
+        else {
+            this._element.classList.remove('ain');
+            toElement.classList.remove('nZ');
+            toElement.classList.remove('aiq');
+        }
+        this._setHeights();
+    }
+    toggleCollapse() {
+        this._toggleCollapse();
+    }
+    setCollapsed(value) {
+        localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] = value;
+        if (!this._element.querySelector('.inboxsdk__expando')) {
+            return;
+        }
+        if (value) {
+            this._collapse();
+        }
+        else {
+            this._expand();
+        }
+    }
+    remove() {
+        /* do nothing */
+    }
+    _monitorElementForActiveChanges() {
+        this._element.classList.add('inboxsdk__navItem_claimed');
+        const element = this._element;
+        const classChangeStream = makeMutationObserverChunkedStream(element, {
+            attributes: true,
+            attributeFilter: ['class'],
+        })
+            .takeUntilBy(this._eventStream.filter(() => false).beforeEnd(() => null))
+            .toProperty(() => [])
+            .map(() => element);
+        classChangeStream
+            .filter((el) => el.classList.contains('ain'))
+            .onValue(() => this._createActiveMarkerElement());
+        classChangeStream
+            .filter((el) => !el.classList.contains('ain'))
+            .onValue(() => this._removeActiveMarkerElement());
+    }
+    _addNavItemElement(gmailNavItemView) {
+        const itemContainerElement = this._getItemContainerElement();
+        const insertBeforeElement = getInsertBeforeElement(gmailNavItemView.getElement(), itemContainerElement.children, ['data-group-order-hint', 'data-order-hint', 'data-insertion-order-hint']);
+        itemContainerElement.insertBefore(gmailNavItemView.getElement(), insertBeforeElement);
+        const element = gmailNavItemView.getElement();
+        querySelector(element, '.TN').style.marginLeft =
+            getLeftIndentationPaddingValue() + 'px';
+        this._setHeights();
+    }
+    _getItemContainerElement() {
+        let itemContainerElement = this._itemContainerElement;
+        if (!itemContainerElement) {
+            itemContainerElement = this._itemContainerElement =
+                this._element.querySelector('.inboxsdk__navItem_container');
+            if (!itemContainerElement) {
+                itemContainerElement = this._createItemContainerElement();
+                this._createExpando();
+            }
+        }
+        return itemContainerElement;
+    }
+    _createItemContainerElement() {
+        const itemContainerElement = (this._itemContainerElement =
+            document.createElement('div'));
+        itemContainerElement.classList.add('inboxsdk__navItem_container');
+        this._element.appendChild(itemContainerElement);
+        return itemContainerElement;
+    }
+    _createExpando() {
+        const link = this._element.querySelector('a');
+        const expandoElement = document.createElement('div');
+        expandoElement.setAttribute('class', 'TH aih J-J5-Ji inboxsdk__expando');
+        expandoElement.setAttribute('role', 'link');
+        expandoElement.title = `Expand ${link ? link.title || link.textContent : ''}`;
+        expandoElement.addEventListener('click', (e) => {
+            this._toggleCollapse();
+            e.stopPropagation();
+            e.preventDefault();
+            e.stopImmediatePropagation();
+        }, true);
+        const insertionPoint = this._element.querySelector('.TN');
+        if (insertionPoint) {
+            insertionPoint.insertAdjacentElement('afterbegin', expandoElement);
+        }
+        if (localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] ===
+            'collapsed') {
+            this._collapse();
+        }
+        else {
+            this._expand();
+        }
+    }
+    _toggleCollapse() {
+        if (!this._element.querySelector('.inboxsdk__expando')) {
+            if (localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] ===
+                'collapsed') {
+                localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] =
+                    'expanded';
+            }
+            else {
+                localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] =
+                    'collapsed';
+            }
+            return;
+        }
+        if (localStorage['inboxsdk__nativeNavItem__state_' + this._navItemName] ===
+            'collapsed') {
+            this._expand();
+        }
+        else {
+            this._collapse();
+        }
+    }
+    _collapse() {
+        const expandoElement = querySelector(this._element, '.inboxsdk__expando');
+        expandoElement.classList.remove('aih');
+        expandoElement.classList.add('aii');
+        if (this._itemContainerElement)
+            this._itemContainerElement.style.display = 'none';
+        localStorage.setItem('inboxsdk__nativeNavItem__state_' + this._navItemName, 'collapsed');
+        this._eventStream.emit({
+            eventName: 'collapsed',
+        });
+        this._setHeights();
+    }
+    _expand() {
+        const expandoElement = querySelector(this._element, '.inboxsdk__expando');
+        expandoElement.classList.add('aih');
+        expandoElement.classList.remove('aii');
+        if (this._itemContainerElement)
+            this._itemContainerElement.style.display = '';
+        localStorage.setItem('inboxsdk__nativeNavItem__state_' + this._navItemName, 'expanded');
+        this._eventStream.emit({
+            eventName: 'expanded',
+        });
+        this._setHeights();
+    }
+    _isExpanded() {
+        return !!this._element.querySelector('.inboxsdk__expando.aih');
+    }
+    _setHeights() {
+        const toElement = querySelector(this._element, '.TO');
+        if (this._element.classList.contains('ain') && this._itemContainerElement) {
+            this._element.style.height = '';
+            const totalHeight = this._element.clientHeight;
+            const itemHeight = toElement.clientHeight;
+            this._element.style.height = itemHeight + 'px';
+            this._element.style.overflow = 'visible';
+            this._element.style.marginBottom = totalHeight - itemHeight + 'px';
+        }
+        else {
+            this._element.style.height = '';
+            this._element.style.overflow = '';
+            this._element.style.marginBottom = '';
+        }
+    }
+    _createActiveMarkerElement() {
+        this._removeActiveMarkerElement();
+        const activeMarkerElement = (this._activeMarkerElement =
+            document.createElement('div'));
+        activeMarkerElement.classList.add('inboxsdk__navItem_marker');
+        activeMarkerElement.classList.add('ain');
+        activeMarkerElement.innerHTML = ' ';
+        this._element.insertBefore(activeMarkerElement, this._element.firstElementChild);
+    }
+    _removeActiveMarkerElement() {
+        const activeMarkerElement = this._activeMarkerElement;
+        if (activeMarkerElement) {
+            activeMarkerElement.remove();
+            this._activeMarkerElement = null;
+        }
+    }
 }
-exports.default = NativeGmailNavItemView;

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-accessory-button-view.d.ts

@@ -5,6 +5,8 @@ export default class CreateAccessoryButtonView implements ButtonViewI {
     private _eventStream;
     private _stopper;
     constructor();
+    addClass(className: string): void;
+    removeClass(className: string): void;
     update(): void;
     setEnabled(): void;
     destroy(): void;

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-accessory-button-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-accessory-button-view.d.ts","sourceRoot":"","sources":["../../../../../../../../src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-accessory-button-view.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,WAAW,EAAE,MAAM,0DAA0D,CAAC;AAEvF,MAAM,CAAC,OAAO,OAAO,yBAA0B,YAAW,WAAW;IACnE,OAAO,CAAC,QAAQ,CAA8C;IAC9D,OAAO,CAAC,YAAY,CAAwB;IAC5C,OAAO,CAAC,QAAQ,CAAkB;;IAOlC,MAAM;IAIN,UAAU;IAIV,OAAO;IAMP,UAAU,IAAI,WAAW;IAIzB,cAAc,IAAI,KAAK,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC;IAI5C,QAAQ;IAKR,UAAU;IAKV,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,iBAAiB;CAe1B"}
+{"version":3,"file":"create-accessory-button-view.d.ts","sourceRoot":"","sources":["../../../../../../../../src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-accessory-button-view.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,WAAW,EAAE,MAAM,0DAA0D,CAAC;AAEvF,MAAM,CAAC,OAAO,OAAO,yBAA0B,YAAW,WAAW;IACnE,OAAO,CAAC,QAAQ,CAA8C;IAC9D,OAAO,CAAC,YAAY,CAAwB;IAC5C,OAAO,CAAC,QAAQ,CAAkB;;IAMlC,QAAQ,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IACjC,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IAEpC,MAAM;IAIN,UAAU;IAIV,OAAO;IAMP,UAAU,IAAI,WAAW;IAIzB,cAAc,IAAI,KAAK,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC;IAI5C,QAAQ;IAKR,UAAU;IAKV,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,iBAAiB;CAe1B"}

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-accessory-button-view.js

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import * as Kefir from 'kefir';
 import kefirBus from 'kefir-bus';
 import kefirStopper from 'kefir-stopper';
@@ -9,6 +11,8 @@ export default class CreateAccessoryButtonView {
         this._setupElement();
         this._setupEventStream();
     }
+    addClass(className) { }
+    removeClass(className) { }
     update() {
         // noop
     }

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-parent-accessory-button-view.d.ts

@@ -5,6 +5,8 @@ export default class CreateParentAccessoryButtonView implements ButtonViewI {
     private _eventStream;
     private _stopper;
     constructor();
+    addClass(className: string): void;
+    removeClass(className: string): void;
     activate(): void;
     deactivate(): void;
     destroy(): void;

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-parent-accessory-button-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-parent-accessory-button-view.d.ts","sourceRoot":"","sources":["../../../../../../../../src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-parent-accessory-button-view.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,WAAW,EAAE,MAAM,0DAA0D,CAAC;AAEvF,MAAM,CAAC,OAAO,OAAO,+BAAgC,YAAW,WAAW;IACzE,OAAO,CAAC,QAAQ,CAA8C;IAC9D,OAAO,CAAC,YAAY,CAAwB;IAC5C,OAAO,CAAC,QAAQ,CAAkB;;IAOlC,QAAQ;IAOR,UAAU;IAOV,OAAO;IAMP,UAAU,IAAI,WAAW;IAIzB,cAAc,IAAI,KAAK,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC;IAI5C,UAAU;IAIV,MAAM;IAIN,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,iBAAiB;CAe1B"}
+{"version":3,"file":"create-parent-accessory-button-view.d.ts","sourceRoot":"","sources":["../../../../../../../../src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-parent-accessory-button-view.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,WAAW,EAAE,MAAM,0DAA0D,CAAC;AAEvF,MAAM,CAAC,OAAO,OAAO,+BAAgC,YAAW,WAAW;IACzE,OAAO,CAAC,QAAQ,CAA8C;IAC9D,OAAO,CAAC,YAAY,CAAwB;IAC5C,OAAO,CAAC,QAAQ,CAAkB;;IAMlC,QAAQ,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IACjC,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IAEpC,QAAQ;IAOR,UAAU;IAOV,OAAO;IAMP,UAAU,IAAI,WAAW;IAIzB,cAAc,IAAI,KAAK,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC;IAI5C,UAAU;IAIV,MAAM;IAIN,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,iBAAiB;CAe1B"}

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/create-parent-accessory-button-view.js

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import * as Kefir from 'kefir';
 import kefirBus from 'kefir-bus';
 import kefirStopper from 'kefir-stopper';
@@ -9,6 +11,8 @@ export default class CreateParentAccessoryButtonView {
         this._setupElement();
         this._setupEventStream();
     }
+    addClass(className) { }
+    removeClass(className) { }
     activate() {
         const innerButtonElement = this._element.firstElementChild;
         if (innerButtonElement) {