Comparing version 1.6.7 to 2.0.0-alpha.1
247
extra.js
@@ -1,11 +0,29 @@ | ||
'use strict'; | ||
import ease from 'rx-ease'; | ||
import { BehaviorSubject, Observable, combineLatest, from, of } from 'rxjs'; | ||
import { map } from 'rxjs/operators'; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { | ||
return typeof obj; | ||
} : function (obj) { | ||
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; | ||
}; | ||
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } | ||
var ease = _interopDefault(require('rx-ease')); | ||
var rxjs = require('rxjs'); | ||
require('rxjs/operators'); | ||
var defineProperty = function (obj, key, value) { | ||
@@ -60,6 +78,39 @@ if (key in obj) { | ||
var slicedToArray = function () { | ||
function sliceIterator(arr, i) { | ||
var _arr = []; | ||
var _n = true; | ||
var _d = false; | ||
var _e = undefined; | ||
try { | ||
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { | ||
_arr.push(_s.value); | ||
if (i && _arr.length === i) break; | ||
} | ||
} catch (err) { | ||
_d = true; | ||
_e = err; | ||
} finally { | ||
try { | ||
if (!_n && _i["return"]) _i["return"](); | ||
} finally { | ||
if (_d) throw _e; | ||
} | ||
} | ||
return _arr; | ||
} | ||
return function (arr, i) { | ||
if (Array.isArray(arr)) { | ||
return arr; | ||
} else if (Symbol.iterator in Object(arr)) { | ||
return sliceIterator(arr, i); | ||
} else { | ||
throw new TypeError("Invalid attempt to destructure non-iterable instance"); | ||
} | ||
}; | ||
}(); | ||
@@ -75,2 +126,5 @@ | ||
var toConsumableArray = function (arr) { | ||
@@ -86,2 +140,16 @@ if (Array.isArray(arr)) { | ||
var compose = function compose() { | ||
for (var _len = arguments.length, fns = Array(_len), _key = 0; _key < _len; _key++) { | ||
fns[_key] = arguments[_key]; | ||
} | ||
return function (x) { | ||
return fns.reduceRight(function (value, f) { | ||
return f(value); | ||
}, x); | ||
}; | ||
}; | ||
var curry = function curry(f) { | ||
@@ -103,4 +171,86 @@ return function () { | ||
var mapValues = curry(function (f, obj) { | ||
return Object.keys(obj).reduce(function (acc, k) { | ||
return _extends({}, acc, defineProperty({}, k, f(obj[k], k))); | ||
}, {}); | ||
}); | ||
var isObject = function isObject(x) { | ||
return (typeof x === 'undefined' ? 'undefined' : _typeof(x)) === 'object' && x !== null; | ||
}; | ||
function _objectValues(obj) { | ||
var values = []; | ||
var keys = Object.keys(obj); | ||
for (var k = 0; k < keys.length; ++k) values.push(obj[keys[k]]); | ||
return values; | ||
} | ||
function _objectValues(obj) { | ||
var values = []; | ||
var keys = Object.keys(obj); | ||
for (var k = 0; k < keys.length; ++k) values.push(obj[keys[k]]); | ||
return values; | ||
} | ||
var isPromise = function isPromise(p) { | ||
return p && typeof p.then === 'function'; | ||
}; | ||
var isObservable = function isObservable(x) { | ||
return x && typeof x.subscribe === 'function'; | ||
}; | ||
var toObservable = function toObservable(x) { | ||
return isObservable(x) ? x : of(x); | ||
}; | ||
var switchMap = curry(function (switchMapper, stream) { | ||
var subscription = void 0; | ||
return new Observable(function (observer) { | ||
var isOuterStreamComplete = false; | ||
var isInnerStreamComplete = false; | ||
var sub = stream.subscribe({ | ||
next: function next(x) { | ||
if (subscription) subscription.unsubscribe(); | ||
subscription = switchMapper(x).subscribe({ | ||
error: function error(e) { | ||
return observer.error(e); | ||
}, | ||
next: function next(x) { | ||
return observer.next(x); | ||
}, | ||
complete: function complete() { | ||
isInnerStreamComplete = true; | ||
if (isOuterStreamComplete) observer.complete(); | ||
} | ||
}); | ||
}, | ||
error: function error(e) { | ||
return observer.error(e); | ||
}, | ||
complete: function complete() { | ||
isOuterStreamComplete = true; | ||
if (isInnerStreamComplete) observer.complete(); | ||
} | ||
}); | ||
return { | ||
unsubscribe: function unsubscribe() { | ||
if (subscription) subscription.unsubscribe(); | ||
sub.unsubscribe(); | ||
} | ||
}; | ||
}); | ||
}); | ||
// all :: [Observable a] -> Observable [a] | ||
var all = function all(obs) { | ||
return obs.length ? rxjs.combineLatest.apply(undefined, toConsumableArray(obs).concat([function () { | ||
return obs.length ? combineLatest.apply(undefined, toConsumableArray(obs.map(toObservable)).concat([function () { | ||
for (var _len = arguments.length, xs = Array(_len), _key = 0; _key < _len; _key++) { | ||
@@ -111,8 +261,32 @@ xs[_key] = arguments[_key]; | ||
return xs; | ||
}])) : rxjs.of([]); | ||
}])) : of([]); | ||
}; | ||
// combineLatestObject :: Object (Observable a) -> Observable (Object a) | ||
var combineLatestObject = function combineLatestObject(obj) { | ||
var keys = Object.keys(obj); | ||
return keys.length ? combineLatest.apply(undefined, toConsumableArray(keys.map(function (k) { | ||
return toObservable(obj[k]).pipe(map(function (v) { | ||
return [k, v]; | ||
})); | ||
})).concat([function () { | ||
for (var _len2 = arguments.length, entries = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { | ||
entries[_key2] = arguments[_key2]; | ||
} | ||
return entries.reduce(function (acc, _ref) { | ||
var _ref2 = slicedToArray(_ref, 2), | ||
k = _ref2[0], | ||
v = _ref2[1]; | ||
var raf = new rxjs.Observable(function (observer) { | ||
return _extends({}, acc, defineProperty({}, k, v)); | ||
}, {}); | ||
}])) : of(obj); | ||
}; | ||
var raf = new Observable(function (observer) { | ||
var isSubscribed = true; | ||
@@ -136,10 +310,51 @@ | ||
var mapValues = curry(function (f, obj) { | ||
return Object.keys(obj).reduce(function (acc, k) { | ||
return _extends({}, acc, defineProperty({}, k, f(obj[k], k))); | ||
}, {}); | ||
var applyIf = curry(function (predicate, f, v) { | ||
return predicate(v) ? f(v) : v; | ||
}); | ||
var ifObservable = applyIf(isObservable); | ||
var allIfObservable = applyIf(function (obs) { | ||
return obs.some(isObservable); | ||
}, all); | ||
var combineLatestObjectIfObservable = applyIf(function (obj) { | ||
return _objectValues(obj).some(isObservable); | ||
}, combineLatestObject); | ||
var defaultWith = function defaultWith(value) { | ||
var delayMs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 32; | ||
return function (stream) { | ||
return new Observable(function (observer) { | ||
var timeout = setTimeout(function () { | ||
return observer.next(value); | ||
}, delayMs); | ||
return stream.subscribe({ | ||
next: function next(x) { | ||
clearTimeout(timeout); | ||
observer.next(x); | ||
}, | ||
complete: function complete() { | ||
clearTimeout(timeout); | ||
observer.complete(); | ||
}, | ||
error: function error(e) { | ||
clearTimeout(timeout); | ||
observer.error(e); | ||
} | ||
}); | ||
}); | ||
}; | ||
}; | ||
var _flip = function _flip(ds) { | ||
return isObservable(ds) ? switchMap(compose(toObservable, _flip))(ds) : isPromise(ds) ? switchMap(compose(toObservable, _flip))(from(ds)) : Array.isArray(ds) ? allIfObservable(ds.map(compose(ifObservable(defaultWith(undefined)), _flip))) : isObject(ds) ? ds.type === 'Component' ? ds : combineLatestObjectIfObservable(mapValues(compose(ifObservable(defaultWith(undefined)), _flip), ds)) : ds; | ||
}; | ||
var flip = function flip(ds) { | ||
return toObservable(_flip(ds)); | ||
}; | ||
var createMutable = function createMutable(initialValue) { | ||
var sub = new rxjs.BehaviorSubject(initialValue); | ||
var sub = new BehaviorSubject(initialValue); | ||
sub.set = function (x) { | ||
@@ -155,4 +370,2 @@ return sub.next(typeof x === 'function' ? x(sub.value) : x); | ||
exports.ease = ease; | ||
exports.createState = createState; | ||
exports.all = all; | ||
export { ease, createState, all, flip }; |
@@ -1,11 +0,5 @@ | ||
'use strict'; | ||
import createTag from 'vdom-tag'; | ||
import { BehaviorSubject, Observable, combineLatest, from, of } from 'rxjs'; | ||
import { filter, map, share, shareReplay, startWith } from 'rxjs/operators'; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } | ||
var createTag = _interopDefault(require('vdom-tag')); | ||
var rxjs = require('rxjs'); | ||
var operators = require('rxjs/operators'); | ||
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { | ||
@@ -55,3 +49,16 @@ return typeof obj; | ||
var defineProperty = function (obj, key, value) { | ||
if (key in obj) { | ||
Object.defineProperty(obj, key, { | ||
value: value, | ||
enumerable: true, | ||
configurable: true, | ||
writable: true | ||
}); | ||
} else { | ||
obj[key] = value; | ||
} | ||
return obj; | ||
}; | ||
@@ -184,2 +191,70 @@ var _extends = Object.assign || function (target) { | ||
function _objectEntries(obj) { | ||
var entries = []; | ||
var keys = Object.keys(obj); | ||
for (var k = 0; k < keys.length; ++k) entries.push([keys[k], obj[keys[k]]]); | ||
return entries; | ||
} | ||
function _objectEntries(obj) { | ||
var entries = []; | ||
var keys = Object.keys(obj); | ||
for (var k = 0; k < keys.length; ++k) entries.push([keys[k], obj[keys[k]]]); | ||
return entries; | ||
} | ||
var fromEntries = function fromEntries(entries) { | ||
return entries.reduce(function (acc, _ref) { | ||
var _ref2 = slicedToArray(_ref, 2), | ||
key = _ref2[0], | ||
value = _ref2[1]; | ||
return _extends({}, acc, defineProperty({}, key, value)); | ||
}, {}); | ||
}; | ||
var pickBy = curry(function (predicate, obj) { | ||
return fromEntries(_objectEntries(obj).filter(function (_ref3) { | ||
var _ref4 = slicedToArray(_ref3, 2), | ||
key = _ref4[0], | ||
value = _ref4[1]; | ||
return predicate(value, key); | ||
})); | ||
}); | ||
var mapValues = curry(function (f, obj) { | ||
return Object.keys(obj).reduce(function (acc, k) { | ||
return _extends({}, acc, defineProperty({}, k, f(obj[k], k))); | ||
}, {}); | ||
}); | ||
var isObject = function isObject(x) { | ||
return (typeof x === 'undefined' ? 'undefined' : _typeof(x)) === 'object' && x !== null; | ||
}; | ||
function _objectValues(obj) { | ||
var values = []; | ||
var keys = Object.keys(obj); | ||
for (var k = 0; k < keys.length; ++k) values.push(obj[keys[k]]); | ||
return values; | ||
} | ||
function _objectValues(obj) { | ||
var values = []; | ||
var keys = Object.keys(obj); | ||
for (var k = 0; k < keys.length; ++k) values.push(obj[keys[k]]); | ||
return values; | ||
} | ||
var isPromise = function isPromise(p) { | ||
@@ -194,3 +269,3 @@ return p && typeof p.then === 'function'; | ||
var toObservable = function toObservable(x) { | ||
return isObservable(x) ? x : rxjs.of(x); | ||
return isObservable(x) ? x : of(x); | ||
}; | ||
@@ -201,3 +276,3 @@ | ||
return new rxjs.Observable(function (observer) { | ||
return new Observable(function (observer) { | ||
var isOuterStreamComplete = false; | ||
@@ -240,4 +315,5 @@ var isInnerStreamComplete = false; | ||
// all :: [Observable a] -> Observable [a] | ||
var all = function all(obs) { | ||
return obs.length ? rxjs.combineLatest.apply(undefined, toConsumableArray(obs).concat([function () { | ||
return obs.length ? combineLatest.apply(undefined, toConsumableArray(obs.map(toObservable)).concat([function () { | ||
for (var _len = arguments.length, xs = Array(_len), _key = 0; _key < _len; _key++) { | ||
@@ -248,8 +324,30 @@ xs[_key] = arguments[_key]; | ||
return xs; | ||
}])) : rxjs.of([]); | ||
}])) : of([]); | ||
}; | ||
// combineLatestObject :: Object (Observable a) -> Observable (Object a) | ||
var combineLatestObject = function combineLatestObject(obj) { | ||
var keys = Object.keys(obj); | ||
return keys.length ? combineLatest.apply(undefined, toConsumableArray(keys.map(function (k) { | ||
return toObservable(obj[k]).pipe(map(function (v) { | ||
return [k, v]; | ||
})); | ||
})).concat([function () { | ||
for (var _len2 = arguments.length, entries = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { | ||
entries[_key2] = arguments[_key2]; | ||
} | ||
return entries.reduce(function (acc, _ref) { | ||
var _ref2 = slicedToArray(_ref, 2), | ||
k = _ref2[0], | ||
v = _ref2[1]; | ||
return _extends({}, acc, defineProperty({}, k, v)); | ||
}, {}); | ||
}])) : of(obj); | ||
}; | ||
var blockComplete = function blockComplete() { | ||
return function (stream) { | ||
return new rxjs.Observable(function (observer) { | ||
return new Observable(function (observer) { | ||
return stream.subscribe({ | ||
@@ -268,3 +366,41 @@ complete: function complete() {}, | ||
var raf = new rxjs.Observable(function (observer) { | ||
var sample = curry(function (sampleStream, stream) { | ||
var none = Symbol('None'); | ||
return new Observable(function (observer) { | ||
var latestValue = none; | ||
var sub = stream.subscribe({ | ||
next: function next(value) { | ||
latestValue = value; | ||
}, | ||
complete: function complete() {}, | ||
error: function error(e) { | ||
return observer.error(e); | ||
} | ||
}); | ||
var sampleSub = sampleStream.subscribe({ | ||
next: function next() { | ||
if (latestValue !== none) { | ||
observer.next(latestValue); | ||
latestValue = none; | ||
} | ||
}, | ||
complete: function complete() { | ||
return observer.complete(); | ||
}, | ||
error: function error(e) { | ||
return observer.error(e); | ||
} | ||
}); | ||
return { | ||
unsubscribe: function unsubscribe() { | ||
sub.unsubscribe(); | ||
sampleSub.unsubscribe(); | ||
} | ||
}; | ||
}); | ||
}); | ||
var raf = new Observable(function (observer) { | ||
var isSubscribed = true; | ||
@@ -288,2 +424,49 @@ | ||
var applyIf = curry(function (predicate, f, v) { | ||
return predicate(v) ? f(v) : v; | ||
}); | ||
var ifObservable = applyIf(isObservable); | ||
var allIfObservable = applyIf(function (obs) { | ||
return obs.some(isObservable); | ||
}, all); | ||
var combineLatestObjectIfObservable = applyIf(function (obj) { | ||
return _objectValues(obj).some(isObservable); | ||
}, combineLatestObject); | ||
var defaultWith = function defaultWith(value) { | ||
var delayMs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 32; | ||
return function (stream) { | ||
return new Observable(function (observer) { | ||
var timeout = setTimeout(function () { | ||
return observer.next(value); | ||
}, delayMs); | ||
return stream.subscribe({ | ||
next: function next(x) { | ||
clearTimeout(timeout); | ||
observer.next(x); | ||
}, | ||
complete: function complete() { | ||
clearTimeout(timeout); | ||
observer.complete(); | ||
}, | ||
error: function error(e) { | ||
clearTimeout(timeout); | ||
observer.error(e); | ||
} | ||
}); | ||
}); | ||
}; | ||
}; | ||
var _flip = function _flip(ds) { | ||
return isObservable(ds) ? switchMap(compose(toObservable, _flip))(ds) : isPromise(ds) ? switchMap(compose(toObservable, _flip))(from(ds)) : Array.isArray(ds) ? allIfObservable(ds.map(compose(ifObservable(defaultWith(undefined)), _flip))) : isObject(ds) ? ds.type === 'Component' ? ds : combineLatestObjectIfObservable(mapValues(compose(ifObservable(defaultWith(undefined)), _flip), ds)) : ds; | ||
}; | ||
var flip = function flip(ds) { | ||
return toObservable(_flip(ds)); | ||
}; | ||
var noOp = function noOp() {}; | ||
@@ -300,3 +483,3 @@ | ||
var isEmpty = function isEmpty(x) { | ||
return x !== 0 && (!x || typeof x === 'string' && !x.trim()); | ||
return x !== 0 && (!x || typeof x === 'string' && !x.trim()) || Array.isArray(x) && !x.length; | ||
}; | ||
@@ -316,6 +499,6 @@ | ||
var flatten = function flatten(variable) { | ||
return Array.isArray(variable) ? all(variable.map(compose(operators.startWith(''), flatten))).pipe(blockComplete(), operators.filter(hasContent)) : isObservable(variable) ? switchMap(flatten, variable) : isPromise(variable) ? switchMap(flatten, rxjs.from(variable)) : toObservable(variable); | ||
return Array.isArray(variable) ? all(variable.map(compose(startWith(''), flatten))).pipe(filter(hasContent)) : isObservable(variable) ? switchMap(flatten, variable) : isPromise(variable) ? switchMap(flatten, from(variable)) : toObservable(variable); | ||
}; | ||
var sharedRaf = operators.share()(raf); | ||
var sharedRaf = share()(raf); | ||
@@ -333,3 +516,3 @@ // createReactiveTag | ||
return flatten(variables).pipe(operators.startWith([]), operators.sample(sharedRaf), operators.map(function (variables) { | ||
return flatten(variables).pipe(blockComplete(), startWith([]), sample(sharedRaf), map(function (variables) { | ||
return tagFunction.apply(undefined, [strings].concat(toConsumableArray(variables))); | ||
@@ -340,3 +523,13 @@ })); | ||
function _objectEntries(obj) { | ||
var flatMap = curry(function (f, xs) { | ||
return xs.reduce(function (acc, x) { | ||
return acc.concat(f(x)); | ||
}, []); | ||
}); | ||
var flatten$1 = flatMap(function (x) { | ||
return x; | ||
}); | ||
function _objectEntries$1(obj) { | ||
var entries = []; | ||
@@ -350,3 +543,3 @@ var keys = Object.keys(obj); | ||
function _objectEntries(obj) { | ||
function _objectEntries$1(obj) { | ||
var entries = []; | ||
@@ -360,3 +553,114 @@ var keys = Object.keys(obj); | ||
function updateStyle(node) { | ||
var sharedRaf$1 = share()(raf); | ||
var toStream = function toStream(component) { | ||
return flip(component).pipe(sample(sharedRaf$1)); | ||
}; | ||
// type Style = Map 'style' (Map String (String | Observable String)) | ||
// | ||
// type Attr = (Map String (String | Observable String)) | Style | ||
// | ||
// type Props = Map String a | ||
// | ||
// data Tree | ||
// = VNode { | ||
// attrs :: Attr, | ||
// children :: [Tree] | ||
// } | ||
// | VText { text :: String | Observable String } | ||
// | Component { name :: (Observable Props -> Observable Tree) } | ||
// | [Tree] | ||
// | Observable Tree | ||
// render :: Tree -> DOMElement -> () | ||
var render = function render(initialVTree, element) { | ||
var context = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
var _ref = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {}, | ||
_ref$isSvg = _ref.isSvg, | ||
isSvg = _ref$isSvg === undefined ? false : _ref$isSvg, | ||
_ref$morphNode = _ref.morphNode, | ||
morphNode = _ref$morphNode === undefined ? false : _ref$morphNode; | ||
var rootNode = morphNode ? element : element.firstChild; | ||
var previousTree = void 0; | ||
var component = typeof initialVTree === 'function' ? initialVTree(context) : initialVTree; | ||
var sub = toStream(component).subscribe({ | ||
next: function next(vTree) { | ||
if (vTree.type === 'VPatch') { | ||
previousTree = vTree.vTree; | ||
} else if (Array.isArray(vTree)) { | ||
if (!rootNode) { | ||
rootNode = element; | ||
updateChildren(rootNode, previousTree || [], vTree, isSvg, context); | ||
} else { | ||
updateChildren(rootNode, previousTree || [], vTree, isSvg, context); | ||
} | ||
previousTree = vTree; | ||
} else { | ||
if (!rootNode) { | ||
rootNode = _createElement(vTree, isSvg, context); | ||
element.innerHTML = ''; | ||
element.appendChild(rootNode); | ||
} else { | ||
rootNode = patch(rootNode, previousTree, vTree, isSvg, context); | ||
} | ||
previousTree = vTree; | ||
} | ||
} | ||
}); | ||
return { | ||
unsubscribe: function unsubscribe() { | ||
if (previousTree) _removeElement(previousTree, rootNode); | ||
sub.unsubscribe(); | ||
} | ||
}; | ||
}; | ||
var VText = function () { | ||
function VText(_ref2) { | ||
var text = _ref2.text; | ||
classCallCheck(this, VText); | ||
this.type = 'VText'; | ||
this.text = text; | ||
} | ||
createClass(VText, [{ | ||
key: 'createElement', | ||
value: function createElement() { | ||
return document.createTextNode(this.text); | ||
} | ||
}, { | ||
key: 'updateElement', | ||
value: function updateElement(node, previousText) { | ||
if (previousText.text !== this.text) node.textContent = this.text; | ||
} | ||
}, { | ||
key: 'removeElement', | ||
value: function removeElement() {} | ||
}, { | ||
key: 'mount', | ||
value: function mount() {} | ||
}]); | ||
return VText; | ||
}(); | ||
function isShallowEqual(obj1, obj2) { | ||
for (var k1 in obj1) { | ||
if (!(k1 in obj2) || obj1[k1] !== obj2[k1]) return false; | ||
} | ||
for (var k2 in obj2) { | ||
if (!(k2 in obj1) || obj1[k2] !== obj2[k2]) return false; | ||
} | ||
return true; | ||
} | ||
var updateStyle = function updateStyle(node) { | ||
var previousStyle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
@@ -375,19 +679,146 @@ var nextStyle = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
} | ||
} | ||
}; | ||
var updateEvents = function updateEvents(vTree, node, previousEvents) { | ||
var _iteratorNormalCompletion = true; | ||
var _didIteratorError = false; | ||
var _iteratorError = undefined; | ||
try { | ||
for (var _iterator = _objectEntries$1(vTree.events)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { | ||
var _ref3 = _step.value; | ||
var _ref4 = slicedToArray(_ref3, 2); | ||
var eventName = _ref4[0]; | ||
var handler = _ref4[1]; | ||
if (!previousEvents[eventName]) { | ||
node.addEventListener(eventName, handler); | ||
} else if (handler !== previousEvents[eventName]) { | ||
node.removeEventListener(eventName, previousEvents[eventName]); | ||
node.addEventListener(eventName, handler); | ||
} | ||
} | ||
} catch (err) { | ||
_didIteratorError = true; | ||
_iteratorError = err; | ||
} finally { | ||
try { | ||
if (!_iteratorNormalCompletion && _iterator.return) { | ||
_iterator.return(); | ||
} | ||
} finally { | ||
if (_didIteratorError) { | ||
throw _iteratorError; | ||
} | ||
} | ||
} | ||
var removedEventsEntries = _objectEntries$1(previousEvents).filter(function (_ref5) { | ||
var _ref6 = slicedToArray(_ref5, 1), | ||
key = _ref6[0]; | ||
return !vTree.events[key]; | ||
}); | ||
var _iteratorNormalCompletion2 = true; | ||
var _didIteratorError2 = false; | ||
var _iteratorError2 = undefined; | ||
try { | ||
for (var _iterator2 = removedEventsEntries[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { | ||
var _ref7 = _step2.value; | ||
var _ref8 = slicedToArray(_ref7, 2); | ||
var _eventName = _ref8[0]; | ||
var _handler = _ref8[1]; | ||
node.removeEventListener(_eventName, _handler); | ||
} | ||
} catch (err) { | ||
_didIteratorError2 = true; | ||
_iteratorError2 = err; | ||
} finally { | ||
try { | ||
if (!_iteratorNormalCompletion2 && _iterator2.return) { | ||
_iterator2.return(); | ||
} | ||
} finally { | ||
if (_didIteratorError2) { | ||
throw _iteratorError2; | ||
} | ||
} | ||
} | ||
}; | ||
var updateAttrs = function updateAttrs(vTree, node, previousAttrs) { | ||
for (var attrName in _extends({}, previousAttrs, vTree.attrs)) { | ||
var attrValue = vTree.attrs[attrName]; | ||
if (attrValue === previousAttrs[attrName]) { | ||
// no update needed | ||
} else if (!isEmpty(attrValue)) { | ||
if (attrName === 'style') { | ||
updateStyle(node, previousAttrs.style, vTree.attrs.style); | ||
} else if (attrName === 'value' && node.tagName === 'INPUT') { | ||
node.value = attrValue; | ||
} else { | ||
node.setAttribute(attrName, attrValue); | ||
} | ||
} else { | ||
if (attrName === 'value' && node.tagName === 'INPUT') { | ||
node.value = ''; | ||
} else { | ||
node.removeAttribute(attrName); | ||
} | ||
} | ||
} | ||
}; | ||
var updateChildren = function updateChildren(node, previousChildren, children, isSvg, context) { | ||
var flatChildren = flatten$1(children); | ||
var flatPreviousChildren = flatten$1(previousChildren); | ||
for (var index in flatChildren) { | ||
var childTree = flatChildren[index]; | ||
var previousChildTree = flatPreviousChildren[index]; | ||
var previousChildNode = node.childNodes[index]; | ||
if (!previousChildNode) { | ||
var childNode = _createElement(childTree, isSvg, context); | ||
node.appendChild(childNode); | ||
_mount(childTree, childNode); | ||
} else { | ||
patch(previousChildNode, previousChildTree, childTree, isSvg, context); | ||
} | ||
} | ||
for (var _index in [].slice.call(node.childNodes, flatChildren.length)) { | ||
var realIndex = parseInt(_index) + flatChildren.length; | ||
var _childTree = flatPreviousChildren[realIndex]; | ||
var _childNode = node.childNodes[realIndex]; | ||
if (_childNode) { | ||
_removeElement(_childTree, _childNode); | ||
_childNode.remove(); | ||
} | ||
} | ||
}; | ||
var VNode = function () { | ||
function VNode(_ref) { | ||
var name = _ref.name, | ||
_ref$attrs = _ref.attrs, | ||
attrs = _ref$attrs === undefined ? {} : _ref$attrs, | ||
_ref$lifecycle = _ref.lifecycle, | ||
lifecycle = _ref$lifecycle === undefined ? {} : _ref$lifecycle, | ||
_ref$events = _ref.events, | ||
events = _ref$events === undefined ? {} : _ref$events, | ||
_ref$children = _ref.children, | ||
children = _ref$children === undefined ? {} : _ref$children, | ||
_ref$key = _ref.key, | ||
key = _ref$key === undefined ? '' : _ref$key; | ||
function VNode(_ref9) { | ||
var name = _ref9.name, | ||
_ref9$attrs = _ref9.attrs, | ||
attrs = _ref9$attrs === undefined ? {} : _ref9$attrs, | ||
_ref9$lifecycle = _ref9.lifecycle, | ||
lifecycle = _ref9$lifecycle === undefined ? {} : _ref9$lifecycle, | ||
_ref9$events = _ref9.events, | ||
events = _ref9$events === undefined ? {} : _ref9$events, | ||
_ref9$children = _ref9.children, | ||
children = _ref9$children === undefined ? {} : _ref9$children, | ||
_ref9$key = _ref9.key, | ||
key = _ref9$key === undefined ? '' : _ref9$key; | ||
classCallCheck(this, VNode); | ||
this.type = 'VNode'; | ||
this.name = name; | ||
@@ -403,8 +834,8 @@ this.attrs = attrs; | ||
key: 'createElement', | ||
value: function createElement(isSvg, patch) { | ||
value: function createElement(isSvg, context) { | ||
var node = (isSvg = isSvg || this.name === 'svg') ? document.createElementNS('http://www.w3.org/2000/svg', this.name) : document.createElement(this.name); | ||
this.updateEvents(node, {}); | ||
this.updateAttrs(node, {}); | ||
this.updateChildren(node, [], isSvg, patch); | ||
updateEvents(this, node, {}); | ||
updateAttrs(this, node, {}); | ||
updateChildren(node, [], this.children, isSvg, context); | ||
@@ -415,10 +846,10 @@ return node; | ||
key: 'updateElement', | ||
value: function updateElement(node, previousTree, isSvg, patch) { | ||
value: function updateElement(node, previousTree, isSvg, context) { | ||
if (previousTree.name !== this.name) { | ||
previousTree.removeElement(node); | ||
return this.createElement(isSvg, patch); | ||
_removeElement(previousTree, node); | ||
return _createElement(this, isSvg, context); | ||
} else { | ||
this.updateEvents(node, previousTree.events); | ||
this.updateAttrs(node, previousTree.attrs); | ||
this.updateChildren(node, previousTree.children, isSvg, patch); | ||
updateEvents(this, node, previousTree.events); | ||
updateAttrs(this, node, previousTree.attrs); | ||
updateChildren(node, previousTree.children, this.children, isSvg, context); | ||
@@ -431,4 +862,4 @@ this.lifecycle.update(node); | ||
value: function removeElement(node) { | ||
this.children.map(function (child, index) { | ||
return child.removeElement(node.childNodes[index]); | ||
flatten$1(this.children).map(function (child, index) { | ||
return _removeElement(child, node.childNodes[index]); | ||
}); | ||
@@ -441,4 +872,4 @@ | ||
value: function mount(node) { | ||
this.children.map(function (child) { | ||
return child.mount(); | ||
flatten$1(this.children).map(function (child) { | ||
return _mount(child); | ||
}); | ||
@@ -448,131 +879,2 @@ | ||
} | ||
}, { | ||
key: 'updateEvents', | ||
value: function updateEvents(node, previousEvents) { | ||
var _this = this; | ||
var _iteratorNormalCompletion = true; | ||
var _didIteratorError = false; | ||
var _iteratorError = undefined; | ||
try { | ||
for (var _iterator = _objectEntries(this.events)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { | ||
var _ref2 = _step.value; | ||
var _ref3 = slicedToArray(_ref2, 2); | ||
var eventName = _ref3[0]; | ||
var handler = _ref3[1]; | ||
if (!previousEvents[eventName]) { | ||
node.addEventListener(eventName, handler); | ||
} else if (handler !== previousEvents[eventName]) { | ||
node.removeEventListener(eventName, previousEvents[eventName]); | ||
node.addEventListener(eventName, handler); | ||
} | ||
} | ||
} catch (err) { | ||
_didIteratorError = true; | ||
_iteratorError = err; | ||
} finally { | ||
try { | ||
if (!_iteratorNormalCompletion && _iterator.return) { | ||
_iterator.return(); | ||
} | ||
} finally { | ||
if (_didIteratorError) { | ||
throw _iteratorError; | ||
} | ||
} | ||
} | ||
var removedEventsEntries = _objectEntries(previousEvents).filter(function (_ref4) { | ||
var _ref5 = slicedToArray(_ref4, 1), | ||
key = _ref5[0]; | ||
return !_this.events[key]; | ||
}); | ||
var _iteratorNormalCompletion2 = true; | ||
var _didIteratorError2 = false; | ||
var _iteratorError2 = undefined; | ||
try { | ||
for (var _iterator2 = removedEventsEntries[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { | ||
var _ref6 = _step2.value; | ||
var _ref7 = slicedToArray(_ref6, 2); | ||
var _eventName = _ref7[0]; | ||
var _handler = _ref7[1]; | ||
node.removeEventListener(_eventName, _handler); | ||
} | ||
} catch (err) { | ||
_didIteratorError2 = true; | ||
_iteratorError2 = err; | ||
} finally { | ||
try { | ||
if (!_iteratorNormalCompletion2 && _iterator2.return) { | ||
_iterator2.return(); | ||
} | ||
} finally { | ||
if (_didIteratorError2) { | ||
throw _iteratorError2; | ||
} | ||
} | ||
} | ||
} | ||
}, { | ||
key: 'updateAttrs', | ||
value: function updateAttrs(node, previousAttrs) { | ||
for (var attrName in _extends({}, previousAttrs, this.attrs)) { | ||
var attrValue = this.attrs[attrName]; | ||
if (attrValue === previousAttrs[attrName]) { | ||
// no update needed | ||
} else if (!isEmpty(attrValue)) { | ||
if (attrName === 'style') { | ||
updateStyle(node, previousAttrs.style, this.attrs.style); | ||
} else if (attrName === 'value' && node.tagName === 'INPUT') { | ||
node.value = attrValue; | ||
} else { | ||
node.setAttribute(attrName, attrValue); | ||
} | ||
} else { | ||
if (attrName === 'value' && node.tagName === 'INPUT') { | ||
node.value = ''; | ||
} else { | ||
node.removeAttribute(attrName); | ||
} | ||
} | ||
} | ||
} | ||
}, { | ||
key: 'updateChildren', | ||
value: function updateChildren(node, previousChildren, isSvg, patch) { | ||
for (var index in this.children) { | ||
var childTree = this.children[index]; | ||
var previousChildTree = previousChildren[index]; | ||
var previousChildNode = node.childNodes[index]; | ||
if (!previousChildNode) { | ||
var childNode = childTree.createElement(isSvg, patch); | ||
node.appendChild(childNode); | ||
childTree.mount(childNode); | ||
} else { | ||
patch(previousChildNode, previousChildTree, childTree, isSvg); | ||
} | ||
} | ||
for (var _index in [].slice.call(node.childNodes, this.children.length)) { | ||
var realIndex = parseInt(_index) + this.children.length; | ||
var _childTree = previousChildren[realIndex]; | ||
var _childNode = node.childNodes[realIndex]; | ||
if (_childNode) { | ||
_childTree.removeElement(_childNode); | ||
_childNode.remove(); | ||
} | ||
} | ||
} | ||
}]); | ||
@@ -582,71 +884,8 @@ return VNode; | ||
var VText = function () { | ||
function VText(_ref) { | ||
var text = _ref.text; | ||
classCallCheck(this, VText); | ||
this.text = text; | ||
} | ||
createClass(VText, [{ | ||
key: "createElement", | ||
value: function createElement() { | ||
return document.createTextNode(this.text); | ||
} | ||
}, { | ||
key: "updateElement", | ||
value: function updateElement(node, previousText) { | ||
if (previousText.text !== this.text) node.textContent = this.text; | ||
} | ||
}, { | ||
key: "removeElement", | ||
value: function removeElement() {} | ||
}, { | ||
key: "mount", | ||
value: function mount() {} | ||
}]); | ||
return VText; | ||
}(); | ||
function createVTree(node) { | ||
return new VNode({ | ||
name: node.nodeName.toLowerCase(), | ||
lifecycle: createDefaultLifecycle(), | ||
events: {}, | ||
attrs: {}, | ||
untouchedAttributes: {}, | ||
children: Array.prototype.map.call(node.childNodes, function (node) { | ||
return node.nodeType === 3 // Node.TEXT_NODE | ||
? new VText({ text: node.nodeValue }) : createVTree(node); | ||
}) | ||
}); | ||
} | ||
function patch(node) { | ||
var previousTree = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : createVTree(node); | ||
var vTree = arguments[2]; | ||
var isSvg = arguments[3]; | ||
if (vTree.constructor !== previousTree.constructor || vTree.key !== previousTree.key) { | ||
previousTree.removeElement(node); | ||
var newNode = vTree.createElement(isSvg, patch); | ||
node.parentNode.replaceChild(newNode, node); | ||
vTree.mount(newNode); | ||
return newNode; | ||
} else { | ||
var _newNode = vTree.updateElement(node, previousTree, isSvg, patch); | ||
if (_newNode) { | ||
node.parentNode.replaceChild(_newNode, node); | ||
vTree.mount(_newNode, isSvg); | ||
return _newNode; | ||
} else { | ||
return node; | ||
} | ||
} | ||
} | ||
var VPatch = function () { | ||
function VPatch(vTree) { | ||
function VPatch(_ref10) { | ||
var vTree = _ref10.vTree; | ||
classCallCheck(this, VPatch); | ||
this.type = 'VPatch'; | ||
this.vTree = vTree; | ||
@@ -656,28 +895,36 @@ } | ||
createClass(VPatch, [{ | ||
key: "createElement", | ||
key: 'createElement', | ||
value: function createElement() { | ||
var _vTree; | ||
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { | ||
args[_key] = arguments[_key]; | ||
} | ||
return (_vTree = this.vTree).createElement.apply(_vTree, arguments); | ||
return _createElement.apply(undefined, [this.vTree].concat(args)); | ||
} | ||
}, { | ||
key: "updateElement", | ||
key: 'updateElement', | ||
value: function updateElement() { | ||
var _vTree2; | ||
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { | ||
args[_key2] = arguments[_key2]; | ||
} | ||
return (_vTree2 = this.vTree).updateElement.apply(_vTree2, arguments); | ||
return _updateElement.apply(undefined, [this.vTree].concat(args)); | ||
} | ||
}, { | ||
key: "removeElement", | ||
key: 'removeElement', | ||
value: function removeElement() { | ||
var _vTree3; | ||
for (var _len3 = arguments.length, args = Array(_len3), _key3 = 0; _key3 < _len3; _key3++) { | ||
args[_key3] = arguments[_key3]; | ||
} | ||
return (_vTree3 = this.vTree).removeElement.apply(_vTree3, arguments); | ||
return _removeElement.apply(undefined, [this.vTree].concat(args)); | ||
} | ||
}, { | ||
key: "mount", | ||
key: 'mount', | ||
value: function mount() { | ||
var _vTree4; | ||
for (var _len4 = arguments.length, args = Array(_len4), _key4 = 0; _key4 < _len4; _key4++) { | ||
args[_key4] = arguments[_key4]; | ||
} | ||
return (_vTree4 = this.vTree).mount.apply(_vTree4, arguments); | ||
return _mount.apply(undefined, [this.vTree].concat(args)); | ||
} | ||
@@ -688,4 +935,10 @@ }]); | ||
var pickNonObservables = function pickNonObservables(props) { | ||
return pickBy(function (_, key) { | ||
return !/\$$/.test(key); | ||
}, props); | ||
}; | ||
function createPropsStream(props) { | ||
var sub = new rxjs.BehaviorSubject(props); | ||
var sub = new BehaviorSubject(props); | ||
return { | ||
@@ -695,3 +948,7 @@ next: function next(props) { | ||
}, | ||
stream: sub | ||
stream: sub.pipe(switchMap(function (props) { | ||
return combineLatestObject(pickNonObservables(props)).pipe(map(function (values) { | ||
return _extends({}, props, values); | ||
})); | ||
}), shareReplay(1)) | ||
}; | ||
@@ -701,9 +958,10 @@ } | ||
var Component = function () { | ||
function Component(_ref) { | ||
var name = _ref.name, | ||
untouchedAttributes = _ref.untouchedAttributes, | ||
_ref$key = _ref.key, | ||
key = _ref$key === undefined ? '' : _ref$key; | ||
function Component(_ref11) { | ||
var name = _ref11.name, | ||
untouchedAttributes = _ref11.untouchedAttributes, | ||
_ref11$key = _ref11.key, | ||
key = _ref11$key === undefined ? '' : _ref11$key; | ||
classCallCheck(this, Component); | ||
this.type = 'Component'; | ||
this.name = name; | ||
@@ -716,5 +974,3 @@ this.untouchedAttributes = untouchedAttributes; | ||
key: 'createElement', | ||
value: function createElement(isSvg, patch) { | ||
var _this = this; | ||
value: function createElement(isSvg, context) { | ||
var node = isSvg ? document.createElementNS('http://www.w3.org/2000/svg', 'g') : document.createElement('div'); | ||
@@ -724,20 +980,10 @@ | ||
this.state.props = createPropsStream(this.untouchedAttributes); | ||
this.state.childTree = undefined; | ||
var vdomStream = this.name(this.state.props.stream); | ||
var vTree = this.name(this.state.props.stream); | ||
if (!vdomStream) throw new Error('Component ' + this.name.name + ' must return a stream!'); | ||
if (!vTree) throw new Error('Component ' + this.name.name + ' must return a stream!'); | ||
this.state.subscription = vdomStream.pipe(flatten, operators.sample(sharedRaf)).subscribe({ | ||
next: function next(newChildTree) { | ||
if (newChildTree instanceof VPatch) { | ||
_this.state.childTree = newChildTree.vTree; | ||
} else { | ||
node = patch(node, _this.state.childTree, newChildTree, isSvg); | ||
_this.state.childTree = newChildTree; | ||
} | ||
}, | ||
error: function error(e) { | ||
return console.error(e); | ||
} | ||
this.state.subscription = render(vTree, node, context, { | ||
isSvg: isSvg, | ||
morphNode: true | ||
}); | ||
@@ -749,10 +995,12 @@ | ||
key: 'updateElement', | ||
value: function updateElement(node, previousComponent, isSvg, patch) { | ||
value: function updateElement(node, previousComponent, isSvg, context) { | ||
this.state = previousComponent.state; | ||
if (previousComponent.name !== this.name) { | ||
previousComponent.removeElement(node); | ||
return this.createElement(isSvg, patch); | ||
_removeElement(previousComponent, node); | ||
return _createElement(this, isSvg, context); | ||
} else { | ||
this.state.props.next(this.untouchedAttributes); | ||
if (!isShallowEqual(previousComponent.untouchedAttributes, this.untouchedAttributes)) { | ||
this.state.props.next(this.untouchedAttributes); | ||
} | ||
} | ||
@@ -762,5 +1010,4 @@ } | ||
key: 'removeElement', | ||
value: function removeElement(node) { | ||
value: function removeElement() { | ||
this.state.subscription.unsubscribe(); | ||
if (this.state.childTree) this.state.childTree.removeElement(node); | ||
} | ||
@@ -774,9 +1021,81 @@ }, { | ||
var flatMap = curry(function (f, xs) { | ||
return xs.reduce(function (acc, x) { | ||
return acc.concat(f(x)); | ||
}, []); | ||
}); | ||
var classes = { | ||
VNode: VNode, | ||
VText: VText, | ||
Component: Component | ||
}; | ||
function _objectEntries$1(obj) { | ||
var _createElement = function _createElement(vTree) { | ||
for (var _len5 = arguments.length, args = Array(_len5 > 1 ? _len5 - 1 : 0), _key5 = 1; _key5 < _len5; _key5++) { | ||
args[_key5 - 1] = arguments[_key5]; | ||
} | ||
return classes[vTree.type].prototype.createElement.apply(vTree, args); | ||
}; | ||
var _mount = function _mount(vTree) { | ||
for (var _len6 = arguments.length, args = Array(_len6 > 1 ? _len6 - 1 : 0), _key6 = 1; _key6 < _len6; _key6++) { | ||
args[_key6 - 1] = arguments[_key6]; | ||
} | ||
return classes[vTree.type].prototype.mount.apply(vTree, args); | ||
}; | ||
var _updateElement = function _updateElement(vTree) { | ||
for (var _len7 = arguments.length, args = Array(_len7 > 1 ? _len7 - 1 : 0), _key7 = 1; _key7 < _len7; _key7++) { | ||
args[_key7 - 1] = arguments[_key7]; | ||
} | ||
return classes[vTree.type].prototype.updateElement.apply(vTree, args); | ||
}; | ||
var _removeElement = function _removeElement(vTree) { | ||
for (var _len8 = arguments.length, args = Array(_len8 > 1 ? _len8 - 1 : 0), _key8 = 1; _key8 < _len8; _key8++) { | ||
args[_key8 - 1] = arguments[_key8]; | ||
} | ||
return classes[vTree.type].prototype.removeElement.apply(vTree, args); | ||
}; | ||
function createVTree(node) { | ||
return { | ||
key: 'INIT', | ||
type: 'VNode', | ||
name: node.nodeName.toLowerCase(), | ||
lifecycle: createDefaultLifecycle(), | ||
events: {}, | ||
attrs: {}, | ||
untouchedAttributes: {}, | ||
children: Array.prototype.map.call(node.childNodes, function (node) { | ||
return node.nodeType === 3 // Node.TEXT_NODE | ||
? { type: 'VText', text: node.nodeValue } : createVTree(node); | ||
}) | ||
}; | ||
} | ||
function patch(node) { | ||
var previousTree = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : createVTree(node); | ||
var vTree = arguments[2]; | ||
var isSvg = arguments[3]; | ||
var context = arguments[4]; | ||
if (vTree.type !== previousTree.type || vTree.key !== previousTree.key) { | ||
_removeElement(previousTree, node); | ||
var newNode = _createElement(vTree, isSvg, context); | ||
node.parentNode.replaceChild(newNode, node); | ||
_mount(vTree, newNode, isSvg); | ||
return newNode; | ||
} else { | ||
var _newNode = _updateElement(vTree, node, previousTree, isSvg, context); | ||
if (_newNode) { | ||
node.parentNode.replaceChild(_newNode, node); | ||
_mount(vTree, _newNode, isSvg); | ||
return _newNode; | ||
} else { | ||
return node; | ||
} | ||
} | ||
} | ||
function _objectEntries$2(obj) { | ||
var entries = []; | ||
@@ -790,3 +1109,3 @@ var keys = Object.keys(obj); | ||
function _objectEntries$1(obj) { | ||
function _objectEntries$2(obj) { | ||
var entries = []; | ||
@@ -823,19 +1142,39 @@ var keys = Object.keys(obj); | ||
var formatChildren = flatMap(function (c) { | ||
return Array.isArray(c) ? formatChildren(c) : [VNode, VText, VPatch, Component].some(function (C) { | ||
return c instanceof C; | ||
}) ? [c] : isEmpty(c) ? [] : [new VText({ text: '' + c })]; | ||
return Array.isArray(c) ? formatChildren(c) : isEmpty(c) ? [] : ['VNode', 'VText', 'VPatch', 'Component'].some(function (type) { | ||
return c.type === type; | ||
}) ? [c] : isObservable(c) || isPromise(c) ? [{ | ||
type: 'Component', | ||
name: function AnonymousComponent() { | ||
return flip(c).pipe(map(function (child) { | ||
return formatChildren([child]); | ||
}), map(function (children) { | ||
return children.length === 1 ? children[0] : children; | ||
}), filter(function (x) { | ||
return !isEmpty(x); | ||
})); | ||
}, | ||
untouchedAttributes: { children: [] } | ||
}] : [{ type: 'VText', text: c }]; | ||
}); | ||
function h(name) { | ||
var attributes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
var children = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : []; | ||
function h(name, _attributes) { | ||
var attributes = _attributes || {}; | ||
for (var _len = arguments.length, _children = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) { | ||
_children[_key - 2] = arguments[_key]; | ||
} | ||
var children = _children.reduce(function (acc, x) { | ||
return acc.concat(x); | ||
}, []); | ||
if (typeof name === 'function') { | ||
return new Component({ | ||
return { | ||
type: 'Component', | ||
name: name, | ||
untouchedAttributes: _extends({}, attributes, { children: children }) | ||
}); | ||
}; | ||
} | ||
var _Object$entries$reduc = _objectEntries$1(attributes).reduce(function (acc, _ref) { | ||
var _Object$entries$reduc = _objectEntries$2(attributes).reduce(function (acc, _ref) { | ||
var _ref2 = slicedToArray(_ref, 2), | ||
@@ -863,3 +1202,4 @@ key = _ref2[0], | ||
return new VNode({ | ||
return { | ||
type: 'VNode', | ||
name: name, | ||
@@ -871,7 +1211,7 @@ attrs: attrs, | ||
key: key | ||
}); | ||
}; | ||
} | ||
var createRenderProcess = function createRenderProcess(vdom$) { | ||
return new rxjs.Observable(function (observer) { | ||
return new Observable(function (observer) { | ||
var domNode = void 0; | ||
@@ -903,3 +1243,3 @@ var previousTree = void 0; | ||
domNode = patch(domNode, previousTree, vTree, isSvg); | ||
observer.next(new VPatch(vTree)); | ||
observer.next(new VPatch({ vTree: vTree })); | ||
} | ||
@@ -926,24 +1266,2 @@ | ||
// render :: Observable VirtualDOM -> DOMElement -> Promise Error () | ||
var render = function render(component, element) { | ||
var rootNode = element.firstChild; | ||
var previousTree = void 0; | ||
return component.subscribe({ | ||
next: function next(vTree) { | ||
if (vTree instanceof VPatch) { | ||
previousTree = vTree.vTree; | ||
} else { | ||
if (!rootNode) { | ||
rootNode = vTree.createElement(false, patch); | ||
element.appendChild(rootNode); | ||
} else { | ||
patch(rootNode, previousTree, vTree); | ||
} | ||
previousTree = vTree; | ||
} | ||
} | ||
}); | ||
}; | ||
// textTag :: [String] -> ...[a] -> String | ||
@@ -963,4 +1281,3 @@ var textTag = function textTag(strings) { | ||
exports['default'] = html$1; | ||
exports.text = text; | ||
exports.render = render; | ||
export { text, render, h }; | ||
export default html$1; |
@@ -1,1 +0,1 @@ | ||
"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var createTag=_interopDefault(require("vdom-tag")),rxjs=require("rxjs"),operators=require("rxjs/operators"),_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},classCallCheck=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},createClass=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),_extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},slicedToArray=function(){return function(e,t){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return function(e,t){var r=[],n=!0,o=!1,i=void 0;try{for(var a,u=e[Symbol.iterator]();!(n=(a=u.next()).done)&&(r.push(a.value),!t||r.length!==t);n=!0);}catch(e){o=!0,i=e}finally{try{!n&&u.return&&u.return()}finally{if(o)throw i}}return r}(e,t);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),toArray=function(e){return Array.isArray(e)?e:Array.from(e)},toConsumableArray=function(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)},compose=function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return function(e){return t.reduceRight(function(e,t){return t(e)},e)}},curry=function e(t){return function(){for(var r=arguments.length,n=Array(r),o=0;o<r;o++)n[o]=arguments[o];return n.length>=t.length?t.apply(void 0,n):function(){for(var r=arguments.length,o=Array(r),i=0;i<r;i++)o[i]=arguments[i];return e(t).apply(void 0,n.concat(o))}}},isPromise=function(e){return e&&"function"==typeof e.then},isObservable=function(e){return e&&"function"==typeof e.subscribe},toObservable=function(e){return isObservable(e)?e:rxjs.of(e)},switchMap=curry(function(e,t){var r=void 0;return new rxjs.Observable(function(n){var o=!1,i=!1,a=t.subscribe({next:function(t){r&&r.unsubscribe(),r=e(t).subscribe({error:function(e){return n.error(e)},next:function(e){return n.next(e)},complete:function(){i=!0,o&&n.complete()}})},error:function(e){return n.error(e)},complete:function(){o=!0,i&&n.complete()}});return{unsubscribe:function(){r&&r.unsubscribe(),a.unsubscribe()}}})}),all=function(e){return e.length?rxjs.combineLatest.apply(void 0,toConsumableArray(e).concat([function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return t}])):rxjs.of([])},blockComplete=function(){return function(e){return new rxjs.Observable(function(t){return e.subscribe({complete:function(){},next:function(e){return t.next(e)},error:function(e){return t.error(e)}})})}},raf=new rxjs.Observable(function(e){var t=!0;return window.requestAnimationFrame(function r(){t&&(e.next(),window.requestAnimationFrame(r))}),{unsubscribe:function(){t=!1}}}),noOp=function(){},createDefaultLifecycle=function(){return{mount:noOp,update:noOp,unmount:noOp}},isEmpty=function(e){return 0!==e&&(!e||"string"==typeof e&&!e.trim())},hasContent=function(e){return!e.length||!e.every(isEmpty)},flatten=function e(t){return Array.isArray(t)?all(t.map(compose(operators.startWith(""),e))).pipe(blockComplete(),operators.filter(hasContent)):isObservable(t)?switchMap(e,t):isPromise(t)?switchMap(e,rxjs.from(t)):toObservable(t)},sharedRaf=operators.share()(raf),createReactiveTag=function(e){return function(t){for(var r=arguments.length,n=Array(r>1?r-1:0),o=1;o<r;o++)n[o-1]=arguments[o];return flatten(n).pipe(operators.startWith([]),operators.sample(sharedRaf),operators.map(function(r){return e.apply(void 0,[t].concat(toConsumableArray(r)))}))}};function _objectEntries(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}function _objectEntries(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}function updateStyle(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};for(var n in _extends({},t,r)){var o=r&&r[n]?r[n]:"";r[n]===t[n]||("-"===n[0]?e.style.setProperty(n,o):e.style[n]=o)}}var VNode=function(){function e(t){var r=t.name,n=t.attrs,o=void 0===n?{}:n,i=t.lifecycle,a=void 0===i?{}:i,u=t.events,c=void 0===u?{}:u,s=t.children,l=void 0===s?{}:s,f=t.key,v=void 0===f?"":f;classCallCheck(this,e),this.name=r,this.attrs=o,this.lifecycle=a,this.events=c,this.children=l,this.key=v}return createClass(e,[{key:"createElement",value:function(e,t){var r=(e=e||"svg"===this.name)?document.createElementNS("http://www.w3.org/2000/svg",this.name):document.createElement(this.name);return this.updateEvents(r,{}),this.updateAttrs(r,{}),this.updateChildren(r,[],e,t),r}},{key:"updateElement",value:function(e,t,r,n){if(t.name!==this.name)return t.removeElement(e),this.createElement(r,n);this.updateEvents(e,t.events),this.updateAttrs(e,t.attrs),this.updateChildren(e,t.children,r,n),this.lifecycle.update(e)}},{key:"removeElement",value:function(e){this.children.map(function(t,r){return t.removeElement(e.childNodes[r])}),this.lifecycle.unmount(e)}},{key:"mount",value:function(e){this.children.map(function(e){return e.mount()}),this.lifecycle.mount(e)}},{key:"updateEvents",value:function(e,t){var r=this,n=!0,o=!1,i=void 0;try{for(var a,u=_objectEntries(this.events)[Symbol.iterator]();!(n=(a=u.next()).done);n=!0){var c=a.value,s=slicedToArray(c,2),l=s[0],f=s[1];t[l]?f!==t[l]&&(e.removeEventListener(l,t[l]),e.addEventListener(l,f)):e.addEventListener(l,f)}}catch(e){o=!0,i=e}finally{try{!n&&u.return&&u.return()}finally{if(o)throw i}}var v=_objectEntries(t).filter(function(e){var t=slicedToArray(e,1)[0];return!r.events[t]}),h=!0,m=!1,p=void 0;try{for(var y,d=v[Symbol.iterator]();!(h=(y=d.next()).done);h=!0){var b=y.value,x=slicedToArray(b,2),E=x[0],g=x[1];e.removeEventListener(E,g)}}catch(e){m=!0,p=e}finally{try{!h&&d.return&&d.return()}finally{if(m)throw p}}}},{key:"updateAttrs",value:function(e,t){for(var r in _extends({},t,this.attrs)){var n=this.attrs[r];n===t[r]||(isEmpty(n)?"value"===r&&"INPUT"===e.tagName?e.value="":e.removeAttribute(r):"style"===r?updateStyle(e,t.style,this.attrs.style):"value"===r&&"INPUT"===e.tagName?e.value=n:e.setAttribute(r,n))}}},{key:"updateChildren",value:function(e,t,r,n){for(var o in this.children){var i=this.children[o],a=t[o],u=e.childNodes[o];if(u)n(u,a,i,r);else{var c=i.createElement(r,n);e.appendChild(c),i.mount(c)}}for(var s in[].slice.call(e.childNodes,this.children.length)){var l=parseInt(s)+this.children.length,f=t[l],v=e.childNodes[l];v&&(f.removeElement(v),v.remove())}}}]),e}(),VText=function(){function e(t){var r=t.text;classCallCheck(this,e),this.text=r}return createClass(e,[{key:"createElement",value:function(){return document.createTextNode(this.text)}},{key:"updateElement",value:function(e,t){t.text!==this.text&&(e.textContent=this.text)}},{key:"removeElement",value:function(){}},{key:"mount",value:function(){}}]),e}();function createVTree(e){return new VNode({name:e.nodeName.toLowerCase(),lifecycle:createDefaultLifecycle(),events:{},attrs:{},untouchedAttributes:{},children:Array.prototype.map.call(e.childNodes,function(e){return 3===e.nodeType?new VText({text:e.nodeValue}):createVTree(e)})})}function patch(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:createVTree(e),r=arguments[2],n=arguments[3];if(r.constructor!==t.constructor||r.key!==t.key){t.removeElement(e);var o=r.createElement(n,patch);return e.parentNode.replaceChild(o,e),r.mount(o),o}var i=r.updateElement(e,t,n,patch);return i?(e.parentNode.replaceChild(i,e),r.mount(i,n),i):e}var VPatch=function(){function e(t){classCallCheck(this,e),this.vTree=t}return createClass(e,[{key:"createElement",value:function(){var e;return(e=this.vTree).createElement.apply(e,arguments)}},{key:"updateElement",value:function(){var e;return(e=this.vTree).updateElement.apply(e,arguments)}},{key:"removeElement",value:function(){var e;return(e=this.vTree).removeElement.apply(e,arguments)}},{key:"mount",value:function(){var e;return(e=this.vTree).mount.apply(e,arguments)}}]),e}();function createPropsStream(e){var t=new rxjs.BehaviorSubject(e);return{next:function(e){return t.next(e)},stream:t}}var Component=function(){function e(t){var r=t.name,n=t.untouchedAttributes,o=t.key,i=void 0===o?"":o;classCallCheck(this,e),this.name=r,this.untouchedAttributes=n,this.key=i}return createClass(e,[{key:"createElement",value:function(e,t){var r=this,n=e?document.createElementNS("http://www.w3.org/2000/svg","g"):document.createElement("div");this.state={},this.state.props=createPropsStream(this.untouchedAttributes),this.state.childTree=void 0;var o=this.name(this.state.props.stream);if(!o)throw new Error("Component "+this.name.name+" must return a stream!");return this.state.subscription=o.pipe(flatten,operators.sample(sharedRaf)).subscribe({next:function(o){o instanceof VPatch?r.state.childTree=o.vTree:(n=t(n,r.state.childTree,o,e),r.state.childTree=o)},error:function(e){return console.error(e)}}),n}},{key:"updateElement",value:function(e,t,r,n){if(this.state=t.state,t.name!==this.name)return t.removeElement(e),this.createElement(r,n);this.state.props.next(this.untouchedAttributes)}},{key:"removeElement",value:function(e){this.state.subscription.unsubscribe(),this.state.childTree&&this.state.childTree.removeElement(e)}},{key:"mount",value:function(){}}]),e}(),flatMap=curry(function(e,t){return t.reduce(function(t,r){return t.concat(e(r))},[])});function _objectEntries$1(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}function _objectEntries$1(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}var isLifecycle=function(e){return["mount","update","unmount"].includes(e)},isEvent=function(e){return!!e.match(/^on/)},toEventName=function(e){return e.replace(/^on/,"").toLowerCase()},styleToObject=function(e){return e.split(";").reduce(function(e,t){var r=t.split(/:/),n=toArray(r),o=n[0],i=n.slice(1);return o.trim()&&(e[o.trim()]=i.join(":")),e},{})},formatChildren=flatMap(function(e){return Array.isArray(e)?formatChildren(e):[VNode,VText,VPatch,Component].some(function(t){return e instanceof t})?[e]:isEmpty(e)?[]:[new VText({text:""+e})]});function h(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[];if("function"==typeof e)return new Component({name:e,untouchedAttributes:_extends({},t,{children:r})});var n=_objectEntries$1(t).reduce(function(e,t){var r=slicedToArray(t,2),n=r[0],o=r[1];return"key"===n?e.key=o:isLifecycle(n)&&"function"==typeof o?e.lifecycle[n]=o:isEvent(n)&&"function"==typeof o?e.events[toEventName(n)]=o:e.attrs[n]="style"===n?"object"===(void 0===o?"undefined":_typeof(o))?o:styleToObject(o):o,e},{lifecycle:createDefaultLifecycle(),events:{},attrs:{}}),o=n.key,i=n.lifecycle,a=n.events,u=n.attrs;return new VNode({name:e,attrs:u,lifecycle:i,events:a,children:formatChildren(r),key:o})}var createRenderProcess=function(e){return new rxjs.Observable(function(t){var r=void 0,n=void 0,o=void 0;return e.subscribe({complete:function(){return t.complete()},error:function(e){return t.error(e)},next:function(e){if(!(e instanceof VNode))return t.next(e);var i=e.lifecycle.mount;e.lifecycle.mount=function(e,t){r=e,o=t,i(e)},r?(r=patch(r,n,e,o),t.next(new VPatch(e))):t.next(e),n=e}})})},toRenderProcess=function(e){return function(t){for(var r=arguments.length,n=Array(r>1?r-1:0),o=1;o<r;o++)n[o-1]=arguments[o];return createRenderProcess(e.apply(void 0,[t].concat(n)))}},html$1=toRenderProcess(createReactiveTag(createTag(h))),render=function(e,t){var r=t.firstChild,n=void 0;return e.subscribe({next:function(e){e instanceof VPatch?n=e.vTree:(r?patch(r,n,e):(r=e.createElement(!1,patch),t.appendChild(r)),n=e)}})},textTag=function(e){for(var t=arguments.length,r=Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return e.reduce(function(e,t,n){return e+t+(void 0!==r[n]?r[n]:"")},"")},text=createReactiveTag(textTag);exports.default=html$1,exports.text=text,exports.render=render; | ||
import createTag from"vdom-tag";import{BehaviorSubject,Observable,combineLatest,from,of}from"rxjs";import{filter,map,share,shareReplay,startWith}from"rxjs/operators";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},classCallCheck=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},createClass=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),defineProperty=function(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e},_extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},slicedToArray=function(){return function(e,t){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return function(e,t){var r=[],n=!0,o=!1,i=void 0;try{for(var a,u=e[Symbol.iterator]();!(n=(a=u.next()).done)&&(r.push(a.value),!t||r.length!==t);n=!0);}catch(e){o=!0,i=e}finally{try{!n&&u.return&&u.return()}finally{if(o)throw i}}return r}(e,t);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),toArray=function(e){return Array.isArray(e)?e:Array.from(e)},toConsumableArray=function(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)},compose=function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return function(e){return t.reduceRight(function(e,t){return t(e)},e)}},curry=function e(t){return function(){for(var r=arguments.length,n=Array(r),o=0;o<r;o++)n[o]=arguments[o];return n.length>=t.length?t.apply(void 0,n):function(){for(var r=arguments.length,o=Array(r),i=0;i<r;i++)o[i]=arguments[i];return e(t).apply(void 0,n.concat(o))}}};function _objectEntries(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}function _objectEntries(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}var fromEntries=function(e){return e.reduce(function(e,t){var r=slicedToArray(t,2),n=r[0],o=r[1];return _extends({},e,defineProperty({},n,o))},{})},pickBy=curry(function(e,t){return fromEntries(_objectEntries(t).filter(function(t){var r=slicedToArray(t,2),n=r[0],o=r[1];return e(o,n)}))}),mapValues=curry(function(e,t){return Object.keys(t).reduce(function(r,n){return _extends({},r,defineProperty({},n,e(t[n],n)))},{})}),isObject=function(e){return"object"===(void 0===e?"undefined":_typeof(e))&&null!==e};function _objectValues(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push(e[r[n]]);return t}function _objectValues(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push(e[r[n]]);return t}var isPromise=function(e){return e&&"function"==typeof e.then},isObservable=function(e){return e&&"function"==typeof e.subscribe},toObservable=function(e){return isObservable(e)?e:of(e)},switchMap=curry(function(e,t){var r=void 0;return new Observable(function(n){var o=!1,i=!1,a=t.subscribe({next:function(t){r&&r.unsubscribe(),r=e(t).subscribe({error:function(e){return n.error(e)},next:function(e){return n.next(e)},complete:function(){i=!0,o&&n.complete()}})},error:function(e){return n.error(e)},complete:function(){o=!0,i&&n.complete()}});return{unsubscribe:function(){r&&r.unsubscribe(),a.unsubscribe()}}})}),all=function(e){return e.length?combineLatest.apply(void 0,toConsumableArray(e.map(toObservable)).concat([function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return t}])):of([])},combineLatestObject=function(e){var t=Object.keys(e);return t.length?combineLatest.apply(void 0,toConsumableArray(t.map(function(t){return toObservable(e[t]).pipe(map(function(e){return[t,e]}))})).concat([function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return t.reduce(function(e,t){var r=slicedToArray(t,2),n=r[0],o=r[1];return _extends({},e,defineProperty({},n,o))},{})}])):of(e)},blockComplete=function(){return function(e){return new Observable(function(t){return e.subscribe({complete:function(){},next:function(e){return t.next(e)},error:function(e){return t.error(e)}})})}},sample=curry(function(e,t){var r=Symbol("None");return new Observable(function(n){var o=r,i=t.subscribe({next:function(e){o=e},complete:function(){},error:function(e){return n.error(e)}}),a=e.subscribe({next:function(){o!==r&&(n.next(o),o=r)},complete:function(){return n.complete()},error:function(e){return n.error(e)}});return{unsubscribe:function(){i.unsubscribe(),a.unsubscribe()}}})}),raf=new Observable(function(e){var t=!0;return window.requestAnimationFrame(function r(){t&&(e.next(),window.requestAnimationFrame(r))}),{unsubscribe:function(){t=!1}}}),applyIf=curry(function(e,t,r){return e(r)?t(r):r}),ifObservable=applyIf(isObservable),allIfObservable=applyIf(function(e){return e.some(isObservable)},all),combineLatestObjectIfObservable=applyIf(function(e){return _objectValues(e).some(isObservable)},combineLatestObject),defaultWith=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:32;return function(r){return new Observable(function(n){var o=setTimeout(function(){return n.next(e)},t);return r.subscribe({next:function(e){clearTimeout(o),n.next(e)},complete:function(){clearTimeout(o),n.complete()},error:function(e){clearTimeout(o),n.error(e)}})})}},_flip=function e(t){return isObservable(t)?switchMap(compose(toObservable,e))(t):isPromise(t)?switchMap(compose(toObservable,e))(from(t)):Array.isArray(t)?allIfObservable(t.map(compose(ifObservable(defaultWith(void 0)),e))):isObject(t)?"Component"===t.type?t:combineLatestObjectIfObservable(mapValues(compose(ifObservable(defaultWith(void 0)),e),t)):t},flip=function(e){return toObservable(_flip(e))},noOp=function(){},createDefaultLifecycle=function(){return{mount:noOp,update:noOp,unmount:noOp}},isEmpty=function(e){return 0!==e&&(!e||"string"==typeof e&&!e.trim())||Array.isArray(e)&&!e.length},hasContent=function(e){return!e.length||!e.every(isEmpty)},flatten=function e(t){return Array.isArray(t)?all(t.map(compose(startWith(""),e))).pipe(filter(hasContent)):isObservable(t)?switchMap(e,t):isPromise(t)?switchMap(e,from(t)):toObservable(t)},sharedRaf=share()(raf),createReactiveTag=function(e){return function(t){for(var r=arguments.length,n=Array(r>1?r-1:0),o=1;o<r;o++)n[o-1]=arguments[o];return flatten(n).pipe(blockComplete(),startWith([]),sample(sharedRaf),map(function(r){return e.apply(void 0,[t].concat(toConsumableArray(r)))}))}},flatMap=curry(function(e,t){return t.reduce(function(t,r){return t.concat(e(r))},[])}),flatten$1=flatMap(function(e){return e});function _objectEntries$1(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}function _objectEntries$1(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}var sharedRaf$1=share()(raf),toStream=function(e){return flip(e).pipe(sample(sharedRaf$1))},render=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=n.isSvg,i=void 0!==o&&o,a=n.morphNode,u=void 0!==a&&a?t:t.firstChild,c=void 0,s="function"==typeof e?e(r):e,l=toStream(s).subscribe({next:function(e){"VPatch"===e.type?c=e.vTree:Array.isArray(e)?(updateChildren(u||(u=t),c||[],e,i,r),c=e):(u?u=patch(u,c,e,i,r):(u=_createElement(e,i,r),t.innerHTML="",t.appendChild(u)),c=e)}});return{unsubscribe:function(){c&&_removeElement(c,u),l.unsubscribe()}}},VText=function(){function e(t){var r=t.text;classCallCheck(this,e),this.type="VText",this.text=r}return createClass(e,[{key:"createElement",value:function(){return document.createTextNode(this.text)}},{key:"updateElement",value:function(e,t){t.text!==this.text&&(e.textContent=this.text)}},{key:"removeElement",value:function(){}},{key:"mount",value:function(){}}]),e}();function isShallowEqual(e,t){for(var r in e)if(!(r in t)||e[r]!==t[r])return!1;for(var n in t)if(!(n in e)||e[n]!==t[n])return!1;return!0}var updateStyle=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};for(var n in _extends({},t,r)){var o=r&&r[n]?r[n]:"";r[n]===t[n]||("-"===n[0]?e.style.setProperty(n,o):e.style[n]=o)}},updateEvents=function(e,t,r){var n=!0,o=!1,i=void 0;try{for(var a,u=_objectEntries$1(e.events)[Symbol.iterator]();!(n=(a=u.next()).done);n=!0){var c=a.value,s=slicedToArray(c,2),l=s[0],f=s[1];r[l]?f!==r[l]&&(t.removeEventListener(l,r[l]),t.addEventListener(l,f)):t.addEventListener(l,f)}}catch(e){o=!0,i=e}finally{try{!n&&u.return&&u.return()}finally{if(o)throw i}}var p=_objectEntries$1(r).filter(function(t){var r=slicedToArray(t,1)[0];return!e.events[r]}),v=!0,m=!1,y=void 0;try{for(var h,b=p[Symbol.iterator]();!(v=(h=b.next()).done);v=!0){var d=h.value,E=slicedToArray(d,2),g=E[0],A=E[1];t.removeEventListener(g,A)}}catch(e){m=!0,y=e}finally{try{!v&&b.return&&b.return()}finally{if(m)throw y}}},updateAttrs=function(e,t,r){for(var n in _extends({},r,e.attrs)){var o=e.attrs[n];o===r[n]||(isEmpty(o)?"value"===n&&"INPUT"===t.tagName?t.value="":t.removeAttribute(n):"style"===n?updateStyle(t,r.style,e.attrs.style):"value"===n&&"INPUT"===t.tagName?t.value=o:t.setAttribute(n,o))}},updateChildren=function(e,t,r,n,o){var i=flatten$1(r),a=flatten$1(t);for(var u in i){var c=i[u],s=a[u],l=e.childNodes[u];if(l)patch(l,s,c,n,o);else{var f=_createElement(c,n,o);e.appendChild(f),_mount(c,f)}}for(var p in[].slice.call(e.childNodes,i.length)){var v=parseInt(p)+i.length,m=a[v],y=e.childNodes[v];y&&(_removeElement(m,y),y.remove())}},VNode=function(){function e(t){var r=t.name,n=t.attrs,o=void 0===n?{}:n,i=t.lifecycle,a=void 0===i?{}:i,u=t.events,c=void 0===u?{}:u,s=t.children,l=void 0===s?{}:s,f=t.key,p=void 0===f?"":f;classCallCheck(this,e),this.type="VNode",this.name=r,this.attrs=o,this.lifecycle=a,this.events=c,this.children=l,this.key=p}return createClass(e,[{key:"createElement",value:function(e,t){var r=(e=e||"svg"===this.name)?document.createElementNS("http://www.w3.org/2000/svg",this.name):document.createElement(this.name);return updateEvents(this,r,{}),updateAttrs(this,r,{}),updateChildren(r,[],this.children,e,t),r}},{key:"updateElement",value:function(e,t,r,n){if(t.name!==this.name)return _removeElement(t,e),_createElement(this,r,n);updateEvents(this,e,t.events),updateAttrs(this,e,t.attrs),updateChildren(e,t.children,this.children,r,n),this.lifecycle.update(e)}},{key:"removeElement",value:function(e){flatten$1(this.children).map(function(t,r){return _removeElement(t,e.childNodes[r])}),this.lifecycle.unmount(e)}},{key:"mount",value:function(e){flatten$1(this.children).map(function(e){return _mount(e)}),this.lifecycle.mount(e)}}]),e}(),VPatch=function(){function e(t){var r=t.vTree;classCallCheck(this,e),this.type="VPatch",this.vTree=r}return createClass(e,[{key:"createElement",value:function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return _createElement.apply(void 0,[this.vTree].concat(t))}},{key:"updateElement",value:function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return _updateElement.apply(void 0,[this.vTree].concat(t))}},{key:"removeElement",value:function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return _removeElement.apply(void 0,[this.vTree].concat(t))}},{key:"mount",value:function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return _mount.apply(void 0,[this.vTree].concat(t))}}]),e}(),pickNonObservables=function(e){return pickBy(function(e,t){return!/\$$/.test(t)},e)};function createPropsStream(e){var t=new BehaviorSubject(e);return{next:function(e){return t.next(e)},stream:t.pipe(switchMap(function(e){return combineLatestObject(pickNonObservables(e)).pipe(map(function(t){return _extends({},e,t)}))}),shareReplay(1))}}var Component=function(){function e(t){var r=t.name,n=t.untouchedAttributes,o=t.key,i=void 0===o?"":o;classCallCheck(this,e),this.type="Component",this.name=r,this.untouchedAttributes=n,this.key=i}return createClass(e,[{key:"createElement",value:function(e,t){var r=e?document.createElementNS("http://www.w3.org/2000/svg","g"):document.createElement("div");this.state={},this.state.props=createPropsStream(this.untouchedAttributes);var n=this.name(this.state.props.stream);if(!n)throw new Error("Component "+this.name.name+" must return a stream!");return this.state.subscription=render(n,r,t,{isSvg:e,morphNode:!0}),r}},{key:"updateElement",value:function(e,t,r,n){if(this.state=t.state,t.name!==this.name)return _removeElement(t,e),_createElement(this,r,n);isShallowEqual(t.untouchedAttributes,this.untouchedAttributes)||this.state.props.next(this.untouchedAttributes)}},{key:"removeElement",value:function(){this.state.subscription.unsubscribe()}},{key:"mount",value:function(){}}]),e}(),classes={VNode:VNode,VText:VText,Component:Component},_createElement=function(e){for(var t=arguments.length,r=Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return classes[e.type].prototype.createElement.apply(e,r)},_mount=function(e){for(var t=arguments.length,r=Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return classes[e.type].prototype.mount.apply(e,r)},_updateElement=function(e){for(var t=arguments.length,r=Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return classes[e.type].prototype.updateElement.apply(e,r)},_removeElement=function(e){for(var t=arguments.length,r=Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return classes[e.type].prototype.removeElement.apply(e,r)};function createVTree(e){return{key:"INIT",type:"VNode",name:e.nodeName.toLowerCase(),lifecycle:createDefaultLifecycle(),events:{},attrs:{},untouchedAttributes:{},children:Array.prototype.map.call(e.childNodes,function(e){return 3===e.nodeType?{type:"VText",text:e.nodeValue}:createVTree(e)})}}function patch(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:createVTree(e),r=arguments[2],n=arguments[3],o=arguments[4];if(r.type!==t.type||r.key!==t.key){_removeElement(t,e);var i=_createElement(r,n,o);return e.parentNode.replaceChild(i,e),_mount(r,i,n),i}var a=_updateElement(r,e,t,n,o);return a?(e.parentNode.replaceChild(a,e),_mount(r,a,n),a):e}function _objectEntries$2(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}function _objectEntries$2(e){for(var t=[],r=Object.keys(e),n=0;n<r.length;++n)t.push([r[n],e[r[n]]]);return t}var isLifecycle=function(e){return["mount","update","unmount"].includes(e)},isEvent=function(e){return!!e.match(/^on/)},toEventName=function(e){return e.replace(/^on/,"").toLowerCase()},styleToObject=function(e){return e.split(";").reduce(function(e,t){var r=t.split(/:/),n=toArray(r),o=n[0],i=n.slice(1);return o.trim()&&(e[o.trim()]=i.join(":")),e},{})},formatChildren=flatMap(function(e){return Array.isArray(e)?formatChildren(e):isEmpty(e)?[]:["VNode","VText","VPatch","Component"].some(function(t){return e.type===t})?[e]:isObservable(e)||isPromise(e)?[{type:"Component",name:function(){return flip(e).pipe(map(function(e){return formatChildren([e])}),map(function(e){return 1===e.length?e[0]:e}),filter(function(e){return!isEmpty(e)}))},untouchedAttributes:{children:[]}}]:[{type:"VText",text:e}]});function h(e,t){for(var r=t||{},n=arguments.length,o=Array(n>2?n-2:0),i=2;i<n;i++)o[i-2]=arguments[i];var a=o.reduce(function(e,t){return e.concat(t)},[]);if("function"==typeof e)return{type:"Component",name:e,untouchedAttributes:_extends({},r,{children:a})};var u=_objectEntries$2(r).reduce(function(e,t){var r=slicedToArray(t,2),n=r[0],o=r[1];return"key"===n?e.key=o:isLifecycle(n)&&"function"==typeof o?e.lifecycle[n]=o:isEvent(n)&&"function"==typeof o?e.events[toEventName(n)]=o:e.attrs[n]="style"===n?"object"===(void 0===o?"undefined":_typeof(o))?o:styleToObject(o):o,e},{lifecycle:createDefaultLifecycle(),events:{},attrs:{}}),c=u.key,s=u.lifecycle,l=u.events;return{type:"VNode",name:e,attrs:u.attrs,lifecycle:s,events:l,children:formatChildren(a),key:c}}var createRenderProcess=function(e){return new Observable(function(t){var r=void 0,n=void 0,o=void 0;return e.subscribe({complete:function(){return t.complete()},error:function(e){return t.error(e)},next:function(e){if(!(e instanceof VNode))return t.next(e);var i=e.lifecycle.mount;e.lifecycle.mount=function(e,t){r=e,o=t,i(e)},r?(r=patch(r,n,e,o),t.next(new VPatch({vTree:e}))):t.next(e),n=e}})})},toRenderProcess=function(e){return function(t){for(var r=arguments.length,n=Array(r>1?r-1:0),o=1;o<r;o++)n[o-1]=arguments[o];return createRenderProcess(e.apply(void 0,[t].concat(n)))}},html$1=toRenderProcess(createReactiveTag(createTag(h))),textTag=function(e){for(var t=arguments.length,r=Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return e.reduce(function(e,t,n){return e+t+(void 0!==r[n]?r[n]:"")},"")},text=createReactiveTag(textTag);export{text,render,h};export default html$1; |
{ | ||
"name": "evolui", | ||
"version": "1.6.7", | ||
"version": "2.0.0-alpha.01", | ||
"description": "Observable powered templates for asynchronous UIs", | ||
@@ -5,0 +5,0 @@ "main": "lib/evolui.js", |
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
Manifest confusion
Supply chain riskThis package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
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
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
70677
1336
1