@inboxsdk/core 1.2.4 → 1.2.7

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

@@ -1,265 +0,0 @@
-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;
-        }
-    }
-}

package/src/platform-implementation-js/dom-driver/gmail/widgets/buttons/button-color-classes.js

@@ -1,33 +0,0 @@
-const ButtonColorClasses = {
-    default: {
-        INACTIVE_CLASS: 'T-I-ax7',
-        HOVER_CLASS: 'T-I-JW',
-        ACTIVE_CLASS: 'T-I-Kq',
-    },
-    flatIcon: {
-        INACTIVE_CLASS: 'J-Z-I',
-        HOVER_CLASS: 'J-Z-I-JW',
-        ACTIVE_CLASS: 'J-Z-I-KO',
-    },
-    pureIcon: {
-        INACTIVE_CLASS: 'inboxsdk__button_pureIcon_inactive',
-        HOVER_CLASS: 'inboxsdk__button_pureIcon_hover',
-        ACTIVE_CLASS: 'inboxsdk__button_pureIcon_active',
-    },
-    blue: {
-        INACTIVE_CLASS: 'T-I-atl',
-        HOVER_CLASS: 'T-I-JW',
-        ACTIVE_CLASS: 'T-I-JO',
-    },
-    red: {
-        INACTIVE_CLASS: 'T-I-KE',
-        HOVER_CLASS: 'T-I-JW',
-        ACTIVE_CLASS: 'T-I-JO',
-    },
-    green: {
-        INACTIVE_CLASS: 'inboxsdk__button_green_inactive',
-        HOVER_CLASS: 'inboxsdk__button_green_hover',
-        ACTIVE_CLASS: 'inboxsdk__button_green_active',
-    },
-};
-export default ButtonColorClasses;

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

@@ -1,325 +0,0 @@
-import includes from 'lodash/includes';
-import * as Kefir from 'kefir';
-import kefirBus from 'kefir-bus';
-import Logger from '../../../../lib/logger';
-import { simulateHover } from '../../../../lib/dom/simulate-mouse-event';
-import keyboardShortcutStream from '../../../../lib/dom/keyboard-shortcut-stream';
-import BUTTON_COLOR_CLASSES from './button-color-classes';
-export default class ButtonView {
-    _element = document.createElement('div');
-    _innerElement = document.createElement('div');
-    _textElement;
-    _iconElement;
-    _iconImgElement;
-    _iconClass;
-    _iconUrl;
-    _title;
-    _tooltip;
-    _hasDropdown;
-    _buttonColor;
-    _isEnabled;
-    _keyboardShortcutHandle;
-    _eventStream;
-    constructor(options) {
-        this._hasDropdown = false;
-        this._isEnabled = options.enabled !== false;
-        this._iconClass = options.iconClass;
-        this._iconUrl = options.iconUrl;
-        this._title = options.text || options.title;
-        this._tooltip = options.tooltip || options.title;
-        this._hasDropdown = !!options.hasDropdown;
-        this._buttonColor = options.buttonColor || 'default';
-        this._keyboardShortcutHandle = options.keyboardShortcutHandle;
-        this._createElement(options);
-        this._eventStream = kefirBus();
-        this._setupEventStream();
-        this._setupAestheticEvents();
-        if (options.enabled !== false) {
-            this._setupKeyboardShortcutEvent();
-        }
-    }
-    destroy() {
-        this._element.remove();
-        this._eventStream.end();
-    }
-    getElement() {
-        return this._element;
-    }
-    getEventStream() {
-        return this._eventStream;
-    }
-    activate() {
-        this.addClass(BUTTON_COLOR_CLASSES[this._buttonColor].ACTIVE_CLASS);
-        this.addClass(BUTTON_COLOR_CLASSES[this._buttonColor].HOVER_CLASS);
-    }
-    deactivate() {
-        this.removeClass(BUTTON_COLOR_CLASSES[this._buttonColor].ACTIVE_CLASS);
-        this.removeClass(BUTTON_COLOR_CLASSES[this._buttonColor].HOVER_CLASS);
-    }
-    addClass(className) {
-        this._element.classList.add(className);
-    }
-    removeClass(className) {
-        this._element.classList.remove(className);
-    }
-    simulateHover() {
-        simulateHover(this._element);
-    }
-    setEnabled(value) {
-        this._setEnabled(value);
-    }
-    isEnabled() {
-        return this._isEnabled;
-    }
-    update(options) {
-        if (!options) {
-            this._element.style.display = 'none';
-            return;
-        }
-        else if (this._element.style.display === 'none') {
-            this._element.style.display = '';
-        }
-        if (options.buttonColor != this._buttonColor && this._buttonColor) {
-            this._updateButtonColor(options.buttonColor);
-        }
-        if (options.title != this._title) {
-            this._updateTitle(options.title);
-        }
-        if (options.tooltip != this._tooltip) {
-            this._updateTooltip(options.tooltip);
-        }
-        if (options.iconUrl != this._iconUrl) {
-            this._updateIconUrl(options.iconUrl);
-        }
-        if (options.iconClass != this._iconClass) {
-            this._updateIconClass(options.iconClass);
-        }
-        if (options.enabled === false || options.enabled === true) {
-            this._setEnabled(options.enabled);
-        }
-    }
-    _createElement(options) {
-        this._setupMainElement(options);
-        this._setupInnerElement(options);
-        this._createTextElement();
-        this._createIconElement();
-    }
-    _setupMainElement(options) {
-        this._element.setAttribute('class', 'T-I J-J5-Ji ar7 inboxsdk__button ' +
-            BUTTON_COLOR_CLASSES[this._buttonColor].INACTIVE_CLASS);
-        if (options.tooltip) {
-            this._element.setAttribute('aria-label', options.tooltip);
-        }
-        this._element.setAttribute('role', 'button');
-        this._element.setAttribute('tabindex', '0');
-        if (options.hasButtonToRight) {
-            this._element.classList.add('T-I-Js-IF');
-        }
-        if (options.hasButtonToLeft) {
-            this._element.classList.add('T-I-Js-Gs');
-        }
-        if (options.tooltip || options.title) {
-            this._element.setAttribute('data-tooltip', String(options.tooltip || options.title));
-        }
-        if (options.enabled === false) {
-            this._element.classList.add('inboxsdk__button_disabled');
-        }
-    }
-    _setupInnerElement(options) {
-        this._innerElement.classList.add('asa');
-        if (this._hasDropdown && !options.noArrow) {
-            this._innerElement.innerHTML =
-                '<div class="G-asx T-I-J3 - J-J5-Ji">&nbsp;</div>';
-        }
-        this._element.appendChild(this._innerElement);
-    }
-    _createTextElement() {
-        if (!this._title) {
-            return;
-        }
-        this._textElement = document.createElement('span');
-        this._textElement.setAttribute('class', 'inboxsdk__button_text');
-        this._textElement.textContent = this._title;
-        if (this._iconElement) {
-            const parent = this._iconElement.parentElement;
-            if (!parent)
-                throw new Error('Could not find parent');
-            parent.insertBefore(this._textElement, this._iconElement.nextSibling);
-        }
-        else {
-            this._innerElement.insertBefore(this._textElement, this._innerElement.firstElementChild);
-        }
-    }
-    _createIconElement() {
-        if (!this._iconClass && !this._iconUrl) {
-            return;
-        }
-        const iconElement = (this._iconElement = document.createElement('div'));
-        iconElement.classList.add('inboxsdk__button_icon');
-        if (this._iconClass) {
-            iconElement.innerHTML = '&nbsp;';
-            iconElement.setAttribute('class', 'inboxsdk__button_icon ' + this._iconClass);
-        }
-        if (this._iconUrl) {
-            this._createIconImgElement();
-        }
-        this._innerElement.insertBefore(iconElement, this._innerElement.firstElementChild);
-    }
-    _createIconImgElement() {
-        if (!this._iconElement) {
-            this._createIconElement();
-        }
-        const iconElement = this._iconElement;
-        if (!iconElement)
-            throw new Error('Should not happen');
-        if (iconElement.innerHTML !== '') {
-            iconElement.innerHTML = '';
-        }
-        const iconImgElement = (this._iconImgElement =
-            document.createElement('img'));
-        iconImgElement.classList.add('inboxsdk__button_iconImg');
-        if (this._iconUrl) {
-            iconImgElement.src = this._iconUrl;
-        }
-        else {
-            Logger.error(new Error('_createIconImgElement should not be called with null _iconUrl'));
-        }
-        iconElement.appendChild(iconImgElement);
-    }
-    _updateButtonColor(newButtonColor) {
-        this._element.classList.remove(BUTTON_COLOR_CLASSES[this._buttonColor].INACTIVE_CLASS);
-        this._buttonColor = newButtonColor;
-        this._element.classList.add(BUTTON_COLOR_CLASSES[this._buttonColor].INACTIVE_CLASS);
-    }
-    _updateTitle(newTitle) {
-        if (!this._title && newTitle) {
-            this._title = newTitle;
-            this._createTextElement();
-        }
-        else if (this._title && !newTitle && this._textElement) {
-            this._textElement.remove();
-            this._textElement = undefined;
-            this._title = newTitle;
-        }
-        else if (this._textElement) {
-            this._textElement.textContent = newTitle;
-            this._title = newTitle;
-        }
-    }
-    _updateTooltip(newTooltip) {
-        this._tooltip = newTooltip;
-        if (newTooltip) {
-            this._element.setAttribute('data-tooltip', newTooltip);
-        }
-        else {
-            this._element.removeAttribute('data-tooltip');
-        }
-    }
-    _updateIconUrl(newIconUrl) {
-        this._iconUrl = newIconUrl;
-        if (this._iconImgElement && !newIconUrl) {
-            this._iconImgElement.remove();
-            this._iconImgElement = undefined;
-        }
-        else if (!this._iconImgElement && newIconUrl) {
-            this._createIconImgElement();
-        }
-        if (this._iconImgElement && newIconUrl) {
-            this._iconImgElement.src = newIconUrl;
-        }
-    }
-    _updateIconClass(newIconClass) {
-        if (this._iconElement && !newIconClass && !this._iconUrl) {
-            this._iconElement.remove();
-            this._iconElement = undefined;
-        }
-        else if (!this._iconElement && newIconClass) {
-            this._createIconElement();
-        }
-        this._iconClass = newIconClass;
-        if (this._iconElement) {
-            this._iconElement.setAttribute('class', 'inboxsdk__button_icon ' + (newIconClass || ''));
-        }
-    }
-    _setEnabled(value) {
-        if (this._isEnabled === value) {
-            return;
-        }
-        this._isEnabled = value;
-        if (this._isEnabled) {
-            this._element.classList.remove('inboxsdk__button_disabled');
-        }
-        else {
-            this._element.classList.add('inboxsdk__button_disabled');
-        }
-        this._eventStream.emit({
-            eventName: 'enabledChanged',
-            isEnabled: this._isEnabled,
-        });
-        if (this._isEnabled) {
-            this._setupKeyboardShortcutEvent();
-        }
-    }
-    _setupEventStream() {
-        const clickEventStream = Kefir.fromEvents(this._element, 'click');
-        clickEventStream.onValue(function (event) {
-            event.stopPropagation();
-            event.preventDefault();
-        });
-        this._eventStream.plug(clickEventStream
-            .filter(() => this.isEnabled())
-            .map(function (event) {
-            return {
-                eventName: 'click',
-                domEvent: event,
-            };
-        }));
-        const isEnterOrSpace = (event) => includes([32 /* space */, 13 /* enter */], event.which);
-        const keydownEventStream = Kefir.fromEvents(this._element, 'keydown').filter(() => this.isEnabled());
-        const enterEventStream = keydownEventStream.filter(isEnterOrSpace);
-        this._eventStream.plug(enterEventStream.map(function (event) {
-            return {
-                eventName: 'click',
-                domEvent: event,
-            };
-        }));
-        enterEventStream.onValue(function (event) {
-            event.stopPropagation();
-            event.preventDefault();
-        });
-    }
-    _setupKeyboardShortcutEvent() {
-        const keyboardShortcutHandle = this._keyboardShortcutHandle;
-        if (keyboardShortcutHandle) {
-            this._eventStream.plug(keyboardShortcutStream(keyboardShortcutHandle.chord)
-                .takeUntilBy(this._eventStream.filter(function (event) {
-                return (event.eventName === 'enabledChanged' &&
-                    event.isEnabled === false);
-            }))
-                .map(function (domEvent) {
-                return {
-                    eventName: 'click',
-                    domEvent: domEvent,
-                };
-            }));
-        }
-    }
-    _setupAestheticEvents() {
-        Kefir.fromEvents(this._element, 'mouseenter')
-            .filter(() => this.isEnabled())
-            .onValue(() => {
-            this._element.classList.add(BUTTON_COLOR_CLASSES[this._buttonColor].HOVER_CLASS);
-            this._element.classList.add('inboxsdk__button_hover');
-        });
-        Kefir.fromEvents(this._element, 'mouseleave').onValue(() => {
-            this._element.classList.remove(BUTTON_COLOR_CLASSES[this._buttonColor].HOVER_CLASS);
-            this._element.classList.remove('inboxsdk__button_hover');
-        });
-        Kefir.fromEvents(this._element, 'focus').onValue(() => {
-            this._element.classList.add('T-I-JO');
-        });
-        Kefir.fromEvents(this._element, 'blur').onValue(() => {
-            this._element.classList.remove('T-I-JO');
-        });
-    }
-}

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

@@ -1,61 +0,0 @@
-/* eslint-disable @typescript-eslint/no-empty-function */
-import * as Kefir from 'kefir';
-import kefirBus from 'kefir-bus';
-import kefirStopper from 'kefir-stopper';
-export default class CreateAccessoryButtonView {
-    _element = document.createElement('div');
-    _eventStream = kefirBus();
-    _stopper = kefirStopper();
-    constructor() {
-        this._setupElement();
-        this._setupEventStream();
-    }
-    addClass(_className) { }
-    removeClass(_className) { }
-    update() {
-        // noop
-    }
-    setEnabled() {
-        throw new Error('not implemented');
-    }
-    destroy() {
-        this._eventStream.end();
-        this._stopper.destroy();
-        this._element.remove();
-    }
-    getElement() {
-        return this._element;
-    }
-    getEventStream() {
-        return this._eventStream;
-    }
-    activate() {
-        const innerButtonElement = this._element.firstElementChild;
-        if (innerButtonElement)
-            innerButtonElement.classList.add('aj1');
-    }
-    deactivate() {
-        const innerButtonElement = this._element.firstElementChild;
-        if (innerButtonElement)
-            innerButtonElement.classList.remove('aj1');
-    }
-    _setupElement() {
-        this._element.setAttribute('class', 'nL aig');
-        this._element.setAttribute('style', 'left: 7px');
-        this._element.innerHTML = [
-            '<div class="pM aRw" style="display: inline-flex; margin-left: 16px;" role="button">',
-            '<div class="p6">',
-            '<div class="p8">▼</div>',
-            '</div>',
-            '</div>',
-        ].join('');
-    }
-    _setupEventStream() {
-        const clickEventStream = Kefir.fromEvents(this._element, 'click');
-        clickEventStream.onValue((event) => {
-            event.stopPropagation();
-            event.preventDefault();
-        });
-        this._eventStream.plug(clickEventStream.map((event) => ({ eventName: 'click', domEvent: event })));
-    }
-}