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

package/src/platform-implementation-js/dom-driver/inbox/getSidebarClassnames.js

@@ -1,15 +1,19 @@
-/* @flow */
+"use strict";
 
-import difference from 'lodash/difference';
-import once from 'lodash/once';
-import flatMap from 'lodash/flatMap';
-import last from 'lodash/last';
-import t from 'transducers.js';
-import cssParser from 'postcss-selector-parser';
-import Logger from '../../lib/logger';
-import querySelector from '../../lib/dom/querySelectorOrFail';
-
-const cssProcessor = cssParser();
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _difference = _interopRequireDefault(require("lodash/difference"));
+var _once = _interopRequireDefault(require("lodash/once"));
+var _flatMap = _interopRequireDefault(require("lodash/flatMap"));
+var _last = _interopRequireDefault(require("lodash/last"));
+var _transducers = _interopRequireDefault(require("transducers.js"));
+var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
+var _logger = _interopRequireDefault(require("../../lib/logger"));
+var _querySelectorOrFail = _interopRequireDefault(require("../../lib/dom/querySelectorOrFail"));
+const cssProcessor = (0, _postcssSelectorParser.default)();
 
 // There are specific classnames which are added when the chat or nav sidebars
 // are open which affect the layout of the page. We need to be able to activate
@@ -20,11 +24,7 @@ const cssProcessor = cssParser();
 // applied to it depending on the current page width and sidebar settings to
 // keep it lined up with the search bar.
 
-const getSidebarClassnames: () => {
-  chat: ?string,
-  nav: ?string,
-  centerList: ?string,
-} = once(() => {
+const getSidebarClassnames = (0, _once.default)(() => {
   // We know that the page has a CSS rule which looks like
   //   .blah.chat .foo { margin-right: bigger number; margin-left: smaller number; }
   // where .chat is the chat sidebar classname that we want to know, and .foo
@@ -41,131 +41,74 @@ const getSidebarClassnames: () => {
 
   // So first we find all the classnames on the [role=application] and make a
   // regex for each one.
-  const classRegexes: RegExp[] = Array.from(
-    (querySelector(document, '[role=application]').classList: any)
-  ).map((x) => new RegExp('\\.' + x + '\\b'));
+  const classRegexes = Array.from((0, _querySelectorOrFail.default)(document, '[role=application]').classList).map(x => new RegExp('\\.' + x + '\\b'));
   if (classRegexes.length === 0) throw new Error('no class names on element');
 
   // rules will contain both the chat and nav sidebar rules.
-  const rules = t.toArray(
-    Array.prototype.slice.call(document.styleSheets),
-    t.compose(
-      t.filter((sheet) => {
-        try {
-          return sheet.cssRules && sheet.cssRules.length;
-        } catch (err) {
-          // ignore. Sometimes pages have stylesheets that don't permit their
-          // rules to be enumerated. Possibly caused by other extensions including
-          // a css file from another domain?
-          return false;
-        }
-      }),
-      t.mapcat((sheet) => Array.prototype.slice.call(sheet.cssRules || [])),
-      t.mapcat(rulesToStyleRules),
-      // We have all page rules. Filter it down to just rules mentioning one of
-      // [role=application]'s classnames.
-      t.filter((rule) => classRegexes.some((r) => r.test(rule.selectorText))),
-      // Now just the rules that contain both margin-left and -right rules.
-      t.filter(
-        (rule) => rule.style['margin-left'] && rule.style['margin-right']
-      )
-    )
-  );
-
-  const onlyNavSidebarRule = t.toArray(
-    Array.prototype.slice.call(rules),
-    t.compose(
-      t.filter(
-        (rule) =>
-          parseFloat(rule.style['margin-left']) >
-          parseFloat(rule.style['margin-right'])
-      ),
-      t.take(1)
-    )
-  )[0];
-  const onlyChatSidebarRule = t.toArray(
-    Array.prototype.slice.call(rules),
-    t.compose(
-      t.filter(
-        (rule) =>
-          parseFloat(rule.style['margin-left']) <
-          parseFloat(rule.style['margin-right'])
-      ),
-      t.take(1)
-    )
-  )[0];
+  const rules = _transducers.default.toArray(Array.prototype.slice.call(document.styleSheets), _transducers.default.compose(_transducers.default.filter(sheet => {
+    try {
+      return sheet.cssRules && sheet.cssRules.length;
+    } catch (err) {
+      // ignore. Sometimes pages have stylesheets that don't permit their
+      // rules to be enumerated. Possibly caused by other extensions including
+      // a css file from another domain?
+      return false;
+    }
+  }), _transducers.default.mapcat(sheet => Array.prototype.slice.call(sheet.cssRules || [])), _transducers.default.mapcat(rulesToStyleRules),
+  // We have all page rules. Filter it down to just rules mentioning one of
+  // [role=application]'s classnames.
+  _transducers.default.filter(rule => classRegexes.some(r => r.test(rule.selectorText))),
+  // Now just the rules that contain both margin-left and -right rules.
+  _transducers.default.filter(rule => rule.style['margin-left'] && rule.style['margin-right'])));
+  const onlyNavSidebarRule = _transducers.default.toArray(Array.prototype.slice.call(rules), _transducers.default.compose(_transducers.default.filter(rule => parseFloat(rule.style['margin-left']) > parseFloat(rule.style['margin-right'])), _transducers.default.take(1)))[0];
+  const onlyChatSidebarRule = _transducers.default.toArray(Array.prototype.slice.call(rules), _transducers.default.compose(_transducers.default.filter(rule => parseFloat(rule.style['margin-left']) < parseFloat(rule.style['margin-right'])), _transducers.default.take(1)))[0];
   if (!onlyNavSidebarRule || !onlyChatSidebarRule) {
     const err = new Error('Failed to parse element CSS rules');
-    Logger.error(err, {
+    _logger.default.error(err, {
       rulesCount: rules.length,
       hasOnlyNavSidebarRule: !!onlyNavSidebarRule,
-      hasOnlyChatSidebarRule: !!onlyChatSidebarRule,
+      hasOnlyChatSidebarRule: !!onlyChatSidebarRule
     });
     throw err;
   }
-
-  function getMentionedClassNames(node): string[] {
+  function getMentionedClassNames(node) {
     switch (node.type) {
       case 'root':
       case 'selector':
-        return flatMap(node.nodes, getMentionedClassNames);
+        return (0, _flatMap.default)(node.nodes, getMentionedClassNames);
       case 'class':
         return [node.value];
       default:
         return [];
     }
   }
-
-  const onlyNavSidebarRuleClassNames: string[] = getMentionedClassNames(
-    cssProcessor.process(onlyNavSidebarRule.selectorText).res
-  );
-  const onlyChatSidebarRuleClassNames: string[] = getMentionedClassNames(
-    cssProcessor.process(onlyChatSidebarRule.selectorText).res
-  );
-
-  const chatSidebarClassNames: string[] = difference(
-    onlyChatSidebarRuleClassNames,
-    onlyNavSidebarRuleClassNames
-  );
-
-  const navSidebarClassNames: string[] = difference(
-    onlyNavSidebarRuleClassNames,
-    onlyChatSidebarRuleClassNames
-  );
-
-  const centerListClassName: ?string =
-    last(onlyNavSidebarRuleClassNames) === last(onlyChatSidebarRuleClassNames)
-      ? last(onlyNavSidebarRuleClassNames)
-      : null;
-
-  if (
-    chatSidebarClassNames.length !== 1 ||
-    navSidebarClassNames.length !== 1 ||
-    !centerListClassName
-  ) {
-    Logger.error(new Error('Failed to find sidebar classnames'), {
+  const onlyNavSidebarRuleClassNames = getMentionedClassNames(cssProcessor.process(onlyNavSidebarRule.selectorText).res);
+  const onlyChatSidebarRuleClassNames = getMentionedClassNames(cssProcessor.process(onlyChatSidebarRule.selectorText).res);
+  const chatSidebarClassNames = (0, _difference.default)(onlyChatSidebarRuleClassNames, onlyNavSidebarRuleClassNames);
+  const navSidebarClassNames = (0, _difference.default)(onlyNavSidebarRuleClassNames, onlyChatSidebarRuleClassNames);
+  const centerListClassName = (0, _last.default)(onlyNavSidebarRuleClassNames) === (0, _last.default)(onlyChatSidebarRuleClassNames) ? (0, _last.default)(onlyNavSidebarRuleClassNames) : null;
+  if (chatSidebarClassNames.length !== 1 || navSidebarClassNames.length !== 1 || !centerListClassName) {
+    _logger.default.error(new Error('Failed to find sidebar classnames'), {
       onlyNavSidebarRuleClassNames,
       onlyChatSidebarRuleClassNames,
       chatSidebarClassNames,
       navSidebarClassNames,
-      centerListClassName,
+      centerListClassName
     });
   }
-
   return {
     chat: chatSidebarClassNames[0],
     nav: navSidebarClassNames[0],
-    centerList: centerListClassName,
+    centerList: centerListClassName
   };
 });
-
-export default getSidebarClassnames;
-
-function rulesToStyleRules(rule: CSSRule): Object[] {
+var _default = getSidebarClassnames;
+exports.default = _default;
+function rulesToStyleRules(rule) {
   if (rule instanceof window.CSSMediaRule) {
-    return flatMap(rule.cssRules, rulesToStyleRules);
+    return (0, _flatMap.default)(rule.cssRules, rulesToStyleRules);
   } else if (rule instanceof window.CSSStyleRule) {
     return [rule];
   }
   return [];
-}
+}

package/src/platform-implementation-js/dom-driver/inbox/getSidebarClassnames.test.js

@@ -1,8 +1,8 @@
-/* @flow */
+"use strict";
 
-import getSidebarClassnames from './getSidebarClassnames';
-
-(document.documentElement: any).innerHTML = `
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _getSidebarClassnames = _interopRequireDefault(require("./getSidebarClassnames"));
+document.documentElement.innerHTML = `
 <head>
 <style type="text/css">
 .blah {
@@ -64,11 +64,10 @@ import getSidebarClassnames from './getSidebarClassnames';
   </div>
 </body>
 `;
-
 test('works', () => {
-  expect(getSidebarClassnames()).toEqual({
+  expect((0, _getSidebarClassnames.default)()).toEqual({
     chat: 'm',
     nav: 'M',
-    centerList: 'bz',
+    centerList: 'bz'
   });
-});
+});

package/src/platform-implementation-js/dom-driver/inbox/gotoView.js

@@ -1,18 +1,16 @@
-/* @flow */
+"use strict";
 
-import includes from 'lodash/includes';
-import type InboxDriver from './inbox-driver';
-import populateRouteID from '../../lib/populateRouteID';
-import type { RouteParams } from '../../namespaces/router';
-import routeIDmatchesHash from '../../lib/routeIDmatchesHash';
-import { NATIVE_ROUTE_IDS } from '../../constants/router';
-
-export default function gotoView(
-  driver: InboxDriver,
-  routeID: string,
-  params: ?RouteParams
-): void {
-  if (includes(Object.values(NATIVE_ROUTE_IDS), routeID)) {
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = gotoView;
+var _includes = _interopRequireDefault(require("lodash/includes"));
+var _populateRouteID = _interopRequireDefault(require("../../lib/populateRouteID"));
+var _routeIDmatchesHash = _interopRequireDefault(require("../../lib/routeIDmatchesHash"));
+var _router = require("../../constants/router");
+function gotoView(driver, routeID, params) {
+  if ((0, _includes.default)(Object.values(_router.NATIVE_ROUTE_IDS), routeID)) {
     throw new Error('NativeRouteIDs are not currently supported in Inbox');
   }
   if (!driver.getCustomRouteIDs().has(routeID)) {
@@ -24,7 +22,7 @@ export default function gotoView(
     if (!params) {
       // If params were given, then we don't assume it was a resolved/populated URL
       for (let routeIDs of driver.getCustomRouteIDs()) {
-        if (routeIDmatchesHash(routeIDs, routeID)) {
+        if ((0, _routeIDmatchesHash.default)(routeIDs, routeID)) {
           foundRouteID = true;
           break;
         }
@@ -34,10 +32,8 @@ export default function gotoView(
       throw new Error(`Invalid routeID: ${routeID}`);
     }
     if (!startedWithHash) {
-      driver
-        .getLogger()
-        .deprecationWarning('Router.goto resolved routeID without "#" prefix');
+      driver.getLogger().deprecationWarning('Router.goto resolved routeID without "#" prefix');
     }
   }
-  document.location.hash = populateRouteID(routeID, params);
-}
+  document.location.hash = (0, _populateRouteID.default)(routeID, params);
+}

package/src/platform-implementation-js/dom-driver/inbox/gotoView.test.js

@@ -1,29 +1,28 @@
-/* @flow */
+"use strict";
 
-import gotoView from './gotoView';
-
-function makeDriver(): any {
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _gotoView = _interopRequireDefault(require("./gotoView"));
+function makeDriver() {
   const customRouteIDs = new Set();
   return {
-    getCustomRouteIDs: () => customRouteIDs,
+    getCustomRouteIDs: () => customRouteIDs
   };
 }
-
 test('works for custom view', () => {
   const driver = makeDriver();
   driver.getCustomRouteIDs().add('example/:bar');
-  gotoView(driver, 'example/:bar', { bar: 'foo' });
+  (0, _gotoView.default)(driver, 'example/:bar', {
+    bar: 'foo'
+  });
   expect(document.location.hash).toBe('#example/foo');
 });
-
 test('fails for unknown route id', () => {
-  expect(() =>
-    gotoView(makeDriver(), 'example/:bar', { bar: 'foo' })
-  ).toThrowError('Invalid routeID: example/:bar');
+  expect(() => (0, _gotoView.default)(makeDriver(), 'example/:bar', {
+    bar: 'foo'
+  })).toThrowError('Invalid routeID: example/:bar');
 });
-
 test('fails for native route ids', () => {
-  expect(() =>
-    gotoView(makeDriver(), 'inbox/:threadID', { threadID: 'abc' })
-  ).toThrowError('NativeRouteIDs are not currently supported in Inbox');
-});
+  expect(() => (0, _gotoView.default)(makeDriver(), 'inbox/:threadID', {
+    threadID: 'abc'
+  })).toThrowError('NativeRouteIDs are not currently supported in Inbox');
+});

package/src/platform-implementation-js/dom-driver/inbox/inbox-butter-bar-driver.js

@@ -1,94 +1,90 @@
-/* @flow */
-
-import Kefir from 'kefir';
-
-import streamWaitFor from '../../lib/stream-wait-for';
-import querySelector from '../../lib/dom/querySelectorOrFail';
-import makeMutationObserverChunkedStream from '../../lib/dom/make-mutation-observer-chunked-stream';
-
-const elements = streamWaitFor(() =>
-  document.querySelector(
-    'body > div[id][jsaction] > div[id] > div[class][jsaction][aria-hidden]'
-  )
-)
-  .map((googleNotice: HTMLElement) => {
-    const noticeContainer = googleNotice.parentElement;
-    if (!noticeContainer) throw new Error('Should not happen');
-    let sdkNotice = noticeContainer.querySelector('.inboxsdk__butterbar');
-    if (!sdkNotice) {
-      sdkNotice = document.createElement('div');
-      sdkNotice.className = googleNotice.className + ' inboxsdk__butterbar';
-      sdkNotice.style.display = 'none';
-      noticeContainer.insertBefore(sdkNotice, googleNotice.nextSibling);
-    }
-    return { noticeContainer, googleNotice, sdkNotice };
-  })
-  .toProperty();
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _kefir = _interopRequireDefault(require("kefir"));
+var _streamWaitFor = _interopRequireDefault(require("../../lib/stream-wait-for"));
+var _querySelectorOrFail = _interopRequireDefault(require("../../lib/dom/querySelectorOrFail"));
+var _makeMutationObserverChunkedStream = _interopRequireDefault(require("../../lib/dom/make-mutation-observer-chunked-stream"));
+const elements = (0, _streamWaitFor.default)(() => document.querySelector('body > div[id][jsaction] > div[id] > div[class][jsaction][aria-hidden]')).map(googleNotice => {
+  const noticeContainer = googleNotice.parentElement;
+  if (!noticeContainer) throw new Error('Should not happen');
+  let sdkNotice = noticeContainer.querySelector('.inboxsdk__butterbar');
+  if (!sdkNotice) {
+    sdkNotice = document.createElement('div');
+    sdkNotice.className = googleNotice.className + ' inboxsdk__butterbar';
+    sdkNotice.style.display = 'none';
+    noticeContainer.insertBefore(sdkNotice, googleNotice.nextSibling);
+  }
+  return {
+    noticeContainer,
+    googleNotice,
+    sdkNotice
+  };
+}).toProperty();
 
 // We queue our notices separately from the native ones in Inbox.
 
-const sdkNoticeIdChanges = elements.flatMapLatest(({ sdkNotice }) =>
-  makeMutationObserverChunkedStream(sdkNotice, {
+const sdkNoticeIdChanges = elements.flatMapLatest(_ref => {
+  let {
+    sdkNotice
+  } = _ref;
+  return (0, _makeMutationObserverChunkedStream.default)(sdkNotice, {
     attributes: true,
-    attributeFilter: ['data-inboxsdk-id'],
-  }).map(() => sdkNotice.getAttribute('data-inboxsdk-id'))
-);
-
-const sdkRemovedNotice = sdkNoticeIdChanges.filter((id) => id == null);
-
+    attributeFilter: ['data-inboxsdk-id']
+  }).map(() => sdkNotice.getAttribute('data-inboxsdk-id'));
+});
+const sdkRemovedNotice = sdkNoticeIdChanges.filter(id => id == null);
 const noticeAvailableStream = sdkRemovedNotice;
-
 function hideMessage(noticeContainer, googleNotice, sdkNotice) {
   Object.assign(sdkNotice.style, {
     opacity: '0',
     transform: '',
-    transition: 'opacity 100ms',
+    transition: 'opacity 100ms'
   });
   sdkNotice.removeAttribute('data-inboxsdk-id');
-  Kefir.fromEvents(sdkNotice, 'transitionend')
-    .merge(Kefir.later(200)) // transition might not finish if element is hidden
-    .takeUntilBy(sdkNoticeIdChanges.filter((id) => id != null))
-    .onValue(() => {
-      Object.assign(sdkNotice.style, {
-        display: 'none',
-        opacity: '',
-        transition: '',
-      });
+  _kefir.default.fromEvents(sdkNotice, 'transitionend').merge(_kefir.default.later(200)) // transition might not finish if element is hidden
+  .takeUntilBy(sdkNoticeIdChanges.filter(id => id != null)).onValue(() => {
+    Object.assign(sdkNotice.style, {
+      display: 'none',
+      opacity: '',
+      transition: ''
     });
+  });
 }
-
-export default class InboxButterBarDriver {
+class InboxButterBarDriver {
   constructor() {
     // Force stream to be in active state. sdkRemovedNotice is prone to missing
     // events if it only becomes active once a message has started.
     noticeAvailableStream.onValue(() => {});
   }
-
-  getNoticeAvailableStream(): Kefir.Observable<any> {
+  getNoticeAvailableStream() {
     return noticeAvailableStream;
   }
-
-  getSharedMessageQueue(): Array<Object> {
-    const attr = (document.head: any).getAttribute(
-      'data-inboxsdk-butterbar-queue'
-    );
+  getSharedMessageQueue() {
+    const attr = document.head.getAttribute('data-inboxsdk-butterbar-queue');
     return attr ? JSON.parse(attr) : [];
   }
-
-  setSharedMessageQueue(queue: Object) {
+  setSharedMessageQueue(queue) {
     const attr = JSON.stringify(queue);
-    (document.head: any).setAttribute('data-inboxsdk-butterbar-queue', attr);
+    document.head.setAttribute('data-inboxsdk-butterbar-queue', attr);
   }
 
   // Immediately displays the message, overriding anything else on the screen.
   // Priority and queuing logic is handled by butter-bar.js above this.
-  showMessage(rawOptions: Object): { destroy(): void } {
+  showMessage(rawOptions) {
     const instanceId = Date.now() + '-' + Math.random();
-
-    elements.take(1).onValue(({ noticeContainer, googleNotice, sdkNotice }) => {
+    elements.take(1).onValue(_ref2 => {
+      let {
+        noticeContainer,
+        googleNotice,
+        sdkNotice
+      } = _ref2;
       sdkNotice.className = googleNotice.className;
       sdkNotice.classList.add('inboxsdk__butterbar');
-
       if (rawOptions.html) {
         sdkNotice.innerHTML = rawOptions.html;
       } else if (rawOptions.el) {
@@ -97,60 +93,56 @@ export default class InboxButterBarDriver {
       } else {
         sdkNotice.textContent = rawOptions.text;
       }
-
       if (rawOptions.className) {
         sdkNotice.classList.add(rawOptions.className);
       }
 
       // If the sdkNotice is already up, just flash it out and in instead of
       // animating it up into position.
-      if (
-        sdkNotice.style.display === 'block' &&
-        getComputedStyle(sdkNotice).opacity === '1'
-      ) {
+      if (sdkNotice.style.display === 'block' && getComputedStyle(sdkNotice).opacity === '1') {
         Object.assign(sdkNotice.style, {
           opacity: '0',
           transform: 'none',
-          transition: 'none',
+          transition: 'none'
         });
         sdkNotice.offsetHeight; // force relayout
         Object.assign(sdkNotice.style, {
           opacity: '1',
-          transition: '',
+          transition: ''
         });
       } else {
         Object.assign(sdkNotice.style, {
           opacity: '0',
           transform: '',
           transition: '',
-          display: 'block',
+          display: 'block'
         });
         sdkNotice.offsetHeight; // force relayout
         Object.assign(sdkNotice.style, {
           opacity: '1',
-          transform: 'none',
+          transform: 'none'
         });
       }
-
       sdkNotice.setAttribute('data-inboxsdk-id', instanceId);
     });
-
     return {
       destroy() {
-        elements
-          .take(1)
-          .onValue(({ noticeContainer, googleNotice, sdkNotice }) => {
-            if (sdkNotice.getAttribute('data-inboxsdk-id') === instanceId) {
-              if (rawOptions.className)
-                sdkNotice.classList.remove(rawOptions.className);
-              hideMessage(noticeContainer, googleNotice, sdkNotice);
-            }
-          });
-      },
+        elements.take(1).onValue(_ref3 => {
+          let {
+            noticeContainer,
+            googleNotice,
+            sdkNotice
+          } = _ref3;
+          if (sdkNotice.getAttribute('data-inboxsdk-id') === instanceId) {
+            if (rawOptions.className) sdkNotice.classList.remove(rawOptions.className);
+            hideMessage(noticeContainer, googleNotice, sdkNotice);
+          }
+        });
+      }
     };
   }
-
   hideGmailMessage() {
     // No-op in Inbox because we don't touch the native messages
   }
 }
+exports.default = InboxButterBarDriver;