expensify-common 1.0.1 → 2.0.2

package/{lib → dist}/jquery.expensifyIframify.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
  * This is a jQuery plugin that provides some iFrame functionality like
  * posting messages to the parent window.
@@ -15,8 +16,8 @@
  *     alert( data.msg );
  * });
  */
-
-export default {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
     /**
      * Loads the widget into jQuery
      *
@@ -38,7 +39,6 @@ export default {
          * @type {String} jQuery Element
          */
         const defaultOrigin = `${window.location.protocol}//${window.location.hostname}`;
-
         /**
          * This indicates from and to which domains we need to send the messages.
          * @type {Object}
@@ -54,40 +54,34 @@ export default {
             'https://www.google.com': ['https://secure.expensify.com.dev', 'https://secure.expensify.com'],
             'https://cdn.plaid.com': ['https://secure.expensify.com'],
         };
-
         /**
          * Holds a reference to the jQuery iFrame object
          *
          * @type {Object} jQuery Element
          */
-        let self = null;
-
+        let iframeElement = null; // eslint-disable-line consistent-this
         /**
          * Whether or not the parent window is listening to the message event
          *
          * @type {Boolean}
          */
         let parentIsListening = false;
-
         /**
          * Whether or not the plugin has been initialized
          * @type {Boolean}
          */
         let wasInitalized = false;
-
         /**
          * Whether or not the iframe is listening to the message event
          *
          * @type {Boolean}
          */
         let iframeIsListening = false;
-
         /**
          * Keeps a record of if this script is running from the "parent" or the "iframe"
          * so that we only have to do this logic once.
          */
         let whatIAm;
-
         /**
          * Default settings for our plugin
          *
@@ -95,30 +89,28 @@ export default {
          */
         let settings = {
             origin: defaultOrigin,
-            debug: false
+            debug: false,
         };
-
         /**
          * Holds all of our registered event handlers
          *
          * @type {Object}
          */
         let eventHandlers = {};
-
         /**
          * A method for logging things to the console for debugging
          */
         function log(...args) {
-            if (settings.debug) {
-                // Make an array out of our arguments
-                const mainArguments = Array.prototype.slice.call(args);
-                const source = whatIAm === 'parent' ? 'Parent' : 'Iframe';
-                mainArguments.unshift(`${source}:`);
-                mainArguments.unshift('[EXPENSIFYIFRAMEIFY]');
-                console.log(...mainArguments);
+            if (!settings.debug) {
+                return;
             }
+            // Make an array out of our arguments
+            const mainArguments = Array.prototype.slice.call(args);
+            const source = whatIAm === 'parent' ? 'Parent' : 'Iframe';
+            mainArguments.unshift(`${source}:`);
+            mainArguments.unshift('[EXPENSIFYIFRAMEIFY]');
+            console.log(...mainArguments); // eslint-disable-line no-console
         }
-
         /**
          * Forms the message to send to our parent. The message structure is like:
          *
@@ -141,25 +133,19 @@ export default {
          */
         function postMessage(name, data, postToIframe) {
             let msg = 'iframeify';
-            if (self.iframeId) {
-                msg += `:${self.iframeId}`;
+            if (iframeElement.iframeId) {
+                msg += `:${iframeElement.iframeId}`;
             }
-
             msg += `:${name}`;
-
             if (data) {
                 msg += '☢';
                 msg += JSON.stringify(data);
             }
-
             const isCommunicationAllowed = allowedCommunications[settings.origin];
-
             if (!isCommunicationAllowed) {
                 log('not posting message, communication from this domain is not allowed', settings.origin, name, data);
             }
-
             let targetOrigin;
-
             // Sending message from the iFrame to the parent
             // Only post a message if this is in an iFrame
             if (!postToIframe && window.parent !== window) {
@@ -167,15 +153,13 @@ export default {
                 log('posting message to parent', targetOrigin, msg);
                 window.parent.postMessage(msg, targetOrigin);
             }
-
             // Sending message from the parent to the iFrame
-            if (postToIframe && self[0].contentWindow) {
-                targetOrigin = `${self[0].contentWindow.location.protocol}//${self[0].contentWindow.location.hostname}`;
+            if (postToIframe && iframeElement[0].contentWindow) {
+                targetOrigin = `${iframeElement[0].contentWindow.location.protocol}//${iframeElement[0].contentWindow.location.hostname}`;
                 log('posting message to iframe', targetOrigin, msg);
-                self[0].contentWindow.postMessage(msg, targetOrigin);
+                iframeElement[0].contentWindow.postMessage(msg, targetOrigin);
             }
         }
-
         /**
          * Calls all the methods associated with the event name
          * and passes it the given data
@@ -186,7 +170,7 @@ export default {
          */
         function trigger(name, data, iframeId) {
             log(`heard event "${name}"`, data);
-            const id = iframeId || self.iframeId;
+            const id = iframeId || iframeElement.iframeId;
             if (eventHandlers[id] && eventHandlers[id][name] && eventHandlers[id][name].length) {
                 const listeners = eventHandlers[id][name];
                 for (let i = 0; i < listeners.length; i += 1) {
@@ -194,7 +178,6 @@ export default {
                 }
             }
         }
-
         /**
          * Handles the window message by parsing the data
          * and relaying it to our event listeners
@@ -207,60 +190,51 @@ export default {
             if (!event.origin || !event.target) {
                 return;
             }
-            if (allowedCommunications[event.origin]
-                && allowedCommunications[event.origin].indexOf('*') === -1
-                && allowedCommunications[event.origin].indexOf(`${event.target.location.protocol}//${event.target.location.hostname}`) === -1) {
+            if (allowedCommunications[event.origin] &&
+                allowedCommunications[event.origin].indexOf('*') === -1 &&
+                allowedCommunications[event.origin].indexOf(`${event.target.location.protocol}//${event.target.location.hostname}`) === -1) {
                 log('not handling message, communication from this domain is not allowed', settings.origin);
                 return;
             }
-
             if (!event.data || !_.isString(event.data)) {
                 return;
             }
-
             // Get the pieces of our message (should be two)
             const msgParts = event.data.split('☢');
-
             if (!msgParts.length) {
                 return;
             }
-
             // Get the pieces of our name (should be two or three)
             // and extract the event name and the iframe ID
             const nameParts = msgParts[0].split(':');
-
             if (!nameParts.length || nameParts.length > 3) {
                 return;
             }
-
             let iframeId = null;
             let eventName = null;
             let data = null;
             if (nameParts.length === 3) {
                 iframeId = nameParts[1];
                 eventName = nameParts[2];
-            } else if (nameParts.length === 2) {
+            }
+            else if (nameParts.length === 2) {
                 eventName = nameParts[1];
             }
-
             // Get the data
             if (msgParts.length > 1) {
                 try {
                     data = JSON.parse(msgParts[1]);
-                } catch (exception) {
+                }
+                catch (exception) {
                     // This should only happen if someone didn't code something right
                     console.error('Could not parse JSON response for some reason', event.data);
                 }
             }
-
             // Trigger any listeners for this event
             trigger(eventName, data, iframeId);
         }
-
         const actions = {
-
             // Add actions here
-
             /**
              * Tells the parent to dynamically resize the iFrame
              *
@@ -271,18 +245,14 @@ export default {
              */
             resize(args) {
                 const size = {};
-
                 if (args.height !== undefined) {
                     size.height = args.height;
                 }
-
                 if (args.width !== undefined) {
                     size.width = args.width;
                 }
-
                 postMessage('resize', size);
             },
-
             /**
              * Tell our parent a generic message
              *
@@ -293,7 +263,6 @@ export default {
             tellParent(args) {
                 postMessage(args.name, args.data);
             },
-
             /**
              * Tell our iFrame a generic message
              *
@@ -304,7 +273,6 @@ export default {
             tellIframe(args) {
                 postMessage(args.name, args.data, true);
             },
-
             /**
              * Register an event handler. The callback will be stored
              * for the particular iFrame ID so that you can listen to
@@ -315,17 +283,14 @@ export default {
              */
             on(name, callback) {
                 log(`listening to event "${name}"`);
-                if (!eventHandlers[self.iframeId]) {
-                    eventHandlers[self.iframeId] = {};
+                if (!eventHandlers[iframeElement.iframeId]) {
+                    eventHandlers[iframeElement.iframeId] = {};
                 }
-
-                if (!eventHandlers[self.iframeId][name]) {
-                    eventHandlers[self.iframeId][name] = [];
+                if (!eventHandlers[iframeElement.iframeId][name]) {
+                    eventHandlers[iframeElement.iframeId][name] = [];
                 }
-
-                eventHandlers[self.iframeId][name].push(callback);
+                eventHandlers[iframeElement.iframeId][name].push(callback);
             },
-
             /**
              * Unregister all handlers for an event. If name is null
              * then all handlers will be removed
@@ -334,24 +299,27 @@ export default {
              */
             off(name) {
                 log(`stop listening to event "${name}"`);
-                if (self.iframeId) {
-                    if (eventHandlers[self.iframeId]) {
+                if (iframeElement.iframeId) {
+                    if (eventHandlers[iframeElement.iframeId]) {
                         if (!name) {
-                            eventHandlers[self.iframeId] = {};
-                        } else {
-                            delete eventHandlers[self.iframeId][name];
+                            eventHandlers[iframeElement.iframeId] = {};
+                        }
+                        else {
+                            delete eventHandlers[iframeElement.iframeId][name];
                         }
                     }
-                } else if (!name) {
+                }
+                else if (!name) {
                     eventHandlers = {};
-                } else {
-                    $.each(eventHandlers, (i, obj) => {
+                }
+                else {
+                    const removeEventHandler = (obj) => {
                         const object = obj;
                         delete object[name];
-                    });
+                    };
+                    _.each(eventHandlers, removeEventHandler);
                 }
             },
-
             /**
              * Tears down the plugin by
              * - removing all event handlers
@@ -361,10 +329,9 @@ export default {
                 $(window).off('message', handleWindowMessage);
                 parentIsListening = false;
                 iframeIsListening = false;
-                self = null;
-            }
+                iframeElement = null;
+            },
         };
-
         /* eslint-disable no-param-reassign */
         /**
          * The method that we expose to jQuery. Is used to set options
@@ -383,23 +350,18 @@ export default {
             const domainArray = urlArray[1].split('.');
             const subdomain = domainArray.shift();
             const domainWithoutSubdomain = domainArray.join('.');
-
             // There are some browsers that don't support document.domain so we have to manually create it
             document.domain = domainWithoutSubdomain;
-            self = this;
-
+            iframeElement = this; // eslint-disable-line consistent-this
             if (!wasInitalized) {
                 // Determine if this is the parent, or the iframe
                 // Because our site runs inside of an iframe in salesforce, the parent
                 // will actually think it's an iframe too. So here, we detect that we're on
                 // the salesforce subdomain and we know that we should be the parent
-                whatIAm = (window.parent === window || subdomain === 'salesforce')
-                    ? 'parent'
-                    : 'iframe';
+                whatIAm = window.parent === window || subdomain === 'salesforce' ? 'parent' : 'iframe';
                 log('I am the:', whatIAm);
                 wasInitalized = true;
             }
-
             // The iframeId is pulled from the frameElement (if this is inside an iFrame)
             // or it's pulled from the element that this plugin was called from.
             //
@@ -407,18 +369,17 @@ export default {
             // $( '#myIframe' ).expensifyIframeify();
             //
             // 'myIframe' would be the frameId
-            self.iframeId = whatIAm === 'iframe' ? $(window.frameElement).attr('id') : self.attr('id');
-
+            iframeElement.iframeId = whatIAm === 'iframe' ? $(window.frameElement).attr('id') : iframeElement.attr('id');
             // Figure out if we are doing an action or setting options
             if (typeof actionOrOptions === 'string') {
                 if (typeof actions[actionOrOptions] !== 'undefined') {
                     actions[actionOrOptions](args, callback);
                 }
-            } else {
+            }
+            else {
                 // Extend our default settings
                 settings = $.extend(settings, actionOrOptions);
             }
-
             // If this is the parent page, then we can start listening to messages
             // from the iFrame
             if (whatIAm === 'parent' && !parentIsListening) {
@@ -426,7 +387,6 @@ export default {
                 parentIsListening = true;
                 log('parent is listening for messages');
             }
-
             // If this is the iFrame, then we can start listening to messages
             // from the iFrame
             if (whatIAm === 'iframe' && !iframeIsListening) {
@@ -434,9 +394,8 @@ export default {
                 iframeIsListening = true;
                 log('iframe is listening for messages');
             }
-
             // make this plugin chainable
             return this;
         };
-    }
+    },
 };

package/dist/mixins/PubSub.d.ts

@@ -0,0 +1,20 @@
+declare namespace _default {
+    function UNSAFE_componentWillMount(): void;
+    /**
+     * Registers an event listener for a PubSub event and keeps track of the event ID
+     * @param  {String}   name
+     * @param  {Function} callback
+     */
+    function subscribe(name: string, callback: Function): void;
+    /**
+     * Publish an event
+     * @param  {String} name
+     * @param  {Object} [data]
+     */
+    function publish(name: string, data?: Object | undefined): void;
+    /**
+     * When the component is unmounted, we want to subscribe from all of our event IDs
+     */
+    function componentWillUnmount(): void;
+}
+export default _default;

package/{lib/mixins/PubSub.jsx → dist/mixins/PubSub.js}

@@ -1,8 +1,12 @@
-import _ from 'underscore';
-import PubSubModule from '../PubSub';
-
-const PubSub = window.PubSub || PubSubModule;
-
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const underscore_1 = __importDefault(require("underscore"));
+const PubSub_1 = __importDefault(require("../PubSub"));
+const utils_1 = require("../utils");
+const PubSub = ((0, utils_1.isWindowAvailable)() && window.PubSub) || PubSub_1.default;
 /**
  * This mixin sets up automatic PubSub bindings which will be removed when
  * the component is unmounted.
@@ -17,11 +21,10 @@ const PubSub = window.PubSub || PubSubModule;
  *     }
  * });
  */
-export default {
+exports.default = {
     UNSAFE_componentWillMount() {
         this.eventIds = [];
     },
-
     /**
      * Registers an event listener for a PubSub event and keeps track of the event ID
      * @param  {String}   name
@@ -30,7 +33,6 @@ export default {
     subscribe(name, callback) {
         this.eventIds.push(PubSub.subscribe(name, callback, this));
     },
-
     /**
      * Publish an event
      * @param  {String} name
@@ -39,11 +41,10 @@ export default {
     publish(name, data) {
         PubSub.publish(name, data || {});
     },
-
     /**
      * When the component is unmounted, we want to subscribe from all of our event IDs
      */
     componentWillUnmount() {
-        _.each(this.eventIds, _.bind(PubSub.unsubscribe, PubSub));
-    }
+        underscore_1.default.each(this.eventIds, underscore_1.default.bind(PubSub.unsubscribe, PubSub));
+    },
 };

package/dist/mixins/extraClasses.d.ts

@@ -0,0 +1,8 @@
+declare namespace _default {
+    namespace propTypes {
+        let extraClasses: any;
+    }
+    function UNSAFE_componentWillReceiveProps(nextProps: any): void;
+    function getInitialState(): any;
+}
+export default _default;

package/{lib → dist}/mixins/extraClasses.js

@@ -1,5 +1,6 @@
+"use strict";
 /* global React */
-
+Object.defineProperty(exports, "__esModule", { value: true });
 /**
  * This mixin adds the ability to specify an `extraClasses` property
  * on a component that is added to any default classes that the component uses.
@@ -22,22 +23,17 @@
  *     return <Div extraClasses={['large', 'primary']} />;
  * }
  */
-export default {
+const utils_1 = require("../utils");
+exports.default = {
     propTypes: {
-        extraClasses: window.PropTypes.oneOfType([
-            window.PropTypes.string,
-            window.PropTypes.array,
-            window.PropTypes.object,
-        ]),
+        extraClasses: (0, utils_1.isWindowAvailable)() && window.PropTypes.oneOfType([window.PropTypes.string, window.PropTypes.array, window.PropTypes.object]),
     },
-
     UNSAFE_componentWillReceiveProps(nextProps) {
-        this.setState({classes: React.classNames(this.defaultClasses || [], nextProps.extraClasses)});
+        this.setState({ classes: React.classNames(this.defaultClasses || [], nextProps.extraClasses) });
     },
-
     getInitialState() {
         return {
-            classes: React.classNames(this.defaultClasses || [], this.props.extraClasses)
+            classes: React.classNames(this.defaultClasses || [], this.props.extraClasses),
         };
-    }
+    },
 };

package/dist/mixins/validationClasses.d.ts

@@ -0,0 +1,12 @@
+declare namespace _default {
+    /**
+     * Clear the error state of this element
+     */
+    function clearError(): void;
+    function handleErrorStateUpdate(state: object): object;
+    /**
+     * Display the error state of this element
+     */
+    function showError(): void;
+}
+export default _default;

package/dist/mixins/validationClasses.js

@@ -0,0 +1,58 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const classnames_1 = __importDefault(require("classnames"));
+const CONST = __importStar(require("../CONST"));
+/**
+ * This mixin will add two methods to a component which are uses to add
+ * and remove the error class from the component. Used great with refs and
+ * form elements. You can see how it is used in component/list/item/formelement.jsx
+ */
+exports.default = {
+    /**
+     * Clear the error state of this element
+     */
+    clearError() {
+        this.setState(this.getInitialState());
+    },
+    /**
+     * Update the error state of this element
+     *
+     * @param {object} state - The current state of the component.
+     * @returns {object} The updated state with modified classes.
+     */
+    handleErrorStateUpdate: (state) => ({
+        classes: (0, classnames_1.default)(state.classes, CONST.UI.ERROR),
+    }),
+    /**
+     * Display the error state of this element
+     */
+    showError() {
+        this.setState(this.handleErrorStateUpdate);
+    },
+};