pome-ui 2.0.0-preview34 → 2.0.0-preview35

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.
Files changed (5) hide show
  1. package/package.json +1 -1
  2. package/pome-ui.dev.js +110 -85
  3. package/pome-ui.dev.min.js +23 -23
  4. package/pome-ui.js +110 -86
  5. package/pome-ui.min.js +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pome-ui",
3
- "version": "2.0.0-preview34",
3
+ "version": "2.0.0-preview35",
4
4
  "description": "Front-end MVC library",
5
5
  "main": "pome-ui.js",
6
6
  "bin": {
package/pome-ui.dev.js CHANGED
@@ -5239,6 +5239,7 @@ If this is a native custom element, make sure to exclude it from component resol
5239
5239
  $watch: (i) => instanceWatch.bind(i),
5240
5240
  $containers: i => i.$containers,
5241
5241
  $container: i => i.$container,
5242
+ $delayClose: i => i.$delayClose,
5242
5243
  $data: i => i.$data,
5243
5244
  $created: i => i.$created,
5244
5245
  $unmounted: i => i.$unmounted,
@@ -18376,6 +18377,7 @@ function build(options, exports) {
18376
18377
  instance.$created = component.created || function () { };
18377
18378
  instance.$mounted = component.mounted || function () { };
18378
18379
  instance.$unmounted = component.unmounted || function () { };
18380
+ instance.$delayClose = component.delayClose || 0;
18379
18381
  _attachContainer(instance);
18380
18382
  }
18381
18383
 
@@ -18472,111 +18474,133 @@ function build(options, exports) {
18472
18474
  currentProxy = instance.$.proxy;
18473
18475
  }
18474
18476
 
18477
+ var p = Promise.resolve();
18475
18478
  if (!this.active || this.active.$view != url || !_options.reuseContainerActiveView()) {
18476
- this.close();
18479
+ p = this.close();
18477
18480
  }
18478
18481
 
18479
18482
  var self = this;
18480
18483
 
18481
- params = generateParametersFromRoute(params);
18482
- _parseQueryString(params);
18483
- if (_options.reuseContainerActiveView() && this.active?.$view == url) {
18484
- var reuseComponentFunc = function (container) {
18485
- var p = Promise.resolve();
18486
- if (!container || !container.active) {
18487
- return p;
18488
- }
18484
+ return p.then(function () {
18485
+ var p = Promise.resolve();
18486
+ params = generateParametersFromRoute(params);
18487
+ _parseQueryString(params);
18488
+ if (_options.reuseContainerActiveView() && self.active?.$view == url) {
18489
+ var reuseComponentFunc = function (container) {
18490
+ if (!container || !container.active) {
18491
+ return p;
18492
+ }
18489
18493
 
18490
- if (_options.callUnmountedWhenReuseContainerActiveView(container.active.$view)) {
18491
- p = p.then(function () {
18492
- var val = container.active.$unmounted();
18493
- if (val instanceof Promise) {
18494
- return val;
18495
- } else {
18496
- return Promise.resolve();
18497
- }
18498
- });
18499
- }
18500
- p = p.then(function () {
18501
- var initData = container.active.$data();
18502
- if (_options.resetDataWhenReuseContainerActiveView()) {
18503
- _combineObject(initData, container.active);
18494
+ if (_options.callUnmountedWhenReuseContainerActiveView(container.active.$view)) {
18495
+ p = p.then(function () {
18496
+ var val = container.active.$unmounted();
18497
+ if (val instanceof Promise) {
18498
+ return val;
18499
+ } else {
18500
+ return Promise.resolve();
18501
+ }
18502
+ });
18504
18503
  }
18505
- _combineObject(params, container.active);
18506
- return Promise.resolve();
18507
- });
18508
- if (_options.callCreatedWhenReuseContainerActiveView(container.active.$view)) {
18509
- p = p.then(function () {
18510
- var val = container.active.$created();
18511
- if (val instanceof Promise) {
18512
- return val;
18513
- } else {
18514
- return Promise.resolve();
18515
- }
18516
- });
18517
- }
18518
- if (_options.callMountedWhenReuseContainerActiveView(container.active.$view)) {
18519
18504
  p = p.then(function () {
18520
- var val = container.active.$mounted();
18521
- if (val instanceof Promise) {
18522
- return val;
18523
- } else {
18524
- return Promise.resolve();
18505
+ var initData = container.active.$data();
18506
+ if (_options.resetDataWhenReuseContainerActiveView()) {
18507
+ _combineObject(initData, container.active);
18525
18508
  }
18509
+ _combineObject(params, container.active);
18510
+ return Promise.resolve();
18526
18511
  });
18527
- }
18512
+ if (_options.callCreatedWhenReuseContainerActiveView(container.active.$view)) {
18513
+ p = p.then(function () {
18514
+ var val = container.active.$created();
18515
+ if (val instanceof Promise) {
18516
+ return val;
18517
+ } else {
18518
+ return Promise.resolve();
18519
+ }
18520
+ });
18521
+ }
18522
+ if (_options.callMountedWhenReuseContainerActiveView(container.active.$view)) {
18523
+ p = p.then(function () {
18524
+ var val = container.active.$mounted();
18525
+ if (val instanceof Promise) {
18526
+ return val;
18527
+ } else {
18528
+ return Promise.resolve();
18529
+ }
18530
+ });
18531
+ }
18528
18532
 
18529
- if (container.active.$containers && container.active.$containers.length) {
18530
- for (var i = 0; i < container.active.$containers.length; ++i) {
18531
- reuseComponentFunc(container.active.$containers[i]);
18533
+ if (container.active.$containers && container.active.$containers.length) {
18534
+ for (var i = 0; i < container.active.$containers.length; ++i) {
18535
+ reuseComponentFunc(container.active.$containers[i]);
18536
+ }
18532
18537
  }
18533
- }
18534
18538
 
18535
- return p.then(function () { container.active.$forceUpdate(); return Promise.resolve(container.active) });
18539
+ return p.then(function () { container.active.$forceUpdate(); return Promise.resolve(container.active) });
18536
18540
 
18541
+ }
18542
+ return Promise.resolve(reuseComponentFunc(self));
18537
18543
  }
18538
- return Promise.resolve(reuseComponentFunc(this));
18539
- }
18540
18544
 
18541
- var _result;
18542
- var retryLeft = 20;
18543
- var buildRetryPromise = function () {
18544
- return new Promise(function (res, rej) {
18545
- var active = _result.mount(self.selector);
18546
- if (active) {
18547
- self.active = active;
18548
- return Promise.resolve(active);
18549
- }
18545
+ var _result;
18546
+ var retryLeft = 20;
18547
+ var buildRetryPromise = function () {
18548
+ var final = new Promise(function (res, rej) {
18549
+ var active = _result.mount(self.selector);
18550
+ if (active) {
18551
+ self.active = active;
18552
+ return Promise.resolve(active);
18553
+ }
18550
18554
 
18551
- if (--retryLeft > 0) {
18552
- return sleep(50).then(function () {
18553
- return buildRetryPromise();
18554
- });
18555
- } else {
18556
- return Promise.reject('Mount component to ' + self.selector + ' failed');
18557
- }
18558
- });
18559
- };
18555
+ if (--retryLeft > 0) {
18556
+ return sleep(50).then(function () {
18557
+ return buildRetryPromise();
18558
+ });
18559
+ } else {
18560
+ return Promise.reject('Mount component to ' + self.selector + ' failed');
18561
+ }
18562
+ });
18563
+ return final;
18564
+ };
18560
18565
 
18561
- return _buildApp(url, params, mobile, currentProxy).then(function (result) {
18562
- _result = result;
18563
- return buildRetryPromise();
18566
+ return _buildApp(url, params, mobile, currentProxy).then(function (result) {
18567
+ _result = result;
18568
+ return buildRetryPromise();
18569
+ });
18564
18570
  });
18565
18571
  },
18566
- close: function (recurse = true) {
18567
- function liftClose(container) {
18572
+ close: async function (recurse = true) {
18573
+ async function liftClose(container) {
18568
18574
  if (container.active && container.active.$) {
18569
18575
  if (recurse) {
18570
18576
  for (var i = 0; i < container.active.$containers.length; ++i) {
18571
18577
  liftClose(container.active.$containers[i]);
18572
18578
  }
18573
18579
  }
18574
- container.active.$.appContext.app.unmount();
18580
+
18581
+ if (container.active.$delayClose) {
18582
+ console.log(container.active.$el);
18583
+ try {
18584
+ if (container.active.$el && container.active.$el.nextElementSibling) {
18585
+ container.active.$el.nextElementSibling?.classList?.add('_pome-ui-closing');
18586
+ }
18587
+ } catch (ex) {
18588
+ console.warn(ex);
18589
+ }
18590
+ console.log(`sleeping ${container.active.$delayClose}ms...`);
18591
+ await sleep(container.active.$delayClose);
18592
+ }
18593
+
18594
+ try {
18595
+ container.active.$.appContext.app.unmount();
18596
+ } catch (ex) {
18597
+ console.warn(ex);
18598
+ }
18575
18599
  container.active = null;
18576
18600
  }
18577
18601
  }
18578
-
18579
- liftClose(this);
18602
+
18603
+ await liftClose(this);
18580
18604
  },
18581
18605
  active: null
18582
18606
  };
@@ -19112,16 +19136,17 @@ function build(options, exports) {
19112
19136
  var val = params[fields[i]];
19113
19137
  exports.root()[fields[i]] = val;
19114
19138
  }
19115
-
19116
- exports.root().$containers[0].open(route.view, params);
19117
- var promise = Promise.resolve();
19118
- if (typeof exports.root().$.$onUpdating == 'function') {
19119
- var result = exports.root().$.$onUpdating.call(exports.root());
19120
- if (result instanceof Promise) {
19121
- promise = result;
19139
+
19140
+ return exports.root().$containers[0].open(route.view, params).then(function () {
19141
+ var promise = Promise.resolve();
19142
+ if (typeof exports.root().$.$onUpdating == 'function') {
19143
+ var result = exports.root().$.$onUpdating.call(exports.root());
19144
+ if (result instanceof Promise) {
19145
+ promise = promise.then(() => result);
19146
+ }
19122
19147
  }
19123
- }
19124
- return promise;
19148
+ return promise;
19149
+ });
19125
19150
  }
19126
19151
 
19127
19152
  exports.root().$.appContext.app.unmount();