native-document 1.0.149 → 1.0.150
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/cdn.components.js +28 -0
- package/dist/native-document.components.min.js +101 -144
- package/dist/native-document.dev.js +3207 -3250
- package/dist/native-document.dev.js.map +1 -1
- package/dist/native-document.min.js +1 -1
- package/elements.js +1 -4
- package/index.js +0 -4
- package/package.json +1 -1
- package/src/core/elements/fragment.js +8 -0
- package/src/core/elements/index.js +1 -9
- package/src/core/utils/prototypes.js +0 -46
- package/src/ui/components/accordion/AccordionRender.js +1 -0
- package/src/ui/components/alert/AlertRender.js +2 -1
- package/src/ui/components/avatar/avata-group/AvatarGroupRender.js +1 -0
- package/src/ui/components/badge/BadgeRender.js +1 -0
- package/src/ui/components/breadcrumb/BreadcrumbRender.js +1 -0
- package/src/ui/components/contextmenu/ContextmenuRender.js +0 -2
- package/src/ui/components/dropdown/DropdownRender.js +1 -1
- package/src/ui/components/form/FieldCollectionRender.js +1 -1
- package/src/ui/components/form/FormControlRender.js +2 -1
- package/src/ui/components/form/fields/AutocompleteFieldRender.js +3 -3
- package/src/ui/components/form/fields/CheckboxFieldRender.js +1 -1
- package/src/ui/components/form/fields/CheckboxGroupFieldRender.js +1 -1
- package/src/ui/components/form/fields/DateFieldRender.js +2 -1
- package/src/ui/components/form/fields/FieldRender.js +2 -1
- package/src/ui/components/form/fields/HiddenFieldRender.js +0 -1
- package/src/ui/components/form/fields/PasswordFieldRender.js +1 -1
- package/src/ui/components/form/fields/RadioFieldRender.js +1 -1
- package/src/ui/components/form/fields/RangeFieldRender.js +1 -0
- package/src/ui/components/form/fields/SelectFieldRender.js +2 -2
- package/src/ui/components/form/fields/SliderFieldRender.js +2 -2
- package/src/ui/components/form/fields/TimeFieldRender.js +1 -0
- package/src/ui/components/form/file-upload-mode/FileAvatarModeRender.js +2 -2
- package/src/ui/components/form/file-upload-mode/FileDropzoneModeRender.js +2 -2
- package/src/ui/components/form/file-upload-mode/FileWallModeRender.js +1 -2
- package/src/ui/components/menu/MenuGroupRender.js +0 -1
- package/src/ui/components/menu/MenuItemRender.js +1 -1
- package/src/ui/components/menu/MenuLinkRender.js +1 -1
- package/src/ui/components/menu/MenuRender.js +1 -0
- package/src/ui/components/modal/ModalRender.js +1 -2
- package/src/ui/components/pagination/PaginationRender.js +2 -2
- package/src/ui/components/popover/PopoverRender.js +1 -2
- package/src/ui/components/skeleton/SkeletonRender.js +1 -0
- package/src/ui/components/spinner/SpinnerRender.js +2 -1
- package/src/ui/components/splitter/SplitterRender.js +1 -0
- package/src/ui/components/stacks/PositionStackRender.js +1 -0
- package/src/ui/components/stacks/StackRender.js +0 -1
- package/src/ui/components/stacks/v-stack/VStackRender.js +1 -0
- package/src/ui/components/stepper/StepperRender.js +2 -1
- package/src/ui/components/stepper/StepperStepRender.js +1 -1
- package/src/ui/components/switch/SwitchRender.js +1 -0
- package/src/ui/components/table/data-table/DataTableRender.js +2 -1
- package/src/ui/components/table/data-table/bulk-actions.js +1 -2
- package/src/ui/components/table/data-table/pagination.js +1 -1
- package/src/ui/components/table/data-table/tables.js +1 -1
- package/src/ui/components/table/simple-table/SimpleTableRender.js +3 -2
- package/src/ui/components/tabs/TabsRender.js +1 -1
- package/src/ui/components/toast/ToastRender.js +2 -1
- package/src/ui/theme.js +0 -6
- package/src/ui/theme.scss +1 -0
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
export * from './src/components/accordion/index';
|
|
2
|
+
export * from './src/components/alert/index';
|
|
3
|
+
export * from './src/components/avatar/index';
|
|
4
|
+
export * from './src/components/badge/index';
|
|
5
|
+
export * from './src/components/breadcrumb/index';
|
|
6
|
+
export * from './src/components/button/index';
|
|
7
|
+
export * from './src/components/card/index';
|
|
8
|
+
export * from './src/components/context-menu/index';
|
|
9
|
+
export * from './src/components/divider/index';
|
|
10
|
+
export * from './src/components/dropdown/index';
|
|
11
|
+
export * from './src/components/form/index';
|
|
12
|
+
export * from './src/components/list/index';
|
|
13
|
+
export * from './src/components/menu/index';
|
|
14
|
+
export * from './src/components/modal/index';
|
|
15
|
+
export * from './src/components/pagination/index';
|
|
16
|
+
export * from './src/components/popover/index';
|
|
17
|
+
export * from './src/components/progress/index';
|
|
18
|
+
export * from './src/components/skeleton/index';
|
|
19
|
+
export * from './src/components/slider/index';
|
|
20
|
+
export * from './src/components/spinner/index';
|
|
21
|
+
export * from './src/components/splitter/index';
|
|
22
|
+
export * from './src/components/stepper/index';
|
|
23
|
+
export * from './src/components/switch/index';
|
|
24
|
+
export * from './src/components/table/index';
|
|
25
|
+
export * from './src/components/tabs/index';
|
|
26
|
+
export * from './src/components/toast/index';
|
|
27
|
+
export * from './src/components/tooltip/index';
|
|
28
|
+
export * from './src/components/stacks/index';
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
var NativeComponents = (function (exports) {
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
let DebugManager$
|
|
4
|
+
let DebugManager$2 = {};
|
|
5
5
|
{
|
|
6
|
-
DebugManager$
|
|
6
|
+
DebugManager$2 = {
|
|
7
7
|
log() {},
|
|
8
8
|
warn() {},
|
|
9
9
|
error() {},
|
|
10
10
|
disable() {}
|
|
11
11
|
};
|
|
12
12
|
}
|
|
13
|
-
var DebugManager$
|
|
13
|
+
var DebugManager$1 = DebugManager$2;
|
|
14
14
|
|
|
15
15
|
class NativeDocumentError extends Error {
|
|
16
16
|
constructor(message, context = {}) {
|
|
@@ -68,7 +68,7 @@ var NativeComponents = (function (exports) {
|
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
70
|
if (cleanedCount > 0) {
|
|
71
|
-
DebugManager$
|
|
71
|
+
DebugManager$1.log('Memory Auto Clean', `🧹 Cleaned ${cleanedCount} orphaned observables`);
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
74
|
};
|
|
@@ -2235,22 +2235,6 @@ var NativeComponents = (function (exports) {
|
|
|
2235
2235
|
return withValidation(this);
|
|
2236
2236
|
};
|
|
2237
2237
|
|
|
2238
|
-
Function.prototype.cached = function(...args) {
|
|
2239
|
-
let $cache;
|
|
2240
|
-
let getCache = () => $cache;
|
|
2241
|
-
return () => {
|
|
2242
|
-
if(!$cache) {
|
|
2243
|
-
$cache = this.apply(this, args);
|
|
2244
|
-
if($cache.cloneNode) {
|
|
2245
|
-
getCache = () => $cache.cloneNode(true);
|
|
2246
|
-
} else if($cache.$element) {
|
|
2247
|
-
getCache = () => new NDElement($cache.$element.cloneNode(true));
|
|
2248
|
-
}
|
|
2249
|
-
}
|
|
2250
|
-
return getCache();
|
|
2251
|
-
};
|
|
2252
|
-
};
|
|
2253
|
-
|
|
2254
2238
|
Function.prototype.errorBoundary = function(callback) {
|
|
2255
2239
|
const handler = (...args) => {
|
|
2256
2240
|
try {
|
|
@@ -2262,33 +2246,6 @@ var NativeComponents = (function (exports) {
|
|
|
2262
2246
|
return handler;
|
|
2263
2247
|
};
|
|
2264
2248
|
|
|
2265
|
-
String.prototype.use = function(args) {
|
|
2266
|
-
const value = this;
|
|
2267
|
-
|
|
2268
|
-
return Observable.computed(() => {
|
|
2269
|
-
return value.replace(/\$\{(.*?)}/g, (match, key) => {
|
|
2270
|
-
const data = args[key];
|
|
2271
|
-
if(Validator.isObservable(data)) {
|
|
2272
|
-
return data.val();
|
|
2273
|
-
}
|
|
2274
|
-
return data;
|
|
2275
|
-
});
|
|
2276
|
-
}, Object.values(args));
|
|
2277
|
-
};
|
|
2278
|
-
|
|
2279
|
-
String.prototype.resolveObservableTemplate = function() {
|
|
2280
|
-
if(!Validator.containsObservableReference(this)) {
|
|
2281
|
-
return this.valueOf();
|
|
2282
|
-
}
|
|
2283
|
-
return this.split(/(\{\{#ObItem::\([0-9]+\)\}\})/g).filter(Boolean).map((value) => {
|
|
2284
|
-
if(!Validator.containsObservableReference(value)) {
|
|
2285
|
-
return value;
|
|
2286
|
-
}
|
|
2287
|
-
const [_, id] = value.match(/\{\{#ObItem::\(([0-9]+)\)\}\}/);
|
|
2288
|
-
return Observable.getById(id);
|
|
2289
|
-
});
|
|
2290
|
-
};
|
|
2291
|
-
|
|
2292
2249
|
const cssPropertyAccumulator = function(initialValue = {}) {
|
|
2293
2250
|
let data = Validator.isString(initialValue) ? initialValue.split(';').filter(Boolean) : initialValue;
|
|
2294
2251
|
|
|
@@ -3303,7 +3260,7 @@ var NativeComponents = (function (exports) {
|
|
|
3303
3260
|
const $getStoreOrThrow = (method, name) => {
|
|
3304
3261
|
const item = $stores.get(name);
|
|
3305
3262
|
if (!item) {
|
|
3306
|
-
DebugManager$
|
|
3263
|
+
DebugManager$1.error('Store', `Store.${method}('${name}') : store not found. Did you call Store.create('${name}') first?`);
|
|
3307
3264
|
throw new NativeDocumentError(
|
|
3308
3265
|
`Store.${method}('${name}') : store not found.`
|
|
3309
3266
|
);
|
|
@@ -3316,7 +3273,7 @@ var NativeComponents = (function (exports) {
|
|
|
3316
3273
|
*/
|
|
3317
3274
|
const $applyReadOnly = (observer, name, context) => {
|
|
3318
3275
|
const readOnlyError = (method) => () => {
|
|
3319
|
-
DebugManager$
|
|
3276
|
+
DebugManager$1.error('Store', `Store.${context}('${name}') is read-only. '${method}()' is not allowed.`);
|
|
3320
3277
|
throw new NativeDocumentError(
|
|
3321
3278
|
`Store.${context}('${name}') is read-only.`
|
|
3322
3279
|
);
|
|
@@ -3347,7 +3304,7 @@ var NativeComponents = (function (exports) {
|
|
|
3347
3304
|
*/
|
|
3348
3305
|
create(name, value) {
|
|
3349
3306
|
if ($stores.has(name)) {
|
|
3350
|
-
DebugManager$
|
|
3307
|
+
DebugManager$1.warn('Store', `Store.create('${name}') : a store with this name already exists. Use Store.get('${name}') to retrieve it.`);
|
|
3351
3308
|
throw new NativeDocumentError(
|
|
3352
3309
|
`Store.create('${name}') : a store with this name already exists.`
|
|
3353
3310
|
);
|
|
@@ -3368,7 +3325,7 @@ var NativeComponents = (function (exports) {
|
|
|
3368
3325
|
*/
|
|
3369
3326
|
createResettable(name, value) {
|
|
3370
3327
|
if ($stores.has(name)) {
|
|
3371
|
-
DebugManager$
|
|
3328
|
+
DebugManager$1.warn('Store', `Store.createResettable('${name}') : a store with this name already exists.`);
|
|
3372
3329
|
throw new NativeDocumentError(
|
|
3373
3330
|
`Store.createResettable('${name}') : a store with this name already exists.`
|
|
3374
3331
|
);
|
|
@@ -3404,7 +3361,7 @@ var NativeComponents = (function (exports) {
|
|
|
3404
3361
|
*/
|
|
3405
3362
|
createComposed(name, computation, dependencies) {
|
|
3406
3363
|
if ($stores.has(name)) {
|
|
3407
|
-
DebugManager$
|
|
3364
|
+
DebugManager$1.warn('Store', `Store.createComposed('${name}') : a store with this name already exists.`);
|
|
3408
3365
|
throw new NativeDocumentError(
|
|
3409
3366
|
`Store.createComposed('${name}') : a store with this name already exists.`
|
|
3410
3367
|
);
|
|
@@ -3427,7 +3384,7 @@ var NativeComponents = (function (exports) {
|
|
|
3427
3384
|
}
|
|
3428
3385
|
const depItem = $stores.get(depName);
|
|
3429
3386
|
if (!depItem) {
|
|
3430
|
-
DebugManager$
|
|
3387
|
+
DebugManager$1.error('Store', `Store.createComposed('${name}') : dependency '${depName}' not found. Create it first.`);
|
|
3431
3388
|
throw new NativeDocumentError(
|
|
3432
3389
|
`Store.createComposed('${name}') : dependency store '${depName}' not found.`
|
|
3433
3390
|
);
|
|
@@ -3461,13 +3418,13 @@ var NativeComponents = (function (exports) {
|
|
|
3461
3418
|
reset(name) {
|
|
3462
3419
|
const item = $getStoreOrThrow('reset', name);
|
|
3463
3420
|
if (item.composed) {
|
|
3464
|
-
DebugManager$
|
|
3421
|
+
DebugManager$1.error('Store', `Store.reset('${name}') : composed stores cannot be reset. Their value is derived from dependencies.`);
|
|
3465
3422
|
throw new NativeDocumentError(
|
|
3466
3423
|
`Store.reset('${name}') : composed stores cannot be reset.`
|
|
3467
3424
|
);
|
|
3468
3425
|
}
|
|
3469
3426
|
if (!item.resettable) {
|
|
3470
|
-
DebugManager$
|
|
3427
|
+
DebugManager$1.error('Store', `Store.reset('${name}') : this store is not resettable. Use Store.createResettable('${name}', value) instead of Store.create().`);
|
|
3471
3428
|
throw new NativeDocumentError(
|
|
3472
3429
|
`Store.reset('${name}') : this store is not resettable. Use Store.createResettable('${name}', value) instead of Store.create().`
|
|
3473
3430
|
);
|
|
@@ -3488,7 +3445,7 @@ var NativeComponents = (function (exports) {
|
|
|
3488
3445
|
const item = $getStoreOrThrow('use', name);
|
|
3489
3446
|
|
|
3490
3447
|
if (item.composed) {
|
|
3491
|
-
DebugManager$
|
|
3448
|
+
DebugManager$1.error('Store', `Store.use('${name}') : composed stores are read-only. Use Store.follow('${name}') instead.`);
|
|
3492
3449
|
throw new NativeDocumentError(
|
|
3493
3450
|
`Store.use('${name}') : composed stores are read-only. Use Store.follow('${name}') instead.`
|
|
3494
3451
|
);
|
|
@@ -3555,7 +3512,7 @@ var NativeComponents = (function (exports) {
|
|
|
3555
3512
|
get(name) {
|
|
3556
3513
|
const item = $stores.get(name);
|
|
3557
3514
|
if (!item) {
|
|
3558
|
-
DebugManager$
|
|
3515
|
+
DebugManager$1.warn('Store', `Store.get('${name}') : store not found.`);
|
|
3559
3516
|
return null;
|
|
3560
3517
|
}
|
|
3561
3518
|
return item.observer;
|
|
@@ -3577,7 +3534,7 @@ var NativeComponents = (function (exports) {
|
|
|
3577
3534
|
delete(name) {
|
|
3578
3535
|
const item = $stores.get(name);
|
|
3579
3536
|
if (!item) {
|
|
3580
|
-
DebugManager$
|
|
3537
|
+
DebugManager$1.warn('Store', `Store.delete('${name}') : store not found, nothing to delete.`);
|
|
3581
3538
|
return;
|
|
3582
3539
|
}
|
|
3583
3540
|
item.subscribers.forEach(follower => follower.destroy());
|
|
@@ -3679,7 +3636,7 @@ var NativeComponents = (function (exports) {
|
|
|
3679
3636
|
return undefined;
|
|
3680
3637
|
},
|
|
3681
3638
|
set(target, prop, value) {
|
|
3682
|
-
DebugManager$
|
|
3639
|
+
DebugManager$1.error('Store', `Forbidden: You cannot overwrite the store key '${String(prop)}'. Use .use('${String(prop)}').set(value) instead.`);
|
|
3683
3640
|
throw new NativeDocumentError(`Store structure is immutable. Use .set() on the observable.`);
|
|
3684
3641
|
},
|
|
3685
3642
|
deleteProperty(target, prop) {
|
|
@@ -3692,65 +3649,6 @@ var NativeComponents = (function (exports) {
|
|
|
3692
3649
|
|
|
3693
3650
|
Store.create('locale', navigator.language.split('-')[0] || 'en');
|
|
3694
3651
|
|
|
3695
|
-
/**
|
|
3696
|
-
* Conditionally shows an element based on an observable condition.
|
|
3697
|
-
* The element is mounted/unmounted from the DOM as the condition changes.
|
|
3698
|
-
*
|
|
3699
|
-
* @param {ObservableItem<boolean>|ObservableChecker<boolean>|ObservableWhen} condition - Observable condition to watch
|
|
3700
|
-
* @param {NdChild|(() => NdChild)} child - Element or content to show/hide
|
|
3701
|
-
* @param {Object} [options={}] - Configuration options
|
|
3702
|
-
* @param {string|null} [options.comment=null] - Comment for debugging
|
|
3703
|
-
* @param {boolean} [options.shouldKeepInCache=true] - Whether to cache the element when hidden
|
|
3704
|
-
* @returns {AnchorDocumentFragment} Anchor fragment managing the conditional content
|
|
3705
|
-
* @example
|
|
3706
|
-
* const isVisible = Observable(false);
|
|
3707
|
-
* ShowIf(isVisible, Div({}, 'Hello World'));
|
|
3708
|
-
*/
|
|
3709
|
-
const ShowIf = function(condition, child, { comment = null, shouldKeepInCache = true} = {}) {
|
|
3710
|
-
if(!Validator.isObservable(condition)) {
|
|
3711
|
-
if(typeof condition === "boolean") {
|
|
3712
|
-
return condition ? ElementCreator.getChild(child) : null;
|
|
3713
|
-
}
|
|
3714
|
-
|
|
3715
|
-
return DebugManager$2.warn('ShowIf', "ShowIf : condition must be an Observable or boolean / "+comment, condition);
|
|
3716
|
-
}
|
|
3717
|
-
const element = Anchor('Show if : '+(comment || ''));
|
|
3718
|
-
|
|
3719
|
-
let childElement = null;
|
|
3720
|
-
const getChildElement = () => {
|
|
3721
|
-
if(childElement && shouldKeepInCache) {
|
|
3722
|
-
return childElement;
|
|
3723
|
-
}
|
|
3724
|
-
childElement = ElementCreator.getChild(child);
|
|
3725
|
-
if(Validator.isFragment(childElement)) {
|
|
3726
|
-
childElement = Array.from(childElement.childNodes);
|
|
3727
|
-
}
|
|
3728
|
-
return childElement;
|
|
3729
|
-
};
|
|
3730
|
-
|
|
3731
|
-
const currentValue = condition.val();
|
|
3732
|
-
|
|
3733
|
-
if(currentValue) {
|
|
3734
|
-
element.appendChild(getChildElement());
|
|
3735
|
-
}
|
|
3736
|
-
|
|
3737
|
-
condition.subscribe((value) => {
|
|
3738
|
-
if(!!value) {
|
|
3739
|
-
element.appendChild(getChildElement());
|
|
3740
|
-
return;
|
|
3741
|
-
}
|
|
3742
|
-
element.remove();
|
|
3743
|
-
});
|
|
3744
|
-
|
|
3745
|
-
return element;
|
|
3746
|
-
};
|
|
3747
|
-
|
|
3748
|
-
/**
|
|
3749
|
-
* Creates a `<div>` element.
|
|
3750
|
-
* @type {function(GlobalAttributes=, NdChild|NdChild[]=): HTMLDivElement}
|
|
3751
|
-
*/
|
|
3752
|
-
const Div = HtmlElementWrapper('div');
|
|
3753
|
-
|
|
3754
3652
|
function oneChildAnchorOverwriting(anchor, parent) {
|
|
3755
3653
|
|
|
3756
3654
|
anchor.remove = () => {
|
|
@@ -4162,7 +4060,7 @@ var NativeComponents = (function (exports) {
|
|
|
4162
4060
|
const method = methods[name];
|
|
4163
4061
|
|
|
4164
4062
|
if (typeof method !== 'function') {
|
|
4165
|
-
DebugManager$
|
|
4063
|
+
DebugManager$1.warn(`⚠️ extends(): "${name}" is not a function, skipping`);
|
|
4166
4064
|
continue;
|
|
4167
4065
|
}
|
|
4168
4066
|
|
|
@@ -4212,17 +4110,17 @@ var NativeComponents = (function (exports) {
|
|
|
4212
4110
|
const method = methods[name];
|
|
4213
4111
|
|
|
4214
4112
|
if (typeof method !== 'function') {
|
|
4215
|
-
DebugManager$
|
|
4113
|
+
DebugManager$1.warn('NDElement.extend', `"${name}" is not a function, skipping`);
|
|
4216
4114
|
continue;
|
|
4217
4115
|
}
|
|
4218
4116
|
|
|
4219
4117
|
if (protectedMethods.has(name)) {
|
|
4220
|
-
DebugManager$
|
|
4118
|
+
DebugManager$1.error('NDElement.extend', `Cannot override protected method "${name}"`);
|
|
4221
4119
|
throw new NativeDocumentError(`Cannot override protected method "${name}"`);
|
|
4222
4120
|
}
|
|
4223
4121
|
|
|
4224
4122
|
if (NDElement.prototype[name]) {
|
|
4225
|
-
DebugManager$
|
|
4123
|
+
DebugManager$1.warn('NDElement.extend', `Overwriting existing prototype method "${name}"`);
|
|
4226
4124
|
}
|
|
4227
4125
|
|
|
4228
4126
|
NDElement.prototype[name] = method;
|
|
@@ -4391,7 +4289,7 @@ var NativeComponents = (function (exports) {
|
|
|
4391
4289
|
const regex = new RegExp(pattern, flags);
|
|
4392
4290
|
return regex.test(String(value));
|
|
4393
4291
|
} catch (error){
|
|
4394
|
-
DebugManager$
|
|
4292
|
+
DebugManager$1.warn('Invalid regex pattern:', pattern, error);
|
|
4395
4293
|
return false;
|
|
4396
4294
|
}
|
|
4397
4295
|
}
|
|
@@ -4404,6 +4302,65 @@ var NativeComponents = (function (exports) {
|
|
|
4404
4302
|
);
|
|
4405
4303
|
}
|
|
4406
4304
|
|
|
4305
|
+
/**
|
|
4306
|
+
* Conditionally shows an element based on an observable condition.
|
|
4307
|
+
* The element is mounted/unmounted from the DOM as the condition changes.
|
|
4308
|
+
*
|
|
4309
|
+
* @param {ObservableItem<boolean>|ObservableChecker<boolean>|ObservableWhen} condition - Observable condition to watch
|
|
4310
|
+
* @param {NdChild|(() => NdChild)} child - Element or content to show/hide
|
|
4311
|
+
* @param {Object} [options={}] - Configuration options
|
|
4312
|
+
* @param {string|null} [options.comment=null] - Comment for debugging
|
|
4313
|
+
* @param {boolean} [options.shouldKeepInCache=true] - Whether to cache the element when hidden
|
|
4314
|
+
* @returns {AnchorDocumentFragment} Anchor fragment managing the conditional content
|
|
4315
|
+
* @example
|
|
4316
|
+
* const isVisible = Observable(false);
|
|
4317
|
+
* ShowIf(isVisible, Div({}, 'Hello World'));
|
|
4318
|
+
*/
|
|
4319
|
+
const ShowIf = function(condition, child, { comment = null, shouldKeepInCache = true} = {}) {
|
|
4320
|
+
if(!Validator.isObservable(condition)) {
|
|
4321
|
+
if(typeof condition === "boolean") {
|
|
4322
|
+
return condition ? ElementCreator.getChild(child) : null;
|
|
4323
|
+
}
|
|
4324
|
+
|
|
4325
|
+
return DebugManager$1.warn('ShowIf', "ShowIf : condition must be an Observable or boolean / "+comment, condition);
|
|
4326
|
+
}
|
|
4327
|
+
const element = Anchor('Show if : '+(comment || ''));
|
|
4328
|
+
|
|
4329
|
+
let childElement = null;
|
|
4330
|
+
const getChildElement = () => {
|
|
4331
|
+
if(childElement && shouldKeepInCache) {
|
|
4332
|
+
return childElement;
|
|
4333
|
+
}
|
|
4334
|
+
childElement = ElementCreator.getChild(child);
|
|
4335
|
+
if(Validator.isFragment(childElement)) {
|
|
4336
|
+
childElement = Array.from(childElement.childNodes);
|
|
4337
|
+
}
|
|
4338
|
+
return childElement;
|
|
4339
|
+
};
|
|
4340
|
+
|
|
4341
|
+
const currentValue = condition.val();
|
|
4342
|
+
|
|
4343
|
+
if(currentValue) {
|
|
4344
|
+
element.appendChild(getChildElement());
|
|
4345
|
+
}
|
|
4346
|
+
|
|
4347
|
+
condition.subscribe((value) => {
|
|
4348
|
+
if(!!value) {
|
|
4349
|
+
element.appendChild(getChildElement());
|
|
4350
|
+
return;
|
|
4351
|
+
}
|
|
4352
|
+
element.remove();
|
|
4353
|
+
});
|
|
4354
|
+
|
|
4355
|
+
return element;
|
|
4356
|
+
};
|
|
4357
|
+
|
|
4358
|
+
/**
|
|
4359
|
+
* Creates a `<div>` element.
|
|
4360
|
+
* @type {function(GlobalAttributes=, NdChild|NdChild[]=): HTMLDivElement}
|
|
4361
|
+
*/
|
|
4362
|
+
const Div = HtmlElementWrapper('div');
|
|
4363
|
+
|
|
4407
4364
|
/**
|
|
4408
4365
|
*
|
|
4409
4366
|
* @class
|
|
@@ -5117,7 +5074,7 @@ var NativeComponents = (function (exports) {
|
|
|
5117
5074
|
|
|
5118
5075
|
Alert.preset = function(name, callback) {
|
|
5119
5076
|
if (Alert.prototype[name] || Alert[name]) {
|
|
5120
|
-
DebugManager$
|
|
5077
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Alert.`);
|
|
5121
5078
|
return;
|
|
5122
5079
|
}
|
|
5123
5080
|
Alert[name] = (content, props) => callback(new Alert(content, props));
|
|
@@ -5425,7 +5382,7 @@ var NativeComponents = (function (exports) {
|
|
|
5425
5382
|
|
|
5426
5383
|
Button.preset = function(name, callback) {
|
|
5427
5384
|
if (Button.prototype[name] || Button[name]) {
|
|
5428
|
-
DebugManager$
|
|
5385
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Button.`);
|
|
5429
5386
|
return;
|
|
5430
5387
|
}
|
|
5431
5388
|
Button[name] = (label, props) => callback(new Button(label, props));
|
|
@@ -5594,7 +5551,7 @@ var NativeComponents = (function (exports) {
|
|
|
5594
5551
|
|
|
5595
5552
|
Avatar.preset = function(name, callback) {
|
|
5596
5553
|
if (Avatar.prototype[name] || Avatar[name]) {
|
|
5597
|
-
DebugManager$
|
|
5554
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in Avatar.`);
|
|
5598
5555
|
return;
|
|
5599
5556
|
}
|
|
5600
5557
|
Avatar[name] = (label, props) => callback(new Avatar(label, props));
|
|
@@ -6016,7 +5973,7 @@ var NativeComponents = (function (exports) {
|
|
|
6016
5973
|
|
|
6017
5974
|
Badge.preset = function(name, callback) {
|
|
6018
5975
|
if (Badge.prototype[name] || Badge[name]) {
|
|
6019
|
-
DebugManager$
|
|
5976
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in Badge.`);
|
|
6020
5977
|
return;
|
|
6021
5978
|
}
|
|
6022
5979
|
Badge[name] = (content, props) => callback(new Badge(content, props));
|
|
@@ -6134,7 +6091,7 @@ var NativeComponents = (function (exports) {
|
|
|
6134
6091
|
|
|
6135
6092
|
Breadcrumb.preset = function(name, callback) {
|
|
6136
6093
|
if (Breadcrumb.prototype[name] || Breadcrumb[name]) {
|
|
6137
|
-
DebugManager$
|
|
6094
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Breadcrumb.`);
|
|
6138
6095
|
return;
|
|
6139
6096
|
}
|
|
6140
6097
|
Breadcrumb[name] = (props) => callback(new Breadcrumb(props));
|
|
@@ -6943,7 +6900,7 @@ var NativeComponents = (function (exports) {
|
|
|
6943
6900
|
|
|
6944
6901
|
Divider.preset = function(name, callback) {
|
|
6945
6902
|
if (Divider.prototype[name] || Divider[name]) {
|
|
6946
|
-
DebugManager$
|
|
6903
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in Divider.`);
|
|
6947
6904
|
return;
|
|
6948
6905
|
}
|
|
6949
6906
|
Divider[name] = (label, props) => callback(new Divider(label, props));
|
|
@@ -7362,7 +7319,7 @@ var NativeComponents = (function (exports) {
|
|
|
7362
7319
|
|
|
7363
7320
|
Dropdown.preset = function(name, callback) {
|
|
7364
7321
|
if (Dropdown.prototype[name] || Dropdown[name]) {
|
|
7365
|
-
DebugManager$
|
|
7322
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Dropdown.`);
|
|
7366
7323
|
return;
|
|
7367
7324
|
}
|
|
7368
7325
|
Dropdown[name] = (props) => callback(new Dropdown(props));
|
|
@@ -11417,7 +11374,7 @@ var NativeComponents = (function (exports) {
|
|
|
11417
11374
|
|
|
11418
11375
|
Modal.preset = function(name, callback) {
|
|
11419
11376
|
if (Modal.prototype[name] || Modal[name]) {
|
|
11420
|
-
DebugManager$
|
|
11377
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Modal.`);
|
|
11421
11378
|
return;
|
|
11422
11379
|
}
|
|
11423
11380
|
Modal[name] = (content, props) => callback(new Modal(content, props));
|
|
@@ -11668,7 +11625,7 @@ var NativeComponents = (function (exports) {
|
|
|
11668
11625
|
|
|
11669
11626
|
Pagination.preset = function(name, callback) {
|
|
11670
11627
|
if (Pagination.prototype[name] || Pagination[name]) {
|
|
11671
|
-
DebugManager$
|
|
11628
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Pagination.`);
|
|
11672
11629
|
return;
|
|
11673
11630
|
}
|
|
11674
11631
|
Pagination[name] = (props) => callback(new Pagination(props));
|
|
@@ -11963,7 +11920,7 @@ var NativeComponents = (function (exports) {
|
|
|
11963
11920
|
|
|
11964
11921
|
Popover.preset = function(name, callback) {
|
|
11965
11922
|
if (Popover.prototype[name] || Popover[name]) {
|
|
11966
|
-
DebugManager$
|
|
11923
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Popover.`);
|
|
11967
11924
|
return;
|
|
11968
11925
|
}
|
|
11969
11926
|
Popover[name] = (content, props) => callback(new Popover(content, props));
|
|
@@ -12265,7 +12222,7 @@ var NativeComponents = (function (exports) {
|
|
|
12265
12222
|
|
|
12266
12223
|
Progress.preset = function(name, callback) {
|
|
12267
12224
|
if (Progress.prototype[name] || Progress[name]) {
|
|
12268
|
-
DebugManager$
|
|
12225
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in Progress.`);
|
|
12269
12226
|
return;
|
|
12270
12227
|
}
|
|
12271
12228
|
Progress[name] = (props) => callback(new Progress(props));
|
|
@@ -12567,7 +12524,7 @@ var NativeComponents = (function (exports) {
|
|
|
12567
12524
|
|
|
12568
12525
|
VStack.preset = function(name, callback) {
|
|
12569
12526
|
if (VStack.prototype[name] || VStack[name]) {
|
|
12570
|
-
DebugManager$
|
|
12527
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in VStack.`);
|
|
12571
12528
|
return;
|
|
12572
12529
|
}
|
|
12573
12530
|
VStack[name] = (content, props) => callback(new VStack(content, props));
|
|
@@ -12742,7 +12699,7 @@ var NativeComponents = (function (exports) {
|
|
|
12742
12699
|
|
|
12743
12700
|
FixedStack.preset = function(name, callback) {
|
|
12744
12701
|
if(FixedStack.prototype[name] || FixedStack[name]) {
|
|
12745
|
-
DebugManager$
|
|
12702
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in FixedStack.`);
|
|
12746
12703
|
return;
|
|
12747
12704
|
}
|
|
12748
12705
|
FixedStack[name] = (content, props) => callback(new FixedStack(content, props));
|
|
@@ -12772,7 +12729,7 @@ var NativeComponents = (function (exports) {
|
|
|
12772
12729
|
|
|
12773
12730
|
HStack.preset = function(name, callback) {
|
|
12774
12731
|
if (HStack.prototype[name] || HStack[name]) {
|
|
12775
|
-
DebugManager$
|
|
12732
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in HStack.`);
|
|
12776
12733
|
return;
|
|
12777
12734
|
}
|
|
12778
12735
|
HStack[name] = (content, props) => callback(new HStack(content, props));
|
|
@@ -12802,7 +12759,7 @@ var NativeComponents = (function (exports) {
|
|
|
12802
12759
|
|
|
12803
12760
|
AbsoluteStack.preset = function(name, callback) {
|
|
12804
12761
|
if(AbsoluteStack.prototype[name] || AbsoluteStack[name]) {
|
|
12805
|
-
DebugManager$
|
|
12762
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in AbsoluteStack.`);
|
|
12806
12763
|
return;
|
|
12807
12764
|
}
|
|
12808
12765
|
AbsoluteStack[name] = (content, props) => callback(new AbsoluteStack(content, props));
|
|
@@ -12832,7 +12789,7 @@ var NativeComponents = (function (exports) {
|
|
|
12832
12789
|
|
|
12833
12790
|
RelativeStack.preset = function(name, callback) {
|
|
12834
12791
|
if(RelativeStack.prototype[name] || RelativeStack[name]) {
|
|
12835
|
-
DebugManager$
|
|
12792
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in RelativeStack.`);
|
|
12836
12793
|
return;
|
|
12837
12794
|
}
|
|
12838
12795
|
RelativeStack[name] = (content, props) => callback(new RelativeStack(content, props));
|
|
@@ -12877,7 +12834,7 @@ var NativeComponents = (function (exports) {
|
|
|
12877
12834
|
|
|
12878
12835
|
Skeleton.preset = function(name, callback) {
|
|
12879
12836
|
if (Skeleton.prototype[name] || Skeleton[name]) {
|
|
12880
|
-
DebugManager$
|
|
12837
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in Skeleton.`);
|
|
12881
12838
|
return;
|
|
12882
12839
|
}
|
|
12883
12840
|
Skeleton[name] = (props) => callback(new Skeleton(props));
|
|
@@ -13241,7 +13198,7 @@ var NativeComponents = (function (exports) {
|
|
|
13241
13198
|
|
|
13242
13199
|
Spinner.preset = function(name, callback) {
|
|
13243
13200
|
if (Spinner.prototype[name] || Spinner[name]) {
|
|
13244
|
-
DebugManager$
|
|
13201
|
+
DebugManager$1.warn(`Warning: the ${name} method already exists in Spinner.`);
|
|
13245
13202
|
return;
|
|
13246
13203
|
}
|
|
13247
13204
|
Spinner[name] = (props) => callback(new Spinner(props));
|
|
@@ -13811,7 +13768,7 @@ var NativeComponents = (function (exports) {
|
|
|
13811
13768
|
|
|
13812
13769
|
Stepper.preset = function(name, callback) {
|
|
13813
13770
|
if (Stepper.prototype[name] || Stepper[name]) {
|
|
13814
|
-
DebugManager$
|
|
13771
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Stepper.`);
|
|
13815
13772
|
return;
|
|
13816
13773
|
}
|
|
13817
13774
|
Stepper[name] = (props) => callback(new Stepper(props));
|
|
@@ -14764,7 +14721,7 @@ var NativeComponents = (function (exports) {
|
|
|
14764
14721
|
|
|
14765
14722
|
DataTable.prototype.selectedRows = function($obs) {
|
|
14766
14723
|
if(!$obs.__$isObservableArray) {
|
|
14767
|
-
DebugManager$
|
|
14724
|
+
DebugManager$1.warn('Database', 'selectedRow should take an Observable array');
|
|
14768
14725
|
}
|
|
14769
14726
|
this.$description.$selectedRows = $obs;
|
|
14770
14727
|
return this;
|
|
@@ -15311,7 +15268,7 @@ var NativeComponents = (function (exports) {
|
|
|
15311
15268
|
|
|
15312
15269
|
Tooltip.preset = function(name, callback) {
|
|
15313
15270
|
if (Tooltip.prototype[name] || Tooltip[name]) {
|
|
15314
|
-
DebugManager$
|
|
15271
|
+
DebugManager$1.warn(`Warning: the ${name} method already exist in Tooltip.`);
|
|
15315
15272
|
return;
|
|
15316
15273
|
}
|
|
15317
15274
|
Tooltip[name] = (content, props) => callback(new Tooltip(content, props));
|