native-document 1.0.98 → 1.0.100
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/devtools/plugin/dev-tools-plugin.js +1 -1
- package/devtools/transformers/templates/hrm.orbservable.hook.template.js +8 -0
- package/dist/native-document.components.min.js +152 -90
- package/dist/native-document.dev.js +174 -112
- 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/docs/observables.md +23 -9
- package/package.json +1 -1
- package/rollup.config.js +1 -1
- package/src/core/data/ObservableArray.js +67 -0
- package/src/core/data/ObservableItem.js +1 -1
- package/src/core/data/ObservableObject.js +7 -6
- package/src/core/data/Store.js +1 -1
- package/src/core/utils/formatters.js +0 -1
- package/types/observable.d.ts +2 -0
- package/src/devtools.js +0 -9
|
@@ -10,6 +10,6 @@ export const DevToolsPlugin = {
|
|
|
10
10
|
name: 'DevTools',
|
|
11
11
|
onCreateObservable(observable) {
|
|
12
12
|
DevToolService.createdObservable.set((last) => ++last);
|
|
13
|
-
console.log('Création Capturé', observable.$value);
|
|
13
|
+
// console.log('Création Capturé', observable.$value);
|
|
14
14
|
}
|
|
15
15
|
};
|
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
|
|
2
2
|
function Observable(name, instance, value, ...args) {
|
|
3
|
+
if(value === undefined) {
|
|
4
|
+
value = name;
|
|
5
|
+
name = 'unknown';
|
|
6
|
+
}
|
|
3
7
|
if(!instance?.context) {
|
|
4
8
|
return __OriginalObservable__(value, ...args);
|
|
5
9
|
}
|
|
@@ -21,6 +25,10 @@ function Observable(name, instance, value, ...args) {
|
|
|
21
25
|
};
|
|
22
26
|
|
|
23
27
|
Observable.init = function(name, instance, value, ...args) {
|
|
28
|
+
if(value === undefined) {
|
|
29
|
+
value = name;
|
|
30
|
+
name = 'unknown';
|
|
31
|
+
}
|
|
24
32
|
if(!instance?.context) {
|
|
25
33
|
return __OriginalObservable__.init(value, ...args);
|
|
26
34
|
}
|
|
@@ -363,16 +363,16 @@ var NativeComponents = (function (exports) {
|
|
|
363
363
|
// });
|
|
364
364
|
};
|
|
365
365
|
|
|
366
|
-
let DebugManager
|
|
366
|
+
let DebugManager = {};
|
|
367
367
|
{
|
|
368
|
-
DebugManager
|
|
368
|
+
DebugManager = {
|
|
369
369
|
log() {},
|
|
370
370
|
warn() {},
|
|
371
371
|
error() {},
|
|
372
372
|
disable() {}
|
|
373
373
|
};
|
|
374
374
|
}
|
|
375
|
-
var DebugManager = DebugManager
|
|
375
|
+
var DebugManager$1 = DebugManager;
|
|
376
376
|
|
|
377
377
|
/**
|
|
378
378
|
*
|
|
@@ -857,17 +857,17 @@ var NativeComponents = (function (exports) {
|
|
|
857
857
|
const method = methods[name];
|
|
858
858
|
|
|
859
859
|
if (typeof method !== 'function') {
|
|
860
|
-
DebugManager.warn('NDElement.extend', `"${name}" is not a function, skipping`);
|
|
860
|
+
DebugManager$1.warn('NDElement.extend', `"${name}" is not a function, skipping`);
|
|
861
861
|
continue;
|
|
862
862
|
}
|
|
863
863
|
|
|
864
864
|
if (protectedMethods.has(name)) {
|
|
865
|
-
DebugManager.error('NDElement.extend', `Cannot override protected method "${name}"`);
|
|
865
|
+
DebugManager$1.error('NDElement.extend', `Cannot override protected method "${name}"`);
|
|
866
866
|
throw new NativeDocumentError(`Cannot override protected method "${name}"`);
|
|
867
867
|
}
|
|
868
868
|
|
|
869
869
|
if (NDElement.prototype[name]) {
|
|
870
|
-
DebugManager.warn('NDElement.extend', `Overwriting existing prototype method "${name}"`);
|
|
870
|
+
DebugManager$1.warn('NDElement.extend', `Overwriting existing prototype method "${name}"`);
|
|
871
871
|
}
|
|
872
872
|
|
|
873
873
|
NDElement.prototype[name] = method;
|
|
@@ -1050,7 +1050,7 @@ var NativeComponents = (function (exports) {
|
|
|
1050
1050
|
anchorFragment.appendChild = function(child, before = null) {
|
|
1051
1051
|
const parent = anchorEnd.parentNode;
|
|
1052
1052
|
if(!parent) {
|
|
1053
|
-
DebugManager.error('Anchor', 'Anchor : parent not found', child);
|
|
1053
|
+
DebugManager$1.error('Anchor', 'Anchor : parent not found', child);
|
|
1054
1054
|
return;
|
|
1055
1055
|
}
|
|
1056
1056
|
before = before ?? anchorEnd;
|
|
@@ -1234,7 +1234,7 @@ var NativeComponents = (function (exports) {
|
|
|
1234
1234
|
}
|
|
1235
1235
|
}
|
|
1236
1236
|
if (cleanedCount > 0) {
|
|
1237
|
-
DebugManager.log('Memory Auto Clean', `🧹 Cleaned ${cleanedCount} orphaned observables`);
|
|
1237
|
+
DebugManager$1.log('Memory Auto Clean', `🧹 Cleaned ${cleanedCount} orphaned observables`);
|
|
1238
1238
|
}
|
|
1239
1239
|
}
|
|
1240
1240
|
};
|
|
@@ -1374,7 +1374,7 @@ var NativeComponents = (function (exports) {
|
|
|
1374
1374
|
return cloned;
|
|
1375
1375
|
};
|
|
1376
1376
|
|
|
1377
|
-
const LocalStorage
|
|
1377
|
+
const LocalStorage = {
|
|
1378
1378
|
getJson(key) {
|
|
1379
1379
|
let value = localStorage.getItem(key);
|
|
1380
1380
|
try {
|
|
@@ -1410,23 +1410,23 @@ var NativeComponents = (function (exports) {
|
|
|
1410
1410
|
}
|
|
1411
1411
|
};
|
|
1412
1412
|
|
|
1413
|
-
const $getFromStorage
|
|
1414
|
-
if(!LocalStorage
|
|
1413
|
+
const $getFromStorage = (key, value) => {
|
|
1414
|
+
if(!LocalStorage.has(key)) {
|
|
1415
1415
|
return value;
|
|
1416
1416
|
}
|
|
1417
1417
|
switch (typeof value) {
|
|
1418
|
-
case 'object': return LocalStorage
|
|
1419
|
-
case 'boolean': return LocalStorage
|
|
1420
|
-
case 'number': return LocalStorage
|
|
1421
|
-
default: return LocalStorage
|
|
1418
|
+
case 'object': return LocalStorage.getJson(key) ?? value;
|
|
1419
|
+
case 'boolean': return LocalStorage.getBool(key) ?? value;
|
|
1420
|
+
case 'number': return LocalStorage.getNumber(key) ?? value;
|
|
1421
|
+
default: return LocalStorage.get(key, value) ?? value;
|
|
1422
1422
|
}
|
|
1423
1423
|
};
|
|
1424
1424
|
|
|
1425
|
-
const $saveToStorage
|
|
1425
|
+
const $saveToStorage = (value) => {
|
|
1426
1426
|
switch (typeof value) {
|
|
1427
|
-
case 'object': return LocalStorage
|
|
1428
|
-
case 'boolean': return LocalStorage
|
|
1429
|
-
default: return LocalStorage
|
|
1427
|
+
case 'object': return LocalStorage.setJson;
|
|
1428
|
+
case 'boolean': return LocalStorage.setBool;
|
|
1429
|
+
default: return LocalStorage.set;
|
|
1430
1430
|
}
|
|
1431
1431
|
};
|
|
1432
1432
|
|
|
@@ -1441,7 +1441,7 @@ var NativeComponents = (function (exports) {
|
|
|
1441
1441
|
const $getStoreOrThrow = (method, name) => {
|
|
1442
1442
|
const item = $stores.get(name);
|
|
1443
1443
|
if (!item) {
|
|
1444
|
-
DebugManager.error('Store', `Store.${method}('${name}') : store not found. Did you call Store.create('${name}') first?`);
|
|
1444
|
+
DebugManager$1.error('Store', `Store.${method}('${name}') : store not found. Did you call Store.create('${name}') first?`);
|
|
1445
1445
|
throw new NativeDocumentError(
|
|
1446
1446
|
`Store.${method}('${name}') : store not found.`
|
|
1447
1447
|
);
|
|
@@ -1454,7 +1454,7 @@ var NativeComponents = (function (exports) {
|
|
|
1454
1454
|
*/
|
|
1455
1455
|
const $applyReadOnly = (observer, name, context) => {
|
|
1456
1456
|
const readOnlyError = (method) => () => {
|
|
1457
|
-
DebugManager.error('Store', `Store.${context}('${name}') is read-only. '${method}()' is not allowed.`);
|
|
1457
|
+
DebugManager$1.error('Store', `Store.${context}('${name}') is read-only. '${method}()' is not allowed.`);
|
|
1458
1458
|
throw new NativeDocumentError(
|
|
1459
1459
|
`Store.${context}('${name}') is read-only.`
|
|
1460
1460
|
);
|
|
@@ -1466,12 +1466,12 @@ var NativeComponents = (function (exports) {
|
|
|
1466
1466
|
|
|
1467
1467
|
const $createObservable = (value, options = {}) => {
|
|
1468
1468
|
if(Array.isArray(value)) {
|
|
1469
|
-
return Observable
|
|
1469
|
+
return Observable.array(value, options);
|
|
1470
1470
|
}
|
|
1471
1471
|
if(typeof value === 'object') {
|
|
1472
|
-
return Observable
|
|
1472
|
+
return Observable.object(value, options);
|
|
1473
1473
|
}
|
|
1474
|
-
return Observable
|
|
1474
|
+
return Observable(value, options);
|
|
1475
1475
|
};
|
|
1476
1476
|
|
|
1477
1477
|
const $api = {
|
|
@@ -1485,7 +1485,7 @@ var NativeComponents = (function (exports) {
|
|
|
1485
1485
|
*/
|
|
1486
1486
|
create(name, value) {
|
|
1487
1487
|
if ($stores.has(name)) {
|
|
1488
|
-
DebugManager.warn('Store', `Store.create('${name}') : a store with this name already exists. Use Store.get('${name}') to retrieve it.`);
|
|
1488
|
+
DebugManager$1.warn('Store', `Store.create('${name}') : a store with this name already exists. Use Store.get('${name}') to retrieve it.`);
|
|
1489
1489
|
throw new NativeDocumentError(
|
|
1490
1490
|
`Store.create('${name}') : a store with this name already exists.`
|
|
1491
1491
|
);
|
|
@@ -1506,7 +1506,7 @@ var NativeComponents = (function (exports) {
|
|
|
1506
1506
|
*/
|
|
1507
1507
|
createResettable(name, value) {
|
|
1508
1508
|
if ($stores.has(name)) {
|
|
1509
|
-
DebugManager.warn('Store', `Store.createResettable('${name}') : a store with this name already exists.`);
|
|
1509
|
+
DebugManager$1.warn('Store', `Store.createResettable('${name}') : a store with this name already exists.`);
|
|
1510
1510
|
throw new NativeDocumentError(
|
|
1511
1511
|
`Store.createResettable('${name}') : a store with this name already exists.`
|
|
1512
1512
|
);
|
|
@@ -1542,7 +1542,7 @@ var NativeComponents = (function (exports) {
|
|
|
1542
1542
|
*/
|
|
1543
1543
|
createComposed(name, computation, dependencies) {
|
|
1544
1544
|
if ($stores.has(name)) {
|
|
1545
|
-
DebugManager.warn('Store', `Store.createComposed('${name}') : a store with this name already exists.`);
|
|
1545
|
+
DebugManager$1.warn('Store', `Store.createComposed('${name}') : a store with this name already exists.`);
|
|
1546
1546
|
throw new NativeDocumentError(
|
|
1547
1547
|
`Store.createComposed('${name}') : a store with this name already exists.`
|
|
1548
1548
|
);
|
|
@@ -1565,7 +1565,7 @@ var NativeComponents = (function (exports) {
|
|
|
1565
1565
|
}
|
|
1566
1566
|
const depItem = $stores.get(depName);
|
|
1567
1567
|
if (!depItem) {
|
|
1568
|
-
DebugManager.error('Store', `Store.createComposed('${name}') : dependency '${depName}' not found. Create it first.`);
|
|
1568
|
+
DebugManager$1.error('Store', `Store.createComposed('${name}') : dependency '${depName}' not found. Create it first.`);
|
|
1569
1569
|
throw new NativeDocumentError(
|
|
1570
1570
|
`Store.createComposed('${name}') : dependency store '${depName}' not found.`
|
|
1571
1571
|
);
|
|
@@ -1574,7 +1574,7 @@ var NativeComponents = (function (exports) {
|
|
|
1574
1574
|
});
|
|
1575
1575
|
|
|
1576
1576
|
// Create computed observable from dependency observers
|
|
1577
|
-
const observer = Observable
|
|
1577
|
+
const observer = Observable.computed(computation, depObservers);
|
|
1578
1578
|
|
|
1579
1579
|
$stores.set(name, { observer, subscribers: new Set(), resettable: false, composed: true });
|
|
1580
1580
|
return observer;
|
|
@@ -1599,13 +1599,13 @@ var NativeComponents = (function (exports) {
|
|
|
1599
1599
|
reset(name) {
|
|
1600
1600
|
const item = $getStoreOrThrow('reset', name);
|
|
1601
1601
|
if (item.composed) {
|
|
1602
|
-
DebugManager.error('Store', `Store.reset('${name}') : composed stores cannot be reset. Their value is derived from dependencies.`);
|
|
1602
|
+
DebugManager$1.error('Store', `Store.reset('${name}') : composed stores cannot be reset. Their value is derived from dependencies.`);
|
|
1603
1603
|
throw new NativeDocumentError(
|
|
1604
1604
|
`Store.reset('${name}') : composed stores cannot be reset.`
|
|
1605
1605
|
);
|
|
1606
1606
|
}
|
|
1607
1607
|
if (!item.resettable) {
|
|
1608
|
-
DebugManager.error('Store', `Store.reset('${name}') : this store is not resettable. Use Store.createResettable('${name}', value) instead of Store.create().`);
|
|
1608
|
+
DebugManager$1.error('Store', `Store.reset('${name}') : this store is not resettable. Use Store.createResettable('${name}', value) instead of Store.create().`);
|
|
1609
1609
|
throw new NativeDocumentError(
|
|
1610
1610
|
`Store.reset('${name}') : this store is not resettable. Use Store.createResettable('${name}', value) instead of Store.create().`
|
|
1611
1611
|
);
|
|
@@ -1626,7 +1626,7 @@ var NativeComponents = (function (exports) {
|
|
|
1626
1626
|
const item = $getStoreOrThrow('use', name);
|
|
1627
1627
|
|
|
1628
1628
|
if (item.composed) {
|
|
1629
|
-
DebugManager.error('Store', `Store.use('${name}') : composed stores are read-only. Use Store.follow('${name}') instead.`);
|
|
1629
|
+
DebugManager$1.error('Store', `Store.use('${name}') : composed stores are read-only. Use Store.follow('${name}') instead.`);
|
|
1630
1630
|
throw new NativeDocumentError(
|
|
1631
1631
|
`Store.use('${name}') : composed stores are read-only. Use Store.follow('${name}') instead.`
|
|
1632
1632
|
);
|
|
@@ -1693,7 +1693,7 @@ var NativeComponents = (function (exports) {
|
|
|
1693
1693
|
get(name) {
|
|
1694
1694
|
const item = $stores.get(name);
|
|
1695
1695
|
if (!item) {
|
|
1696
|
-
DebugManager.warn('Store', `Store.get('${name}') : store not found.`);
|
|
1696
|
+
DebugManager$1.warn('Store', `Store.get('${name}') : store not found.`);
|
|
1697
1697
|
return null;
|
|
1698
1698
|
}
|
|
1699
1699
|
return item.observer;
|
|
@@ -1715,7 +1715,7 @@ var NativeComponents = (function (exports) {
|
|
|
1715
1715
|
delete(name) {
|
|
1716
1716
|
const item = $stores.get(name);
|
|
1717
1717
|
if (!item) {
|
|
1718
|
-
DebugManager.warn('Store', `Store.delete('${name}') : store not found, nothing to delete.`);
|
|
1718
|
+
DebugManager$1.warn('Store', `Store.delete('${name}') : store not found, nothing to delete.`);
|
|
1719
1719
|
return;
|
|
1720
1720
|
}
|
|
1721
1721
|
item.subscribers.forEach(follower => follower.destroy());
|
|
@@ -1778,21 +1778,21 @@ var NativeComponents = (function (exports) {
|
|
|
1778
1778
|
},
|
|
1779
1779
|
createPersistent(name, value, localstorage_key) {
|
|
1780
1780
|
localstorage_key = localstorage_key || name;
|
|
1781
|
-
const observer = this.create(name, $getFromStorage
|
|
1782
|
-
const saver = $saveToStorage
|
|
1781
|
+
const observer = this.create(name, $getFromStorage(localstorage_key, value));
|
|
1782
|
+
const saver = $saveToStorage(value);
|
|
1783
1783
|
|
|
1784
1784
|
observer.subscribe((val) => saver(localstorage_key, val));
|
|
1785
1785
|
return observer;
|
|
1786
1786
|
},
|
|
1787
1787
|
createPersistentResettable(name, value, localstorage_key) {
|
|
1788
1788
|
localstorage_key = localstorage_key || name;
|
|
1789
|
-
const observer = this.createResettable(name, $getFromStorage
|
|
1790
|
-
const saver = $saveToStorage
|
|
1789
|
+
const observer = this.createResettable(name, $getFromStorage(localstorage_key, value));
|
|
1790
|
+
const saver = $saveToStorage(value);
|
|
1791
1791
|
observer.subscribe((val) => saver(localstorage_key, val));
|
|
1792
1792
|
|
|
1793
1793
|
const originalReset = observer.reset.bind(observer);
|
|
1794
1794
|
observer.reset = () => {
|
|
1795
|
-
LocalStorage
|
|
1795
|
+
LocalStorage.remove(localstorage_key);
|
|
1796
1796
|
originalReset();
|
|
1797
1797
|
};
|
|
1798
1798
|
|
|
@@ -1817,7 +1817,7 @@ var NativeComponents = (function (exports) {
|
|
|
1817
1817
|
return undefined;
|
|
1818
1818
|
},
|
|
1819
1819
|
set(target, prop, value) {
|
|
1820
|
-
DebugManager.error('Store', `Forbidden: You cannot overwrite the store key '${String(prop)}'. Use .use('${String(prop)}').set(value) instead.`);
|
|
1820
|
+
DebugManager$1.error('Store', `Forbidden: You cannot overwrite the store key '${String(prop)}'. Use .use('${String(prop)}').set(value) instead.`);
|
|
1821
1821
|
throw new NativeDocumentError(`Store structure is immutable. Use .set() on the observable.`);
|
|
1822
1822
|
},
|
|
1823
1823
|
deleteProperty(target, prop) {
|
|
@@ -1828,7 +1828,7 @@ var NativeComponents = (function (exports) {
|
|
|
1828
1828
|
|
|
1829
1829
|
const Store = StoreFactory();
|
|
1830
1830
|
|
|
1831
|
-
Store.create('locale', '
|
|
1831
|
+
Store.create('locale', navigator.language.split('-')[0] || 'en');
|
|
1832
1832
|
|
|
1833
1833
|
const $parseDateParts = (value, locale) => {
|
|
1834
1834
|
const d = new Date(value);
|
|
@@ -1864,7 +1864,6 @@ var NativeComponents = (function (exports) {
|
|
|
1864
1864
|
};
|
|
1865
1865
|
|
|
1866
1866
|
const Formatters = {
|
|
1867
|
-
|
|
1868
1867
|
currency: (value, locale, { currency = 'XOF', notation, minimumFractionDigits, maximumFractionDigits } = {}) =>
|
|
1869
1868
|
new Intl.NumberFormat(locale, {
|
|
1870
1869
|
style: 'currency',
|
|
@@ -2434,20 +2433,20 @@ var NativeComponents = (function (exports) {
|
|
|
2434
2433
|
}
|
|
2435
2434
|
|
|
2436
2435
|
const formatter = Formatters[type];
|
|
2437
|
-
const localeObservable =
|
|
2436
|
+
const localeObservable = Formatters.locale;
|
|
2438
2437
|
|
|
2439
|
-
return Observable
|
|
2438
|
+
return Observable.computed(() => formatter(self.val(), localeObservable.val(), options),
|
|
2440
2439
|
[self, localeObservable]
|
|
2441
2440
|
);
|
|
2442
2441
|
};
|
|
2443
2442
|
|
|
2444
2443
|
ObservableItem.prototype.persist = function(key, options = {}) {
|
|
2445
|
-
let value = $getFromStorage
|
|
2444
|
+
let value = $getFromStorage(key, this.$currentValue);
|
|
2446
2445
|
if(options.get) {
|
|
2447
2446
|
value = options.get(value);
|
|
2448
2447
|
}
|
|
2449
2448
|
this.set(value);
|
|
2450
|
-
const saver = $saveToStorage
|
|
2449
|
+
const saver = $saveToStorage(this.$currentValue);
|
|
2451
2450
|
this.subscribe((newValue) => {
|
|
2452
2451
|
saver(key, options.set ? options.set(newValue) : newValue);
|
|
2453
2452
|
});
|
|
@@ -2461,17 +2460,17 @@ var NativeComponents = (function (exports) {
|
|
|
2461
2460
|
* @returns {ObservableItem}
|
|
2462
2461
|
* @constructor
|
|
2463
2462
|
*/
|
|
2464
|
-
function Observable
|
|
2463
|
+
function Observable(value, configs = null) {
|
|
2465
2464
|
return new ObservableItem(value, configs);
|
|
2466
2465
|
}
|
|
2467
2466
|
|
|
2468
|
-
const $$1 = Observable
|
|
2467
|
+
const $$1 = Observable;
|
|
2469
2468
|
|
|
2470
2469
|
/**
|
|
2471
2470
|
*
|
|
2472
2471
|
* @param {string} propertyName
|
|
2473
2472
|
*/
|
|
2474
|
-
Observable
|
|
2473
|
+
Observable.useValueProperty = function(propertyName = 'value') {
|
|
2475
2474
|
Object.defineProperty(ObservableItem.prototype, propertyName, {
|
|
2476
2475
|
get() {
|
|
2477
2476
|
return this.$currentValue;
|
|
@@ -2489,7 +2488,7 @@ var NativeComponents = (function (exports) {
|
|
|
2489
2488
|
* @param id
|
|
2490
2489
|
* @returns {ObservableItem|null}
|
|
2491
2490
|
*/
|
|
2492
|
-
Observable
|
|
2491
|
+
Observable.getById = function(id) {
|
|
2493
2492
|
const item = MemoryManager.getObservableById(parseInt(id));
|
|
2494
2493
|
if(!item) {
|
|
2495
2494
|
throw new NativeDocumentError('Observable.getById : No observable found with id ' + id);
|
|
@@ -2501,7 +2500,7 @@ var NativeComponents = (function (exports) {
|
|
|
2501
2500
|
*
|
|
2502
2501
|
* @param {ObservableItem} observable
|
|
2503
2502
|
*/
|
|
2504
|
-
Observable
|
|
2503
|
+
Observable.cleanup = function(observable) {
|
|
2505
2504
|
observable.cleanup();
|
|
2506
2505
|
};
|
|
2507
2506
|
|
|
@@ -2510,7 +2509,7 @@ var NativeComponents = (function (exports) {
|
|
|
2510
2509
|
* @param {Boolean} enable
|
|
2511
2510
|
* @param {{interval:Boolean, threshold:number}} options
|
|
2512
2511
|
*/
|
|
2513
|
-
Observable
|
|
2512
|
+
Observable.autoCleanup = function(enable = false, options = {}) {
|
|
2514
2513
|
if(!enable) {
|
|
2515
2514
|
return;
|
|
2516
2515
|
}
|
|
@@ -3268,7 +3267,7 @@ var NativeComponents = (function (exports) {
|
|
|
3268
3267
|
String.prototype.use = function(args) {
|
|
3269
3268
|
const value = this;
|
|
3270
3269
|
|
|
3271
|
-
return Observable
|
|
3270
|
+
return Observable.computed(() => {
|
|
3272
3271
|
return value.replace(/\$\{(.*?)}/g, (match, key) => {
|
|
3273
3272
|
const data = args[key];
|
|
3274
3273
|
if(Validator.isObservable(data)) {
|
|
@@ -3288,7 +3287,7 @@ var NativeComponents = (function (exports) {
|
|
|
3288
3287
|
return value;
|
|
3289
3288
|
}
|
|
3290
3289
|
const [_, id] = value.match(/\{\{#ObItem::\(([0-9]+)\)\}\}/);
|
|
3291
|
-
return Observable
|
|
3290
|
+
return Observable.getById(id);
|
|
3292
3291
|
});
|
|
3293
3292
|
};
|
|
3294
3293
|
|
|
@@ -3561,7 +3560,7 @@ var NativeComponents = (function (exports) {
|
|
|
3561
3560
|
}
|
|
3562
3561
|
}
|
|
3563
3562
|
|
|
3564
|
-
const viewArray = Observable
|
|
3563
|
+
const viewArray = Observable.array();
|
|
3565
3564
|
|
|
3566
3565
|
const filters = Object.entries(filterCallbacks);
|
|
3567
3566
|
const updateView = () => {
|
|
@@ -3632,6 +3631,68 @@ var NativeComponents = (function (exports) {
|
|
|
3632
3631
|
});
|
|
3633
3632
|
};
|
|
3634
3633
|
|
|
3634
|
+
ObservableArray.prototype.deepSubscribe = function(callback) {
|
|
3635
|
+
const updatedValue = nextTick(() => callback(this.val()));
|
|
3636
|
+
const $listeners = new WeakMap();
|
|
3637
|
+
|
|
3638
|
+
const bindItem = (item) => {
|
|
3639
|
+
if ($listeners.has(item)) {
|
|
3640
|
+
return;
|
|
3641
|
+
}
|
|
3642
|
+
if (item?.__$isObservableArray) {
|
|
3643
|
+
$listeners.set(item, item.deepSubscribe(updatedValue));
|
|
3644
|
+
return;
|
|
3645
|
+
}
|
|
3646
|
+
if (item?.__$isObservable) {
|
|
3647
|
+
item.subscribe(updatedValue);
|
|
3648
|
+
$listeners.set(item, () => item.unsubscribe(updatedValue));
|
|
3649
|
+
}
|
|
3650
|
+
};
|
|
3651
|
+
|
|
3652
|
+
const unbindItem = (item) => {
|
|
3653
|
+
const unsub = $listeners.get(item);
|
|
3654
|
+
if (unsub) {
|
|
3655
|
+
unsub();
|
|
3656
|
+
$listeners.delete(item);
|
|
3657
|
+
}
|
|
3658
|
+
};
|
|
3659
|
+
|
|
3660
|
+
this.$currentValue.forEach(bindItem);
|
|
3661
|
+
this.subscribe(updatedValue);
|
|
3662
|
+
|
|
3663
|
+
this.subscribe((items, _, operations) => {
|
|
3664
|
+
switch (operations?.action) {
|
|
3665
|
+
case 'push':
|
|
3666
|
+
case 'unshift':
|
|
3667
|
+
operations.args.forEach(bindItem);
|
|
3668
|
+
break;
|
|
3669
|
+
|
|
3670
|
+
case 'splice': {
|
|
3671
|
+
const [start, deleteCount, ...newItems] = operations.args;
|
|
3672
|
+
operations.result?.forEach(unbindItem);
|
|
3673
|
+
newItems.forEach(bindItem);
|
|
3674
|
+
break;
|
|
3675
|
+
}
|
|
3676
|
+
|
|
3677
|
+
case 'remove':
|
|
3678
|
+
unbindItem(operations.result);
|
|
3679
|
+
break;
|
|
3680
|
+
|
|
3681
|
+
case 'merge':
|
|
3682
|
+
operations.args.forEach(bindItem);
|
|
3683
|
+
break;
|
|
3684
|
+
|
|
3685
|
+
case 'clear':
|
|
3686
|
+
this.$currentValue.forEach(unbindItem);
|
|
3687
|
+
break;
|
|
3688
|
+
}
|
|
3689
|
+
});
|
|
3690
|
+
|
|
3691
|
+
return () => {
|
|
3692
|
+
this.$currentValue.forEach(unbindItem);
|
|
3693
|
+
};
|
|
3694
|
+
};
|
|
3695
|
+
|
|
3635
3696
|
/**
|
|
3636
3697
|
* Creates an observable array with reactive array methods.
|
|
3637
3698
|
* All mutations trigger updates automatically.
|
|
@@ -3647,7 +3708,7 @@ var NativeComponents = (function (exports) {
|
|
|
3647
3708
|
* items.push(4); // Triggers update
|
|
3648
3709
|
* items.subscribe((arr) => console.log(arr));
|
|
3649
3710
|
*/
|
|
3650
|
-
Observable
|
|
3711
|
+
Observable.array = function(target = [], configs = null) {
|
|
3651
3712
|
return new ObservableArray(target, configs);
|
|
3652
3713
|
};
|
|
3653
3714
|
|
|
@@ -3656,8 +3717,8 @@ var NativeComponents = (function (exports) {
|
|
|
3656
3717
|
* @param {Function} callback
|
|
3657
3718
|
* @returns {Function}
|
|
3658
3719
|
*/
|
|
3659
|
-
Observable
|
|
3660
|
-
const $observer = Observable
|
|
3720
|
+
Observable.batch = function(callback) {
|
|
3721
|
+
const $observer = Observable(0);
|
|
3661
3722
|
const batch = function() {
|
|
3662
3723
|
if(Validator.isAsyncFunction(callback)) {
|
|
3663
3724
|
return (callback(...arguments)).then(() => {
|
|
@@ -3711,24 +3772,24 @@ var NativeComponents = (function (exports) {
|
|
|
3711
3772
|
if(configs?.deep !== false) {
|
|
3712
3773
|
const mappedItemValue = itemValue.map(item => {
|
|
3713
3774
|
if(Validator.isJson(item)) {
|
|
3714
|
-
return Observable
|
|
3775
|
+
return Observable.json(item, configs);
|
|
3715
3776
|
}
|
|
3716
3777
|
if(Validator.isArray(item)) {
|
|
3717
|
-
return Observable
|
|
3778
|
+
return Observable.array(item, configs);
|
|
3718
3779
|
}
|
|
3719
|
-
return Observable
|
|
3780
|
+
return Observable(item, configs);
|
|
3720
3781
|
});
|
|
3721
|
-
this.$observables[key] = Observable
|
|
3782
|
+
this.$observables[key] = Observable.array(mappedItemValue, configs);
|
|
3722
3783
|
continue;
|
|
3723
3784
|
}
|
|
3724
|
-
this.$observables[key] = Observable
|
|
3785
|
+
this.$observables[key] = Observable.array(itemValue, configs);
|
|
3725
3786
|
continue;
|
|
3726
3787
|
}
|
|
3727
3788
|
if(Validator.isObservable(itemValue) || Validator.isProxy(itemValue)) {
|
|
3728
3789
|
this.$observables[key] = itemValue;
|
|
3729
3790
|
continue;
|
|
3730
3791
|
}
|
|
3731
|
-
this.$observables[key] = Observable
|
|
3792
|
+
this.$observables[key] = (typeof itemValue === 'object') ? Observable.object(itemValue, configs) : Observable(itemValue, configs);
|
|
3732
3793
|
}
|
|
3733
3794
|
};
|
|
3734
3795
|
|
|
@@ -3790,9 +3851,9 @@ var NativeComponents = (function (exports) {
|
|
|
3790
3851
|
if(Validator.isObservable(firstElementFromOriginalValue) || Validator.isProxy(firstElementFromOriginalValue)) {
|
|
3791
3852
|
const newValues = newValue.map(item => {
|
|
3792
3853
|
if(Validator.isProxy(firstElementFromOriginalValue)) {
|
|
3793
|
-
return Observable
|
|
3854
|
+
return Observable.init(item, configs);
|
|
3794
3855
|
}
|
|
3795
|
-
return Observable
|
|
3856
|
+
return Observable(item, configs);
|
|
3796
3857
|
});
|
|
3797
3858
|
targetItem.set(newValues);
|
|
3798
3859
|
continue;
|
|
@@ -3820,7 +3881,7 @@ var NativeComponents = (function (exports) {
|
|
|
3820
3881
|
};
|
|
3821
3882
|
ObservableObject.prototype.$keys = ObservableObject.prototype.keys;
|
|
3822
3883
|
ObservableObject.prototype.clone = function() {
|
|
3823
|
-
return Observable
|
|
3884
|
+
return Observable.init(this.val(), this.configs);
|
|
3824
3885
|
};
|
|
3825
3886
|
ObservableObject.prototype.$clone = ObservableObject.prototype.clone;
|
|
3826
3887
|
ObservableObject.prototype.reset = function() {
|
|
@@ -3831,15 +3892,16 @@ var NativeComponents = (function (exports) {
|
|
|
3831
3892
|
ObservableObject.prototype.originalSubscribe = ObservableObject.prototype.subscribe;
|
|
3832
3893
|
ObservableObject.prototype.subscribe = function(callback) {
|
|
3833
3894
|
const observables = this.observables();
|
|
3834
|
-
const updatedValue = nextTick(() =>
|
|
3835
|
-
this.$currentValue = this.val();
|
|
3836
|
-
this.trigger();
|
|
3837
|
-
});
|
|
3895
|
+
const updatedValue = nextTick(() => this.trigger());
|
|
3838
3896
|
|
|
3839
3897
|
this.originalSubscribe(callback);
|
|
3840
3898
|
|
|
3841
|
-
for(let i = 0, length = observables.length; i < length; i++) {
|
|
3899
|
+
for (let i = 0, length = observables.length; i < length; i++) {
|
|
3842
3900
|
const observable = observables[i];
|
|
3901
|
+
if (observable.__$isObservableArray) {
|
|
3902
|
+
observable.deepSubscribe(updatedValue);
|
|
3903
|
+
continue
|
|
3904
|
+
}
|
|
3843
3905
|
observable.subscribe(updatedValue);
|
|
3844
3906
|
}
|
|
3845
3907
|
};
|
|
@@ -3849,7 +3911,7 @@ var NativeComponents = (function (exports) {
|
|
|
3849
3911
|
|
|
3850
3912
|
ObservableObject.prototype.update = ObservableObject.prototype.set;
|
|
3851
3913
|
|
|
3852
|
-
Observable
|
|
3914
|
+
Observable.init = function(initialValue, configs = null) {
|
|
3853
3915
|
return new ObservableObject(initialValue, configs)
|
|
3854
3916
|
};
|
|
3855
3917
|
|
|
@@ -3858,8 +3920,8 @@ var NativeComponents = (function (exports) {
|
|
|
3858
3920
|
* @param {any[]} data
|
|
3859
3921
|
* @return Proxy[]
|
|
3860
3922
|
*/
|
|
3861
|
-
Observable
|
|
3862
|
-
return data.map(item => Observable
|
|
3923
|
+
Observable.arrayOfObject = function(data) {
|
|
3924
|
+
return data.map(item => Observable.object(item));
|
|
3863
3925
|
};
|
|
3864
3926
|
|
|
3865
3927
|
/**
|
|
@@ -3867,7 +3929,7 @@ var NativeComponents = (function (exports) {
|
|
|
3867
3929
|
* @param {ObservableItem|Object<ObservableItem>} data
|
|
3868
3930
|
* @returns {{}|*|null}
|
|
3869
3931
|
*/
|
|
3870
|
-
Observable
|
|
3932
|
+
Observable.value = function(data) {
|
|
3871
3933
|
if(Validator.isObservable(data)) {
|
|
3872
3934
|
return data.val();
|
|
3873
3935
|
}
|
|
@@ -3878,15 +3940,15 @@ var NativeComponents = (function (exports) {
|
|
|
3878
3940
|
const result = [];
|
|
3879
3941
|
for(let i = 0, length = data.length; i < length; i++) {
|
|
3880
3942
|
const item = data[i];
|
|
3881
|
-
result.push(Observable
|
|
3943
|
+
result.push(Observable.value(item));
|
|
3882
3944
|
}
|
|
3883
3945
|
return result;
|
|
3884
3946
|
}
|
|
3885
3947
|
return data;
|
|
3886
3948
|
};
|
|
3887
3949
|
|
|
3888
|
-
Observable
|
|
3889
|
-
Observable
|
|
3950
|
+
Observable.object = Observable.init;
|
|
3951
|
+
Observable.json = Observable.init;
|
|
3890
3952
|
|
|
3891
3953
|
/**
|
|
3892
3954
|
* Creates a computed observable that automatically updates when its dependencies change.
|
|
@@ -3907,7 +3969,7 @@ var NativeComponents = (function (exports) {
|
|
|
3907
3969
|
* const batch = Observable.batch(() => { ... });
|
|
3908
3970
|
* const computed = Observable.computed(() => { ... }, batch);
|
|
3909
3971
|
*/
|
|
3910
|
-
Observable
|
|
3972
|
+
Observable.computed = function(callback, dependencies = []) {
|
|
3911
3973
|
const initialValue = callback();
|
|
3912
3974
|
const observable = new ObservableItem(initialValue);
|
|
3913
3975
|
const updatedValue = nextTick(() => observable.set(callback()));
|
|
@@ -7576,10 +7638,10 @@ var NativeComponents = (function (exports) {
|
|
|
7576
7638
|
this.$element = null;
|
|
7577
7639
|
this.$configs = configs;
|
|
7578
7640
|
this.$fields = new Map();
|
|
7579
|
-
this.$submitting = Observable
|
|
7580
|
-
this.$errors = Observable
|
|
7581
|
-
this.$isDirty = Observable
|
|
7582
|
-
this.$isValid = Observable
|
|
7641
|
+
this.$submitting = Observable(false);
|
|
7642
|
+
this.$errors = Observable(null);
|
|
7643
|
+
this.$isDirty = Observable(false);
|
|
7644
|
+
this.$isValid = Observable(false);
|
|
7583
7645
|
}
|
|
7584
7646
|
|
|
7585
7647
|
FormControl.defaultLayoutTemplate = null;
|
|
@@ -8900,7 +8962,7 @@ var NativeComponents = (function (exports) {
|
|
|
8900
8962
|
defaultItem: null,
|
|
8901
8963
|
value: (config?.data && Validator.isObservable(config.data))
|
|
8902
8964
|
? config.data
|
|
8903
|
-
: Observable
|
|
8965
|
+
: Observable.array(config?.data || []),
|
|
8904
8966
|
rules: null,
|
|
8905
8967
|
layout: null,
|
|
8906
8968
|
template: null,
|
|
@@ -8997,8 +9059,8 @@ var NativeComponents = (function (exports) {
|
|
|
8997
9059
|
defaultItemData = Validator.isObservable(defaultItemData)
|
|
8998
9060
|
? defaultItemData
|
|
8999
9061
|
: Validator.isObject(defaultItemData)
|
|
9000
|
-
? Observable
|
|
9001
|
-
: Observable
|
|
9062
|
+
? Observable.init(defaultItemData)
|
|
9063
|
+
: Observable(defaultItemData);
|
|
9002
9064
|
|
|
9003
9065
|
this.$items = this.$items || new WeakMap();
|
|
9004
9066
|
|
|
@@ -11480,9 +11542,9 @@ var NativeComponents = (function (exports) {
|
|
|
11480
11542
|
...configs
|
|
11481
11543
|
});
|
|
11482
11544
|
|
|
11483
|
-
this.$currentPage = Observable
|
|
11484
|
-
this.$selectedRows = Observable
|
|
11485
|
-
this.$expandedRows = Observable
|
|
11545
|
+
this.$currentPage = Observable(1);
|
|
11546
|
+
this.$selectedRows = Observable.array();
|
|
11547
|
+
this.$expandedRows = Observable.array();
|
|
11486
11548
|
}
|
|
11487
11549
|
|
|
11488
11550
|
DataTable.defaultToolbarTemplate = null;
|