native-document 1.0.89 → 1.0.90
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/native-document.components.min.js +43 -63
- package/dist/native-document.dev.js +79 -101
- package/dist/native-document.dev.js.map +1 -1
- package/dist/native-document.devtools.min.js +1 -1
- package/dist/native-document.min.js +1 -1
- package/package.json +1 -1
- package/src/core/data/ObservableChecker.js +4 -4
- package/src/core/data/ObservableItem.js +23 -33
- package/src/core/data/ObservableWhen.js +2 -2
- package/src/core/wrappers/AttributesWrapper.js +18 -28
- package/src/core/wrappers/prototypes/bind-class-extensions.js +3 -7
|
@@ -334,10 +334,10 @@ var NativeComponents = (function (exports) {
|
|
|
334
334
|
|
|
335
335
|
ObservableChecker.prototype.__$isObservableChecker = true;
|
|
336
336
|
|
|
337
|
-
ObservableChecker.prototype.subscribe = function(callback
|
|
338
|
-
const unSubscribe = this.observable.subscribe((value
|
|
339
|
-
callback && callback(this.checker(value)
|
|
340
|
-
}
|
|
337
|
+
ObservableChecker.prototype.subscribe = function(callback) {
|
|
338
|
+
const unSubscribe = this.observable.subscribe((value) => {
|
|
339
|
+
callback && callback(this.checker(value));
|
|
340
|
+
});
|
|
341
341
|
this.unSubscriptions.push(unSubscribe);
|
|
342
342
|
return unSubscribe;
|
|
343
343
|
};
|
|
@@ -369,8 +369,8 @@ var NativeComponents = (function (exports) {
|
|
|
369
369
|
|
|
370
370
|
ObservableWhen.prototype.__$isObservableWhen = true;
|
|
371
371
|
|
|
372
|
-
ObservableWhen.prototype.subscribe = function(callback
|
|
373
|
-
return this.$observer.on(this.$target, callback
|
|
372
|
+
ObservableWhen.prototype.subscribe = function(callback) {
|
|
373
|
+
return this.$observer.on(this.$target, callback);
|
|
374
374
|
};
|
|
375
375
|
|
|
376
376
|
ObservableWhen.prototype.val = function() {
|
|
@@ -508,7 +508,7 @@ var NativeComponents = (function (exports) {
|
|
|
508
508
|
};
|
|
509
509
|
|
|
510
510
|
ObservableItem.prototype.triggerFirstListener = function(operations) {
|
|
511
|
-
this.$firstListener
|
|
511
|
+
this.$firstListener(this.$currentValue, this.$previousValue, operations || {});
|
|
512
512
|
};
|
|
513
513
|
|
|
514
514
|
ObservableItem.prototype.triggerListeners = function(operations) {
|
|
@@ -518,25 +518,24 @@ var NativeComponents = (function (exports) {
|
|
|
518
518
|
|
|
519
519
|
operations = operations || DEFAULT_OPERATIONS;
|
|
520
520
|
for(let i = 0, length = $listeners.length; i < length; i++) {
|
|
521
|
-
|
|
522
|
-
listener.callback($currentValue, $previousValue, operations, listener.context);
|
|
521
|
+
$listeners[i]($currentValue, $previousValue, operations);
|
|
523
522
|
}
|
|
524
523
|
};
|
|
525
524
|
|
|
526
525
|
const handleWatcherCallback = function(callbacks, value) {
|
|
527
|
-
if(callbacks
|
|
528
|
-
callbacks
|
|
526
|
+
if(typeof callbacks === "function") {
|
|
527
|
+
callbacks(value);
|
|
529
528
|
return;
|
|
530
529
|
}
|
|
531
530
|
if (callbacks.set) {
|
|
532
531
|
callbacks.set(value);
|
|
533
532
|
return;
|
|
534
533
|
}
|
|
535
|
-
callbacks.
|
|
536
|
-
callback
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
}
|
|
534
|
+
for(let i = 0, length = callbacks.length; i < length; i++) {
|
|
535
|
+
const callback = callbacks[i];
|
|
536
|
+
callback.set ? callback.set(value) : callback(value);
|
|
537
|
+
|
|
538
|
+
}
|
|
540
539
|
};
|
|
541
540
|
|
|
542
541
|
ObservableItem.prototype.triggerWatchers = function() {
|
|
@@ -548,12 +547,12 @@ var NativeComponents = (function (exports) {
|
|
|
548
547
|
const $previousValue = this.$previousValue;
|
|
549
548
|
const $currentValue = this.$currentValue;
|
|
550
549
|
|
|
551
|
-
|
|
552
|
-
|
|
550
|
+
const $currentValueCallbacks = $watchers.get($currentValue);
|
|
551
|
+
const $previousValueCallbacks = $watchers.get($previousValue);
|
|
552
|
+
if($currentValueCallbacks) {
|
|
553
553
|
handleWatcherCallback($currentValueCallbacks, true);
|
|
554
554
|
}
|
|
555
|
-
if($
|
|
556
|
-
const $previousValueCallbacks = $watchers.get($previousValue);
|
|
555
|
+
if($previousValueCallbacks) {
|
|
557
556
|
handleWatcherCallback($previousValueCallbacks, false);
|
|
558
557
|
}
|
|
559
558
|
};
|
|
@@ -565,7 +564,7 @@ var NativeComponents = (function (exports) {
|
|
|
565
564
|
|
|
566
565
|
ObservableItem.prototype.triggerWatchersAndFirstListener = function(operations) {
|
|
567
566
|
this.triggerWatchers();
|
|
568
|
-
this.
|
|
567
|
+
this.triggerFirstListener(operations);
|
|
569
568
|
};
|
|
570
569
|
|
|
571
570
|
ObservableItem.prototype.assocTrigger = function() {
|
|
@@ -658,11 +657,10 @@ var NativeComponents = (function (exports) {
|
|
|
658
657
|
/**
|
|
659
658
|
*
|
|
660
659
|
* @param {Function} callback
|
|
661
|
-
* @param {?Object} context
|
|
662
660
|
* @param {any} target
|
|
663
661
|
* @returns {(function(): void)}
|
|
664
662
|
*/
|
|
665
|
-
ObservableItem.prototype.subscribe = function(callback,
|
|
663
|
+
ObservableItem.prototype.subscribe = function(callback, target = null) {
|
|
666
664
|
this.$listeners = this.$listeners ?? [];
|
|
667
665
|
if (this.$isCleanedUp) {
|
|
668
666
|
DebugManager.warn('Observable subscription', '⚠️ Attempted to subscribe to a cleaned up observable.');
|
|
@@ -672,34 +670,31 @@ var NativeComponents = (function (exports) {
|
|
|
672
670
|
throw new NativeDocumentError('Callback must be a function');
|
|
673
671
|
}
|
|
674
672
|
|
|
675
|
-
|
|
676
|
-
const finalCallback = { callback, context };
|
|
677
|
-
this.$listeners.push(finalCallback);
|
|
673
|
+
this.$listeners.push(callback);
|
|
678
674
|
this.assocTrigger();
|
|
679
675
|
return () => {
|
|
680
|
-
this.unsubscribe(
|
|
676
|
+
this.unsubscribe(callback);
|
|
681
677
|
this.assocTrigger();
|
|
682
678
|
};
|
|
683
679
|
};
|
|
684
680
|
|
|
685
|
-
ObservableItem.prototype.on = function(value, callback
|
|
681
|
+
ObservableItem.prototype.on = function(value, callback) {
|
|
686
682
|
this.$watchers = this.$watchers ?? new Map();
|
|
687
683
|
|
|
688
684
|
let watchValueList = this.$watchers.get(value);
|
|
689
|
-
const finalCallback = { callback, context };
|
|
690
685
|
|
|
691
686
|
if(!watchValueList) {
|
|
692
|
-
this.$watchers.set(value,
|
|
687
|
+
this.$watchers.set(value, callback);
|
|
693
688
|
} else if(!Validator.isArray(watchValueList)) {
|
|
694
|
-
watchValueList = [watchValueList,
|
|
689
|
+
watchValueList = [watchValueList, callback];
|
|
695
690
|
this.$watchers.set(value, watchValueList);
|
|
696
691
|
} else {
|
|
697
|
-
watchValueList.push(
|
|
692
|
+
watchValueList.push(callback);
|
|
698
693
|
}
|
|
699
694
|
|
|
700
695
|
this.assocTrigger();
|
|
701
696
|
return () => {
|
|
702
|
-
const index = watchValueList.indexOf(
|
|
697
|
+
const index = watchValueList.indexOf(callback);
|
|
703
698
|
watchValueList?.splice(index, 1);
|
|
704
699
|
if(watchValueList.size === 1) {
|
|
705
700
|
this.$watchers.set(value, watchValueList[0]);
|
|
@@ -754,12 +749,6 @@ var NativeComponents = (function (exports) {
|
|
|
754
749
|
return new ObservableWhen(this, value);
|
|
755
750
|
};
|
|
756
751
|
|
|
757
|
-
ObservableItem.prototype.toString = function() {
|
|
758
|
-
if(!this.$memoryId) {
|
|
759
|
-
MemoryManager.register(this);
|
|
760
|
-
}
|
|
761
|
-
return '{{#ObItem::(' +this.$memoryId+ ')}}';
|
|
762
|
-
};
|
|
763
752
|
ObservableItem.prototype.equals = function(other) {
|
|
764
753
|
if(Validator.isObservable(other)) {
|
|
765
754
|
return this.$currentValue === other.$currentValue;
|
|
@@ -1431,9 +1420,6 @@ var NativeComponents = (function (exports) {
|
|
|
1431
1420
|
setInterval(() => MemoryManager.cleanObservables(threshold), interval);
|
|
1432
1421
|
};
|
|
1433
1422
|
|
|
1434
|
-
const handleElementAttributeClass = function(shouldAdd, _, __, context) {
|
|
1435
|
-
context.element.classes.toggle(context.className, shouldAdd);
|
|
1436
|
-
};
|
|
1437
1423
|
/**
|
|
1438
1424
|
*
|
|
1439
1425
|
* @param {HTMLElement} element
|
|
@@ -1441,19 +1427,17 @@ var NativeComponents = (function (exports) {
|
|
|
1441
1427
|
*/
|
|
1442
1428
|
function bindClassAttribute(element, data) {
|
|
1443
1429
|
const classNames = Object.keys(data);
|
|
1444
|
-
|
|
1445
1430
|
for(let i = 0, length = classNames.length; i < length; i++) {
|
|
1446
1431
|
const className = classNames[i];
|
|
1447
1432
|
const value = data[className];
|
|
1448
1433
|
if(value.__$isObservable) {
|
|
1449
1434
|
element.classes.toggle(className, value.val());
|
|
1450
|
-
value.subscribe(
|
|
1451
|
-
// value.subscribe((shouldAdd) => element.classes.toggle(className, shouldAdd));
|
|
1435
|
+
value.subscribe((shouldAdd) => element.classes.toggle(className, shouldAdd));
|
|
1452
1436
|
continue;
|
|
1453
1437
|
}
|
|
1454
1438
|
if(value.__$isObservableWhen) {
|
|
1455
1439
|
element.classes.toggle(className, value.isMath());
|
|
1456
|
-
value.subscribe(
|
|
1440
|
+
value.subscribe((shouldAdd) => element.classes.toggle(className, shouldAdd));
|
|
1457
1441
|
continue;
|
|
1458
1442
|
}
|
|
1459
1443
|
if(value.$hydrate) {
|
|
@@ -1462,6 +1446,7 @@ var NativeComponents = (function (exports) {
|
|
|
1462
1446
|
}
|
|
1463
1447
|
element.classes.toggle(className, value);
|
|
1464
1448
|
}
|
|
1449
|
+
data = null;
|
|
1465
1450
|
}
|
|
1466
1451
|
|
|
1467
1452
|
/**
|
|
@@ -1492,8 +1477,7 @@ var NativeComponents = (function (exports) {
|
|
|
1492
1477
|
function bindBooleanAttribute(element, attributeName, value) {
|
|
1493
1478
|
const isObservable = value.__$isObservable;
|
|
1494
1479
|
const defaultValue = isObservable? value.val() : value;
|
|
1495
|
-
|
|
1496
|
-
if(isBoolValue) {
|
|
1480
|
+
if(Validator.isBoolean(defaultValue)) {
|
|
1497
1481
|
element[attributeName] = defaultValue;
|
|
1498
1482
|
}
|
|
1499
1483
|
else {
|
|
@@ -1501,13 +1485,13 @@ var NativeComponents = (function (exports) {
|
|
|
1501
1485
|
}
|
|
1502
1486
|
if(isObservable) {
|
|
1503
1487
|
if(attributeName === 'checked') {
|
|
1504
|
-
if(
|
|
1488
|
+
if(typeof defaultValue === 'boolean') {
|
|
1505
1489
|
element.addEventListener('input', () => value.set(element[attributeName]));
|
|
1506
|
-
value.subscribe((newValue) => element[attributeName] = newValue);
|
|
1507
|
-
return;
|
|
1508
1490
|
}
|
|
1509
|
-
|
|
1510
|
-
|
|
1491
|
+
else {
|
|
1492
|
+
element.addEventListener('input', () => value.set(element.value));
|
|
1493
|
+
}
|
|
1494
|
+
value.subscribe((newValue) => element[attributeName] = newValue);
|
|
1511
1495
|
return;
|
|
1512
1496
|
}
|
|
1513
1497
|
value.subscribe((newValue) => element[attributeName] = (newValue === element.value));
|
|
@@ -1522,14 +1506,14 @@ var NativeComponents = (function (exports) {
|
|
|
1522
1506
|
* @param {Observable} value
|
|
1523
1507
|
*/
|
|
1524
1508
|
function bindAttributeWithObservable(element, attributeName, value) {
|
|
1509
|
+
const applyValue = attributeName === 'value' ? (newValue) => element.value = newValue : (newValue) => element.setAttribute(attributeName, newValue);
|
|
1510
|
+
value.subscribe(applyValue);
|
|
1511
|
+
|
|
1525
1512
|
if(attributeName === 'value') {
|
|
1526
|
-
value.subscribe((newValue) => element.value = newValue);
|
|
1527
1513
|
element.value = value.val();
|
|
1528
1514
|
element.addEventListener('input', () => value.set(element.value));
|
|
1529
1515
|
return;
|
|
1530
1516
|
}
|
|
1531
|
-
|
|
1532
|
-
value.subscribe((newValue) => element.setAttribute(attributeName, newValue));
|
|
1533
1517
|
element.setAttribute(attributeName, value.val());
|
|
1534
1518
|
}
|
|
1535
1519
|
|
|
@@ -1539,10 +1523,10 @@ var NativeComponents = (function (exports) {
|
|
|
1539
1523
|
* @param {Object} attributes
|
|
1540
1524
|
*/
|
|
1541
1525
|
function AttributesWrapper(element, attributes) {
|
|
1542
|
-
const
|
|
1526
|
+
const attributesKeys = Object.keys(attributes);
|
|
1543
1527
|
|
|
1544
|
-
for(let i = 0, length =
|
|
1545
|
-
const originalAttributeName =
|
|
1528
|
+
for(let i = 0, length = attributesKeys.length; i < length; i++) {
|
|
1529
|
+
const originalAttributeName = attributesKeys[i];
|
|
1546
1530
|
const attributeName = originalAttributeName.toLowerCase();
|
|
1547
1531
|
let value = attributes[originalAttributeName];
|
|
1548
1532
|
if(value == null) {
|
|
@@ -1567,10 +1551,6 @@ var NativeComponents = (function (exports) {
|
|
|
1567
1551
|
continue;
|
|
1568
1552
|
}
|
|
1569
1553
|
|
|
1570
|
-
if(attributeName === 'value') {
|
|
1571
|
-
element.value = value;
|
|
1572
|
-
continue;
|
|
1573
|
-
}
|
|
1574
1554
|
element.setAttribute(attributeName, value);
|
|
1575
1555
|
}
|
|
1576
1556
|
return element;
|