@inboxsdk/core 1.2.4 → 1.2.7

package/src/platform-implementation-js/dom-driver/gmail/views/gmail-collapsible-section-view.js

@@ -1,720 +0,0 @@
-import escape from 'lodash/escape';
-import * as Kefir from 'kefir';
-import kefirBus from 'kefir-bus';
-import defer from '../../../../common/defer';
-import autoHtml from 'auto-html';
-import querySelector from '../../../lib/dom/querySelectorOrFail';
-import InboxDropdownButtonView from '../widgets/buttons/inbox-dropdown-button-view';
-import GmailDropdownView from '../widgets/gmail-dropdown-view';
-import DropdownButtonViewController from '../../../widgets/buttons/dropdown-button-view-controller';
-class GmailCollapsibleSectionView {
-    _driver;
-    _groupOrderHint;
-    _isReadyDeferred;
-    _isCollapsible;
-    _collapsibleSectionDescriptor = {};
-    _isSearch;
-    _element = null;
-    _headerElement = null;
-    _titleElement = null;
-    _bodyElement = null;
-    _contentElement = null;
-    _tableBodyElement = null;
-    _collapsedContainer = null;
-    _messageElement = null;
-    _footerElement = null;
-    _eventStream;
-    _isCollapsed = false;
-    _inboxDropdownButtonView = null;
-    _dropdownViewController = null;
-    constructor(driver, groupOrderHint, isSearch, isCollapsible) {
-        this._driver = driver;
-        this._isSearch = isSearch;
-        this._groupOrderHint = groupOrderHint;
-        this._isCollapsible = isCollapsible;
-        this._eventStream = kefirBus();
-        this._isReadyDeferred = new defer();
-    }
-    destroy() {
-        if (this._element)
-            this._element.remove();
-        if (this._eventStream)
-            this._eventStream.end();
-        if (this._headerElement)
-            this._headerElement.remove();
-        if (this._titleElement)
-            this._titleElement.remove();
-        if (this._bodyElement)
-            this._bodyElement.remove();
-        if (this._contentElement)
-            this._contentElement.remove();
-        if (this._tableBodyElement)
-            this._tableBodyElement.remove();
-        if (this._collapsedContainer)
-            this._collapsedContainer.remove();
-        if (this._messageElement)
-            this._messageElement.remove();
-        if (this._inboxDropdownButtonView)
-            this._inboxDropdownButtonView.destroy();
-        if (this._dropdownViewController)
-            this._dropdownViewController.destroy();
-    }
-    getElement() {
-        const element = this._element;
-        if (!element)
-            throw new Error('tried to access element that does not exist');
-        return element;
-    }
-    getEventStream() {
-        return this._eventStream;
-    }
-    setCollapsibleSectionDescriptorProperty(collapsibleSectionDescriptorProperty) {
-        const stoppedProperty = collapsibleSectionDescriptorProperty.takeUntilBy(this._eventStream.filter(() => false).beforeEnd(() => null));
-        stoppedProperty.onValue((x) => this._updateValues(x));
-        stoppedProperty.take(1).onValue(() => this._isReadyDeferred.resolve(this));
-    }
-    setCollapsed(value) {
-        if (!this._isCollapsible) {
-            return;
-        }
-        this._isReadyDeferred.promise.then(() => {
-            if (value)
-                this._collapse();
-            else
-                this._expand();
-        });
-    }
-    _updateValues(collapsibleSectionDescriptor) {
-        const element = this._element;
-        if (!collapsibleSectionDescriptor) {
-            if (element) {
-                element.style.display = 'none';
-            }
-            return;
-        }
-        else if (element) {
-            element.style.display = '';
-        }
-        if (!element) {
-            this._setupElement(collapsibleSectionDescriptor);
-            this._showLoadingMessage();
-        }
-        else {
-            this._updateElement(collapsibleSectionDescriptor);
-        }
-        this._updateHeader(collapsibleSectionDescriptor);
-        this._updateTitle(collapsibleSectionDescriptor);
-        this._updateSubtitle(collapsibleSectionDescriptor);
-        this._updateSummaryText(collapsibleSectionDescriptor);
-        this._updateDropdown(collapsibleSectionDescriptor);
-        this._updateContentElement(collapsibleSectionDescriptor);
-        this._updateTableRows(collapsibleSectionDescriptor);
-        this._updateMessageElement(collapsibleSectionDescriptor);
-        this._updateFooter(collapsibleSectionDescriptor);
-        this._collapsibleSectionDescriptor = collapsibleSectionDescriptor;
-    }
-    _setupElement(collapsibleSectionDescriptor) {
-        const element = (this._element = document.createElement('div'));
-        element.setAttribute('class', 'inboxsdk__resultsSection');
-        element.setAttribute('data-group-order-hint', String(this._groupOrderHint));
-        element.setAttribute('data-order-hint', String(typeof collapsibleSectionDescriptor.orderHint === 'number'
-            ? collapsibleSectionDescriptor.orderHint
-            : 0));
-        if (!this._isCollapsible)
-            element.classList.add('inboxsdk__resultsSection_nonCollapsible');
-        this._setupHeader(collapsibleSectionDescriptor);
-        const bodyElement = (this._bodyElement = document.createElement('div'));
-        const bodyContentsElement = document.createElement('div');
-        bodyContentsElement.classList.add('zE');
-        bodyElement.appendChild(bodyContentsElement);
-        element.appendChild(bodyElement);
-        const contentElement = (this._contentElement =
-            document.createElement('div'));
-        bodyContentsElement.appendChild(contentElement);
-        const messageElement = (this._messageElement =
-            document.createElement('div'));
-        bodyContentsElement.appendChild(messageElement);
-        const tableBodyElement = (this._tableBodyElement =
-            document.createElement('div'));
-        bodyContentsElement.appendChild(tableBodyElement);
-        this._setupFooter();
-        if (this._isCollapsible && this._titleElement) {
-            Kefir.fromEvents(this._titleElement, 'click').onValue(() => this._toggleCollapseState());
-        }
-        Kefir.fromEvents(element, 'removeCollapsedContainer').onValue(() => this._destroyCollapsedContainer());
-        Kefir.fromEvents(element, 'readdToCollapsedContainer').onValue(() => this._addToCollapsedContainer());
-        this._eventStream.emit({
-            type: 'update',
-            property: 'orderHint',
-            sectionDescriptor: collapsibleSectionDescriptor,
-        });
-    }
-    _setupHeader(collapsibleSectionDescriptor) {
-        const headerElement = (this._headerElement = document.createElement('div'));
-        headerElement.classList.add('inboxsdk__resultsSection_header', 'Wg');
-        this._setupGmailv2Header(headerElement, collapsibleSectionDescriptor);
-        if (this._element)
-            this._element.appendChild(headerElement);
-    }
-    _setupGmailv2Header(headerElement, collapsibleSectionDescriptor) {
-        const titleElement = (this._titleElement = document.createElement('div'));
-        titleElement.setAttribute('class', 'inboxsdk__resultsSection_title');
-        titleElement.innerHTML = [
-            '<h3 class="Wr iR">',
-            '<img alt="" src="//ssl.gstatic.com/ui/v1/icons/mail/images/cleardot.gif" class="qi Wp Wq">',
-            '<div class="Wn">',
-            escape(collapsibleSectionDescriptor.title),
-            '</div>',
-            '</h3>',
-        ].join('');
-        const floatRightElement = document.createElement('div');
-        floatRightElement.classList.add('Cr');
-        if (this._isSearch)
-            floatRightElement.classList.add('Wg');
-        headerElement.appendChild(titleElement);
-        headerElement.appendChild(floatRightElement);
-    }
-    _setupFooter() {
-        const footerElement = (this._footerElement = document.createElement('div'));
-        footerElement.classList.add('inboxsdk__resultsSection_footer');
-        if (this._bodyElement)
-            this._bodyElement.appendChild(footerElement);
-    }
-    _updateElement(collapsibleSectionDescriptor) {
-        if (this._collapsibleSectionDescriptor.orderHint !==
-            collapsibleSectionDescriptor.orderHint) {
-            const element = this._element;
-            if (element)
-                element.setAttribute('data-order-hint', '' +
-                    (typeof collapsibleSectionDescriptor.orderHint === 'number'
-                        ? collapsibleSectionDescriptor.orderHint
-                        : 0));
-            this._eventStream.emit({
-                type: 'update',
-                property: 'orderHint',
-            });
-        }
-    }
-    _updateHeader(collapsibleSectionDescriptor) {
-        if (this._isCollapsible ||
-            collapsibleSectionDescriptor.title ||
-            collapsibleSectionDescriptor.subtitle ||
-            collapsibleSectionDescriptor.titleLinkText ||
-            collapsibleSectionDescriptor.hasDropdown) {
-            if (this._headerElement)
-                this._headerElement.style.display = '';
-        }
-        else {
-            if (this._headerElement)
-                this._headerElement.style.display = 'none';
-        }
-    }
-    _updateTitle(collapsibleSectionDescriptor) {
-        if (this._collapsibleSectionDescriptor.title !==
-            collapsibleSectionDescriptor.title) {
-            const selector = 'h3 > .Wn';
-            if (this._titleElement) {
-                querySelector(this._titleElement, selector).textContent =
-                    collapsibleSectionDescriptor.title;
-            }
-        }
-    }
-    _updateSubtitle(collapsibleSectionDescriptor) {
-        const titleElement = this._titleElement;
-        if (!titleElement)
-            return;
-        let subtitleElement = titleElement.querySelector('.inboxsdk__resultsSection_title_subtitle');
-        if (!collapsibleSectionDescriptor.subtitle) {
-            if (subtitleElement) {
-                subtitleElement.remove();
-            }
-        }
-        else if (this._collapsibleSectionDescriptor.subtitle !==
-            collapsibleSectionDescriptor.subtitle) {
-            if (!subtitleElement) {
-                subtitleElement = document.createElement('span');
-                if (subtitleElement && titleElement) {
-                    subtitleElement.classList.add('inboxsdk__resultsSection_title_subtitle');
-                    const insertionPoint = titleElement.querySelector('.Wn');
-                    if (insertionPoint) {
-                        subtitleElement.classList.add('aw5');
-                        insertionPoint.appendChild(subtitleElement);
-                    }
-                }
-            }
-            subtitleElement.textContent =
-                '(' + collapsibleSectionDescriptor.subtitle + ')';
-        }
-    }
-    _updateSummaryText(collapsibleSectionDescriptor) {
-        const headerElement = this._headerElement;
-        if (!headerElement)
-            return;
-        let summaryTextElement = headerElement.querySelector('.inboxsdk__resultsSection_header_summaryText');
-        if (!collapsibleSectionDescriptor.titleLinkText) {
-            if (summaryTextElement) {
-                summaryTextElement.remove();
-            }
-        }
-        else if (collapsibleSectionDescriptor.titleLinkText !==
-            this._collapsibleSectionDescriptor.titleLinkText) {
-            if (!summaryTextElement) {
-                summaryTextElement = document.createElement('div');
-                summaryTextElement.setAttribute('class', 'inboxsdk__resultsSection_header_summaryText Wm');
-                summaryTextElement.innerHTML = [
-                    '<span class="Di">&nbsp;',
-                    '<div class="J-J5-Ji amH">',
-                    '<span class="Dj">',
-                    '<span></span>',
-                    '</span>',
-                    '&nbsp;',
-                    '</div>',
-                    '</span>',
-                ].join('');
-                this._eventStream.plug(Kefir.fromEvents(summaryTextElement, 'click').map(() => ({
-                    eventName: 'titleLinkClicked',
-                    sectionDescriptor: this._collapsibleSectionDescriptor,
-                })));
-                const _summaryTextElement = summaryTextElement;
-                summaryTextElement.addEventListener('mouseenter', function () {
-                    _summaryTextElement.classList.add('aqi');
-                });
-                summaryTextElement.addEventListener('mouseleave', function () {
-                    _summaryTextElement.classList.remove('aqi');
-                });
-                const insertionPoint = headerElement.querySelector('.Cr');
-                if (insertionPoint)
-                    insertionPoint.insertAdjacentElement('afterbegin', summaryTextElement);
-            }
-            querySelector(summaryTextElement, '.Dj > *').textContent =
-                collapsibleSectionDescriptor.titleLinkText;
-        }
-    }
-    _updateDropdown(collapsibleSectionDescriptor) {
-        if (!collapsibleSectionDescriptor.hasDropdown ||
-            !collapsibleSectionDescriptor.onDropdownClick) {
-            if (this._inboxDropdownButtonView)
-                this._inboxDropdownButtonView.destroy();
-            if (this._dropdownViewController)
-                this._dropdownViewController.destroy();
-        }
-        else if (collapsibleSectionDescriptor.hasDropdown &&
-            collapsibleSectionDescriptor.onDropdownClick) {
-            if (!this._inboxDropdownButtonView || !this._dropdownViewController) {
-                const inboxDropdownButtonView = (this._inboxDropdownButtonView =
-                    new InboxDropdownButtonView());
-                this._dropdownViewController = new DropdownButtonViewController({
-                    buttonView: inboxDropdownButtonView,
-                    dropdownViewDriverClass: GmailDropdownView,
-                    dropdownShowFunction: collapsibleSectionDescriptor.onDropdownClick,
-                });
-                const headerElement = this._headerElement;
-                if (headerElement) {
-                    const childElement = headerElement.querySelector('.Cr');
-                    if (childElement)
-                        childElement.appendChild(inboxDropdownButtonView.getElement());
-                }
-            }
-            else if (collapsibleSectionDescriptor.onDropdownClick !==
-                this._collapsibleSectionDescriptor.onDropdownClick) {
-                if (this._dropdownViewController)
-                    this._dropdownViewController.setDropdownShowFunction(collapsibleSectionDescriptor.onDropdownClick);
-            }
-        }
-    }
-    _updateContentElement(collapsibleSectionDescriptor) {
-        const contentElement = this._contentElement;
-        if (!contentElement)
-            return;
-        contentElement.innerHTML = '';
-        if (collapsibleSectionDescriptor.contentElement) {
-            contentElement.style.display = '';
-            contentElement.appendChild(collapsibleSectionDescriptor.contentElement);
-        }
-        else {
-            contentElement.style.display = 'none';
-        }
-    }
-    _updateTableRows(collapsibleSectionDescriptor) {
-        const { tableRows } = collapsibleSectionDescriptor;
-        const tableBodyElement = this._tableBodyElement;
-        if (!tableBodyElement)
-            return;
-        tableBodyElement.innerHTML = '';
-        if (!tableRows || tableRows.length === 0) {
-            tableBodyElement.style.display = 'none';
-        }
-        else {
-            tableBodyElement.style.display = '';
-            this._renderTable(tableRows);
-        }
-    }
-    _renderTable(tableRows) {
-        const tableElement = document.createElement('table');
-        tableElement.setAttribute('class', 'F cf zt');
-        tableElement.innerHTML = _getTableHTML();
-        if (this._tableBodyElement)
-            this._tableBodyElement.appendChild(tableElement);
-        const tbody = tableElement.querySelector('tbody');
-        const eventStream = this._eventStream;
-        tableRows.forEach((result) => {
-            const rowElement = document.createElement('tr');
-            rowElement.setAttribute('class', 'inboxsdk__resultsSection_tableRow zA ' + (result.isRead ? 'yO' : 'zE'));
-            rowElement.innerHTML = _getRowHTML(result);
-            if (!tbody)
-                throw new Error('should not happen');
-            tbody.appendChild(rowElement);
-            eventStream.plug(Kefir.fromEvents(rowElement, 'click').map(() => ({
-                eventName: 'rowClicked',
-                rowDescriptor: result,
-            })));
-        });
-    }
-    _updateMessageElement(collapsibleSectionDescriptor) {
-        const messageElement = this._messageElement;
-        if ((collapsibleSectionDescriptor.tableRows &&
-            collapsibleSectionDescriptor.tableRows.length > 0) ||
-            collapsibleSectionDescriptor.contentElement) {
-            if (messageElement) {
-                messageElement.innerHTML = '';
-                messageElement.style.display = 'none';
-            }
-        }
-        else if (collapsibleSectionDescriptor.tableRows &&
-            collapsibleSectionDescriptor.tableRows.length === 0 &&
-            !collapsibleSectionDescriptor.contentElement) {
-            this._showEmptyMessage();
-        }
-    }
-    _showLoadingMessage() {
-        const messageElement = this._messageElement;
-        if (messageElement) {
-            messageElement.setAttribute('class', 'TB TC inboxsdk__resultsSection_loading');
-            messageElement.innerHTML = 'loading...'; //TODO: localize
-            messageElement.style.display = '';
-        }
-    }
-    _showEmptyMessage() {
-        const messageElement = this._messageElement;
-        if (messageElement) {
-            messageElement.setAttribute('class', 'TB TC');
-            messageElement.innerHTML = 'No results found'; //TODO: localize
-            messageElement.style.display = '';
-        }
-    }
-    _updateFooter(collapsibleSectionDescriptor) {
-        const footerElement = this._footerElement;
-        if (!footerElement)
-            return;
-        footerElement.innerHTML = '';
-        if (!collapsibleSectionDescriptor.footerLinkText &&
-            !collapsibleSectionDescriptor.footerLinkIconUrl &&
-            !collapsibleSectionDescriptor.footerLinkIconClass) {
-            footerElement.style.display = 'none';
-        }
-        else {
-            footerElement.style.display = '';
-            const footerLinkElement = document.createElement('span');
-            footerLinkElement.setAttribute('class', 'e Wb');
-            footerLinkElement.textContent =
-                collapsibleSectionDescriptor.footerLinkText;
-            this._eventStream.plug(Kefir.fromEvents(footerLinkElement, 'click').map(() => {
-                return {
-                    eventName: 'footerClicked',
-                    sectionDescriptor: this._collapsibleSectionDescriptor,
-                };
-            }));
-            footerElement.appendChild(footerLinkElement);
-            footerElement.insertAdjacentHTML('beforeend', '<br style="clear:both;">');
-        }
-    }
-    _toggleCollapseState() {
-        if (this._isCollapsed) {
-            this._expand();
-        }
-        else {
-            this._collapse();
-        }
-    }
-    _collapse() {
-        const element = this._element;
-        if (!element) {
-            return;
-        }
-        element.classList.add('inboxsdk__resultsSection_collapsed');
-        if (!this._isSearch) {
-            this._addToCollapsedContainer();
-        }
-        const selector = 'h3 > img.Wp';
-        if (this._titleElement) {
-            const arrowSpan = querySelector(this._titleElement, selector);
-            if (arrowSpan) {
-                arrowSpan.classList.remove('Wq');
-                arrowSpan.classList.add('Wo');
-            }
-        }
-        if (this._bodyElement)
-            this._bodyElement.style.display = 'none';
-        this._isCollapsed = true;
-        this._eventStream.emit({
-            eventName: 'collapsed',
-        });
-    }
-    _expand() {
-        const element = this._element;
-        if (!element) {
-            return;
-        }
-        element.classList.remove('inboxsdk__resultsSection_collapsed');
-        if (!this._isSearch) {
-            this._removeFromCollapsedContainer();
-        }
-        const selector = 'h3 > img.Wp';
-        if (this._titleElement) {
-            const arrowSpan = querySelector(this._titleElement, selector);
-            if (arrowSpan) {
-                arrowSpan.classList.remove('Wo');
-                arrowSpan.classList.add('Wq');
-            }
-        }
-        if (this._bodyElement)
-            this._bodyElement.style.display = '';
-        this._isCollapsed = false;
-        this._eventStream.emit({
-            eventName: 'expanded',
-        });
-    }
-    _addToCollapsedContainer() {
-        const element = this._element;
-        if (!element)
-            return;
-        if (this._headerElement)
-            this._headerElement.classList.remove('Wg');
-        if (this._isCollapsedContainer(element.previousElementSibling) &&
-            this._isCollapsedContainer(element.nextElementSibling)) {
-            //we are surrounded by collapse containers, let's favor our previous sibling
-            const otherCollapseContainer = element.nextElementSibling;
-            const previousSibling = element.previousElementSibling;
-            if (!previousSibling)
-                throw new Error('previousSibling does not exist');
-            if (!otherCollapseContainer)
-                throw new Error('otherCollapseContainer does not exist');
-            previousSibling.children[0].appendChild(element);
-            //now we need to "merge" the two collapse containers. This can be done by taking all the result sections out of the collapsed container
-            //and calling our "recollapse" helper function on them
-            const elementsToRecollapse = Array.from(otherCollapseContainer.children[0].children).concat(Array.from(otherCollapseContainer.children[1].children));
-            if (otherCollapseContainer)
-                this._pulloutSectionsFromCollapsedContainer(otherCollapseContainer);
-            this._recollapse(elementsToRecollapse);
-        }
-        else {
-            this._readdToCollapsedContainer();
-        }
-    }
-    _removeFromCollapsedContainer() {
-        if (this._headerElement)
-            this._headerElement.classList.add('Wg');
-        const element = this._element;
-        if (!element)
-            return;
-        const parentElement = element.parentElement;
-        if (!parentElement)
-            return;
-        const container = parentElement.parentElement;
-        if (!container ||
-            !container.classList.contains('inboxsdk__results_collapsedContainer')) {
-            return;
-        }
-        const elementsToRecollapse = Array.from(container.children[0].children).concat(Array.from(container.children[1].children));
-        this._pulloutSectionsFromCollapsedContainer(container);
-        this._destroyCollapsedContainer();
-        this._recollapse(elementsToRecollapse.filter((child) => child !== element));
-    }
-    _pulloutSectionsFromCollapsedContainer(container) {
-        const prependedChildren = Array.from(container.children[0].children);
-        prependedChildren.forEach((child) => container.insertAdjacentElement('beforebegin', child));
-        const appendedChildren = Array.from(container.children[1].children).reverse();
-        appendedChildren.forEach((child) => container.insertAdjacentElement('afterend', child));
-    }
-    _readdToCollapsedContainer() {
-        const element = this._element;
-        if (!element)
-            return;
-        if (this._collapsedContainer) {
-            this._collapsedContainer.children[0].insertBefore(element, this._collapsedContainer.children[1].firstElementChild);
-            return;
-        }
-        let collapsedContainer;
-        let isPrepend;
-        if (this._isCollapsedContainer(element.previousElementSibling)) {
-            isPrepend = false;
-            collapsedContainer = element.previousElementSibling;
-        }
-        else if (this._isCollapsedContainer(element.nextElementSibling)) {
-            isPrepend = true;
-            collapsedContainer = element.nextElementSibling;
-        }
-        else {
-            isPrepend = true;
-            this._createCollapsedContainer();
-            collapsedContainer = this._collapsedContainer;
-        }
-        if (isPrepend && collapsedContainer) {
-            collapsedContainer.children[0].insertBefore(element, collapsedContainer.children[0].firstElementChild);
-        }
-        else if (collapsedContainer) {
-            collapsedContainer.children[0].appendChild(element);
-        }
-    }
-    _isCollapsedContainer(element) {
-        return (element &&
-            element.classList.contains('inboxsdk__results_collapsedContainer'));
-    }
-    _recollapse(children) {
-        children.forEach((child) => {
-            const removeEvent = document.createEvent('CustomEvent');
-            removeEvent.initCustomEvent('removeCollapsedContainer', false, false, null);
-            child.dispatchEvent(removeEvent);
-            const readdEvent = document.createEvent('CustomEvent');
-            readdEvent.initCustomEvent('readdToCollapsedContainer', false, false, null);
-            child.dispatchEvent(readdEvent);
-        });
-    }
-    _createCollapsedContainer() {
-        const collapsedContainer = (this._collapsedContainer =
-            document.createElement('div'));
-        collapsedContainer.setAttribute('class', 'inboxsdk__results_collapsedContainer Wg');
-        collapsedContainer.innerHTML =
-            '<div class="inboxsdk__results_collapsedContainer_prepend"></div><div class="inboxsdk__results_collapsedContainer_append"></div>';
-        const element = this._element;
-        if (element)
-            element.insertAdjacentElement('afterend', collapsedContainer);
-    }
-    _destroyCollapsedContainer() {
-        if (this._collapsedContainer) {
-            this._collapsedContainer.remove();
-            this._collapsedContainer = null;
-        }
-    }
-}
-function _getTableHTML() {
-    return [
-        '<colgroup>',
-        '<col class="k0vOLb">',
-        '<col class="Ci">',
-        '<col class="y5">',
-        '<col class="WA">',
-        '<col class="yY">',
-        '<col>',
-        '<col class="xX">',
-        '</colgroup>',
-        '<tbody>',
-        '</tbody>',
-    ].join('');
-}
-function _getRowHTML(result) {
-    let iconHtml = '';
-    if (result.iconHtml != null) {
-        iconHtml = autoHtml `<div class="inboxsdk__resultsSection_result_icon inboxsdk__resultsSection_result_iconHtml">
-        ${{
-            __html: result.iconHtml,
-        }}
-      </div>`;
-    }
-    else if (result.iconUrl) {
-        iconHtml = autoHtml `<img class="inboxsdk__resultsSection_result_icon ${result.iconClass || ''}" src="${result.iconUrl}">`;
-    }
-    else if (result.iconClass)
-        iconHtml = autoHtml `<div class="${result.iconClass}"></div>`;
-    const labelsHtml = Array.isArray(result.labels)
-        ? result.labels.map(_getLabelHTML).join('')
-        : '';
-    const rowArr = [
-        '<td class="xY PF"></td>',
-        '<td class="xY oZ-x3"></td>',
-        '<td class="xY WA">',
-        iconHtml,
-        '</td>',
-        '<td class="xY WA"></td>',
-        '<td class="xY yX inboxsdk__resultsSection_result_title">',
-        '<div class="yW">',
-        '<span ' + (result.isRead ? '' : 'class="zF"') + '>',
-        escape(result.title),
-        '</span>',
-        '</div>',
-        '</td>',
-        '<td class="xY a4W">',
-        '<div class="xS">',
-        '<div class="xT">',
-        '<div class="yi">',
-        labelsHtml,
-        '</div>',
-        '<div class="y6">',
-        '<span class="bog">',
-        result.isRead ? '' : '<b>',
-        escape(result.body || ''),
-        result.isRead ? '' : '</b>',
-        '</span>',
-        '</div>',
-        '</div>',
-        '</div>',
-        '</td>',
-        '<td class="xY xW">',
-        '<span' + (result.isRead ? '' : ' class="bq3"') + '>',
-        escape(result.shortDetailText || ''),
-        '</span>',
-        '</td>',
-    ];
-    return rowArr.join('');
-}
-function _getLabelHTML(label) {
-    const backgroundColor = label.backgroundColor || 'rgb(194, 194, 194)'; //grey
-    const foregroundColor = label.foregroundColor || 'rgb(255, 255, 255)'; //white
-    const maxWidth = label.maxWidth || '90px';
-    const retArray = [
-        autoHtml `<div class="ar as" data-tooltip="${label.title}">
-      <div class="at" style="background-color: ${backgroundColor}; border-color: ${backgroundColor};">
-        <div class="au" style="border-color: ${backgroundColor};">`,
-    ];
-    const styleHtml = label.iconBackgroundColor
-        ? autoHtml `style="background-color: ${label.iconBackgroundColor}"`
-        : '';
-    if (label.iconHtml != null) {
-        retArray.push(autoHtml `<div class="inboxsdk__resultsSection_label_icon inboxsdk__resultsSection_label_iconHtml"
-        ${{
-            __html: styleHtml,
-        }}
-      >
-        ${{
-            __html: label.iconHtml,
-        }}
-      </div>`);
-    }
-    else if (label.iconClass) {
-        retArray.push(autoHtml `<div
-        class="inboxsdk__resultsSection_label_icon ${label.iconClass || ''}"
-        ${{
-            __html: styleHtml,
-        }}
-        >
-      </div>`);
-    }
-    else if (label.iconUrl) {
-        retArray.push(autoHtml `<img
-        class="inboxsdk__resultsSection_label_icon"
-        ${{
-            __html: styleHtml,
-        }}
-        src="${label.iconUrl}" />`);
-    }
-    retArray.push(autoHtml `
-          <div class="av" style="color: ${foregroundColor}; max-width: ${maxWidth}">
-            ${label.title}
-          </div>
-        </div>
-      </div>
-    </div>
-    `);
-    return retArray.join('');
-}
-export default GmailCollapsibleSectionView;