Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@layerhq/web-xdk
Advanced tools
@layerhq/web-xdk - npm Package Compare versions
Comparing version 1.0.0-pre1.2 to 1.0.0-pre1.3
@@ -11,1 +11,6 @@ # Web XDK Change Log | ||
| * Fixes folder references | ||
| ## 1.0.0-pre1.3 | ||
| * Updates React adapter for React 16 | ||
| * Removes old nodejs support code; runs in browser only for now |
@@ -185,3 +185,4 @@ 'use strict'; | ||
| /* istanbul ignore next */ | ||
| var WS = typeof WebSocket === 'undefined' ? require('websocket').w3cwebsocket : WebSocket; | ||
| //const WS = typeof WebSocket === 'undefined' ? require('websocket').w3cwebsocket : WebSocket; | ||
| var WS = WebSocket; | ||
@@ -188,0 +189,0 @@ this._socket = new WS(url, WEBSOCKET_PROTOCOL); |
@@ -52,6 +52,2 @@ 'use strict'; | ||
| // Don't set xhr to window.XMLHttpRequest as it will bypass jasmine's | ||
| // ajax library | ||
| var Xhr = typeof window === 'undefined' ? require('xhr2') : null; | ||
| function parseLinkHeaders(linkHeader) { | ||
@@ -78,3 +74,3 @@ if (!linkHeader) return {}; | ||
| var startTime = Date.now(); | ||
| var req = Xhr ? new Xhr() : new XMLHttpRequest(); | ||
| var req = new XMLHttpRequest(); | ||
| var method = (request.method || 'GET').toUpperCase(); | ||
@@ -81,0 +77,0 @@ |
@@ -17,3 +17,3 @@ 'use strict'; | ||
| var version = '1.0.0-pre1.2'; | ||
| var version = '1.0.0-pre1.3'; | ||
@@ -20,0 +20,0 @@ function init(options) { |
@@ -21,3 +21,3 @@ 'use strict'; | ||
| var version = '1.0.0-pre1.2'; | ||
| var version = '1.0.0-pre1.3'; | ||
@@ -24,0 +24,0 @@ function init(options) { |
| 'use strict'; | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| var _base = require('../base'); | ||
@@ -7,8 +9,10 @@ | ||
| var _index = require('../../core/index'); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| var _index2 = _interopRequireDefault(_index); | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } | ||
| /** | ||
@@ -85,148 +89,170 @@ * Call this function to initialize all of the react components needed to handle the Layer UI for Web widgets. | ||
| libraryResult[className] = React.createClass({ | ||
| libraryResult[className] = function (_React$Component) { | ||
| _inherits(_class, _React$Component); | ||
| // hacky putting this here, but unable to provide a constructor in this environment and this is the only gaurenteed call. | ||
| getInitialState: function getInitialState() { | ||
| var _this = this; | ||
| function _class() { | ||
| _classCallCheck(this, _class); | ||
| if (this.props.replaceableContent && !this.replaceableContent) { | ||
| this.replaceableContent = {}; | ||
| Object.keys(this.props.replaceableContent).forEach(function (nodeName) { | ||
| var value = _this.props.replaceableContent[nodeName]; | ||
| if (typeof value === 'function' && !value.replaceableIsSetup) { | ||
| return _possibleConstructorReturn(this, (_class.__proto__ || Object.getPrototypeOf(_class)).apply(this, arguments)); | ||
| } | ||
| _this.replaceableContent[nodeName] = function (widget, parent) { | ||
| var result = value(widget); | ||
| if (result && !(result instanceof HTMLElement)) { | ||
| _createClass(_class, [{ | ||
| key: 'getInitialState', | ||
| // React does bad stuff if you give it a component without children to ReactDom.render() | ||
| if (!result.props.children) { | ||
| result = React.createElement('div', null, result); | ||
| // hacky putting this here, but unable to provide a constructor in this environment and this is the only gaurenteed call. | ||
| value: function getInitialState() { | ||
| var _this2 = this; | ||
| if (this.props.replaceableContent && !this.replaceableContent) { | ||
| this.replaceableContent = {}; | ||
| Object.keys(this.props.replaceableContent).forEach(function (nodeName) { | ||
| var value = _this2.props.replaceableContent[nodeName]; | ||
| if (typeof value === 'function' && !value.replaceableIsSetup) { | ||
| _this2.replaceableContent[nodeName] = function (widget, parent) { | ||
| var result = value(widget); | ||
| if (result && !(result instanceof HTMLElement)) { | ||
| // React does bad stuff if you give it a component without children to ReactDom.render() | ||
| if (!result.props.children) { | ||
| result = React.createElement('div', null, result); | ||
| } | ||
| // Render it | ||
| var tmpNode = parent || document.createElement('div'); | ||
| widget.addEventListener('layer-widget-destroyed', function () { | ||
| return ReactDom.unmountComponentAtNode(tmpNode); | ||
| }); | ||
| return ReactDom.render(result, tmpNode); | ||
| } else { | ||
| return result; | ||
| } | ||
| // Render it | ||
| var tmpNode = parent || document.createElement('div'); | ||
| widget.addEventListener('layer-widget-destroyed', function () { | ||
| return ReactDom.unmountComponentAtNode(tmpNode); | ||
| }); | ||
| return ReactDom.render(result, tmpNode); | ||
| } else { | ||
| return result; | ||
| } | ||
| }; | ||
| } | ||
| }); | ||
| }; | ||
| } | ||
| }); | ||
| } | ||
| return null; | ||
| } | ||
| return null; | ||
| }, | ||
| /** | ||
| * On mounting, copy in all properties, and optionally setup a Query. | ||
| * | ||
| * Delay added to prevent Webcomponents property setters from being blown away in safari and firefox | ||
| */ | ||
| /** | ||
| * On mounting, copy in all properties, and optionally setup a Query. | ||
| * | ||
| * Delay added to prevent Webcomponents property setters from being blown away in safari and firefox | ||
| */ | ||
| componentDidMount: function componentDidMount() { | ||
| var _this2 = this; | ||
| }, { | ||
| key: 'componentDidMount', | ||
| value: function componentDidMount() { | ||
| var _this3 = this; | ||
| this.node.componentDidMount = true; | ||
| // Get the properties/attributes that match those used in this.props | ||
| var props = component.properties.filter(function (property) { | ||
| return property.propertyName in _this2.props || property.attributeName in _this2.props; | ||
| }); | ||
| this.node.componentDidMount = true; | ||
| // Get the properties/attributes that match those used in this.props | ||
| var props = component.properties.filter(function (property) { | ||
| return property.propertyName in _this3.props || property.attributeName in _this3.props; | ||
| }); | ||
| // Set the webcomponent properties | ||
| props.forEach(function (propDef) { | ||
| var value = propDef.propertyName in _this2.props ? _this2.props[propDef.propertyName] : _this2.props[propDef.attributeName]; | ||
| if (propDef.propertyName === 'replaceableContent' && _this2.replaceableContent) value = _this2.replaceableContent; | ||
| if (propDef.type === HTMLElement && value) { | ||
| value = _this2.handleReactDom(propDef, value); | ||
| // Set the webcomponent properties | ||
| props.forEach(function (propDef) { | ||
| var value = propDef.propertyName in _this3.props ? _this3.props[propDef.propertyName] : _this3.props[propDef.attributeName]; | ||
| if (propDef.propertyName === 'replaceableContent' && _this3.replaceableContent) value = _this3.replaceableContent; | ||
| if (propDef.type === HTMLElement && value) { | ||
| value = _this3.handleReactDom(propDef, value); | ||
| } | ||
| if (!_this3.node.properties) _this3.node.properties = {}; | ||
| if (!_this3.node.properties._internalState) { | ||
| _this3.node.properties[propDef.propertyName] = value; | ||
| } else { | ||
| _this3.node[propDef.propertyName] = value; | ||
| } | ||
| }); | ||
| // Browsers running the polyfil may not yet have initialized the component at this point. | ||
| // Force them to be initialized so that by the time the parent component's didComponentMount | ||
| // is called, this will be an initialized widget. | ||
| if (!this.node._onAfterCreate) { | ||
| var evt = document.createEvent('CustomEvent'); | ||
| evt.initCustomEvent('HTMLImportsLoaded', true, true, null); | ||
| document.dispatchEvent(evt); | ||
| } | ||
| if (!_this2.node.properties) _this2.node.properties = {}; | ||
| if (!_this2.node.properties._internalState) { | ||
| _this2.node.properties[propDef.propertyName] = value; | ||
| } else { | ||
| _this2.node[propDef.propertyName] = value; | ||
| } | ||
| }); | ||
| // Browsers running the polyfil may not yet have initialized the component at this point. | ||
| // Force them to be initialized so that by the time the parent component's didComponentMount | ||
| // is called, this will be an initialized widget. | ||
| if (!this.node._onAfterCreate) { | ||
| var evt = document.createEvent('CustomEvent'); | ||
| evt.initCustomEvent('HTMLImportsLoaded', true, true, null); | ||
| document.dispatchEvent(evt); | ||
| // The webcomponents polyfil is unable to initilize a component thats in | ||
| // a DocumentFragment so it must follow a more typical lifecycle | ||
| if (this.node._onAfterCreate) this.node._onAfterCreate(); | ||
| } | ||
| // The webcomponents polyfil is unable to initilize a component thats in | ||
| // a DocumentFragment so it must follow a more typical lifecycle | ||
| if (this.node._onAfterCreate) this.node._onAfterCreate(); | ||
| }, | ||
| /** | ||
| * Copy all properties into the dom node, but never let React recreate this widget. | ||
| */ | ||
| }, { | ||
| key: 'shouldComponentUpdate', | ||
| value: function shouldComponentUpdate(nextProps) { | ||
| var _this4 = this; | ||
| /** | ||
| * Copy all properties into the dom node, but never let React recreate this widget. | ||
| */ | ||
| shouldComponentUpdate: function shouldComponentUpdate(nextProps) { | ||
| var _this3 = this; | ||
| // Get the properties/attributes that match those used in this.props | ||
| var props = component.properties.filter(function (property) { | ||
| return _this4.props[property.propertyName] || _this4.props[property.attributeName]; | ||
| }); | ||
| // Get the properties/attributes that match those used in this.props | ||
| var props = component.properties.filter(function (property) { | ||
| return _this3.props[property.propertyName] || _this3.props[property.attributeName]; | ||
| }); | ||
| // Set the webcomponent properties if they have changed | ||
| props.forEach(function (propDef) { | ||
| var name = propDef.propertyName in _this4.props ? propDef.propertyName : propDef.attributeName; | ||
| var value = nextProps[name]; | ||
| if (propDef.propertyName === 'replaceableContent' && _this4.replaceableContent) value = _this4.replaceableContent; | ||
| if (propDef.type === HTMLElement && value) { | ||
| value = _this4.handleReactDom(propDef, value); | ||
| } | ||
| // Set the webcomponent properties if they have changed | ||
| props.forEach(function (propDef) { | ||
| var name = propDef.propertyName in _this3.props ? propDef.propertyName : propDef.attributeName; | ||
| var value = nextProps[name]; | ||
| if (propDef.propertyName === 'replaceableContent' && _this3.replaceableContent) value = _this3.replaceableContent; | ||
| if (propDef.type === HTMLElement && value) { | ||
| value = _this3.handleReactDom(propDef, value); | ||
| } | ||
| if (value !== _this4.props[name]) { | ||
| _this4.node[propDef.propertyName] = value; | ||
| } | ||
| }, this); | ||
| return false; | ||
| } | ||
| }, { | ||
| key: 'handleReactDom', | ||
| value: function handleReactDom(propDef, value) { | ||
| if (!this.layerUIGeneratedNodes) this.layerUIGeneratedNodes = {}; | ||
| if (value !== _this3.props[name]) { | ||
| _this3.node[propDef.propertyName] = value; | ||
| if (Array.isArray(value)) { | ||
| var array = []; | ||
| if (!this.layerUIGeneratedNodes[propDef.propertyName]) { | ||
| this.layerUIGeneratedNodes[propDef.propertyName] = array; | ||
| } | ||
| array.length = value.length; | ||
| value.forEach(function (item, index) { | ||
| if (item.tagName) { | ||
| array[index] = item; | ||
| } else { | ||
| var node = array[index] || document.createElement('div'); | ||
| ReactDom.render(typeof item === 'function' ? React.createElement(item) : item, node); | ||
| array[index] = node; | ||
| } | ||
| }); | ||
| } else if (value.tagName === undefined) { | ||
| if (!this.layerUIGeneratedNodes[propDef.propertyName]) { | ||
| this.layerUIGeneratedNodes[propDef.propertyName] = document.createElement('div'); | ||
| } | ||
| ReactDom.render(value, this.layerUIGeneratedNodes[propDef.propertyName]); | ||
| } | ||
| }, this); | ||
| return false; | ||
| }, | ||
| handleReactDom: function handleReactDom(propDef, value) { | ||
| if (!this.layerUIGeneratedNodes) this.layerUIGeneratedNodes = {}; | ||
| return this.layerUIGeneratedNodes[propDef.propertyName]; | ||
| } | ||
| }, { | ||
| key: 'render', | ||
| value: function render() { | ||
| var _this5 = this; | ||
| if (Array.isArray(value)) { | ||
| var array = []; | ||
| if (!this.layerUIGeneratedNodes[propDef.propertyName]) { | ||
| this.layerUIGeneratedNodes[propDef.propertyName] = array; | ||
| } | ||
| array.length = value.length; | ||
| value.forEach(function (item, index) { | ||
| if (item.tagName) { | ||
| array[index] = item; | ||
| } else { | ||
| var node = array[index] || document.createElement('div'); | ||
| ReactDom.render(typeof item === 'function' ? React.createElement(item) : item, node); | ||
| array[index] = node; | ||
| } | ||
| return React.createElement(componentName, { | ||
| ref: function ref(node) { | ||
| _this5.node = node; | ||
| }, | ||
| id: this.props.id, | ||
| children: this.props.children | ||
| }); | ||
| } else if (value.tagName === undefined) { | ||
| if (!this.layerUIGeneratedNodes[propDef.propertyName]) { | ||
| this.layerUIGeneratedNodes[propDef.propertyName] = document.createElement('div'); | ||
| } | ||
| ReactDom.render(value, this.layerUIGeneratedNodes[propDef.propertyName]); | ||
| } | ||
| return this.layerUIGeneratedNodes[propDef.propertyName]; | ||
| }, | ||
| render: function render() { | ||
| var _this4 = this; | ||
| }]); | ||
| return React.createElement(componentName, { | ||
| ref: function ref(node) { | ||
| _this4.node = node; | ||
| }, | ||
| id: this.props.id, | ||
| children: this.props.children | ||
| }); | ||
| } | ||
| }); | ||
| return _class; | ||
| }(React.Component); | ||
| }); | ||
@@ -233,0 +259,0 @@ return libraryResult; |
| { | ||
| "name": "@layerhq/web-xdk", | ||
| "version": "1.0.0-pre1.2", | ||
| "version": "1.0.0-pre1.3", | ||
| "description": "The Layer eXperience SDK for Web provides a library for talking to Layer Services, and a library of widgets to simplify adding chat capabilities into your application.", | ||
@@ -5,0 +5,0 @@ "main": "lib/index.js", |
@@ -152,3 +152,4 @@ /** | ||
| /* istanbul ignore next */ | ||
| const WS = typeof WebSocket === 'undefined' ? require('websocket').w3cwebsocket : WebSocket; | ||
| //const WS = typeof WebSocket === 'undefined' ? require('websocket').w3cwebsocket : WebSocket; | ||
| const WS = WebSocket; | ||
@@ -155,0 +156,0 @@ this._socket = new WS(url, WEBSOCKET_PROTOCOL); |
@@ -48,6 +48,2 @@ /** | ||
| // Don't set xhr to window.XMLHttpRequest as it will bypass jasmine's | ||
| // ajax library | ||
| const Xhr = (typeof window === 'undefined') ? require('xhr2') : null; | ||
| function parseLinkHeaders(linkHeader) { | ||
@@ -74,3 +70,3 @@ if (!linkHeader) return {}; | ||
| const startTime = Date.now(); | ||
| const req = Xhr ? new Xhr() : new XMLHttpRequest(); | ||
| const req = new XMLHttpRequest(); | ||
| const method = (request.method || 'GET').toUpperCase(); | ||
@@ -77,0 +73,0 @@ |
@@ -5,3 +5,3 @@ import Constants from './constants'; | ||
| const version = '1.0.0-pre1.2'; | ||
| const version = '1.0.0-pre1.3'; | ||
@@ -8,0 +8,0 @@ function init(options) { |
@@ -6,3 +6,3 @@ import Constants from './constants'; | ||
| const version = '1.0.0-pre1.2'; | ||
| const version = '1.0.0-pre1.3'; | ||
@@ -9,0 +9,0 @@ function init(options) { |
| import layerUI from '../base'; | ||
| import Layer from '../../core/index'; | ||
@@ -77,3 +76,3 @@ /** | ||
| libraryResult[className] = React.createClass({ | ||
| libraryResult[className] = class extends React.Component { | ||
@@ -109,3 +108,3 @@ // hacky putting this here, but unable to provide a constructor in this environment and this is the only gaurenteed call. | ||
| return null; | ||
| }, | ||
| } | ||
@@ -152,3 +151,3 @@ /** | ||
| }, | ||
| } | ||
@@ -177,3 +176,3 @@ /** | ||
| return false; | ||
| }, | ||
| } | ||
@@ -205,3 +204,3 @@ handleReactDom(propDef, value) { | ||
| return this.layerUIGeneratedNodes[propDef.propertyName]; | ||
| }, | ||
| } | ||
@@ -215,5 +214,4 @@ | ||
| }); | ||
| }, | ||
| }); | ||
| } | ||
| } | ||
| }); | ||
@@ -220,0 +218,0 @@ return libraryResult; |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.03%
6427033
- Lines of code
- increased by0.01%
133945
No dependency changes