intact-react - npm Package Compare versions

Comparing version 3.0.15 to 3.0.16

dist/fakePromise.d.ts

@@ -19,2 +19,4 @@ declare type Callback = () => void;
     all: AllReturn | null;
+    name?: string;
+    id: number;
     add(promise: FakePromise): void;
@@ -21,0 +23,0 @@ reset(): void;

dist/helpers.d.ts

@@ -5,2 +5,3 @@ declare type Fiber = any;
 export declare let listeningMarker: string;
+export declare function preparePortalMount(dom: HTMLElement): void;
 export {};

dist/index.cjs.dev.js

@@ -96,3 +96,3 @@ 'use strict';
 }());
-// let id = 0;
+var id = 0;
 var FakePromises = /*#__PURE__*/ /*#__PURE__*/ /** @class */ (function () {
@@ -104,4 +104,4 @@ function FakePromises() {
         this.all = null;
+        this.id = id++;
     }
-    // public id = id++;
     FakePromises.prototype.add = function (promise) {
@@ -111,3 +111,3 @@ /* istanbul ignore next */
             if (this.done) {
-                console.error('The FakePromises has done and cannot add new promise. ' +
+                console.error("The FakePromises of '".concat(this.name, "' has done and cannot add new promise. ") +
                     'Maybe it is a bug of IntactReact');
@@ -142,2 +142,13 @@ }
 var listeningMarker;
+function preparePortalMount(dom) {
+    if (dom.parentElement !== document.body)
+        return;
+    var container = document.createComment(containerComment);
+    dom.appendChild(container);
+    dom[listeningMarker] = null;
+    reactDom.render(react.createElement('template'), container, function () {
+        dom.removeChild(this);
+        dom.removeChild(container);
+    });
+}
 var bind = Function.prototype.bind;
@@ -264,3 +275,3 @@ // excerpt from react definition
         var parentComponent = getParent(this);
-        rewriteParentElementApi(parentDom, !existPortal(this) && !!parentComponent);
+        rewriteParentElementApi(parentDom, !!parentComponent);
         this.render(vNode, parentDom, parentComponent);
@@ -366,3 +377,8 @@ };
         if (!promise.resolved && parentComponent) {
-            parentComponent.$promises.add(promise);
+            var promises = parentComponent.$promises;
+            // FIXME: Is it appropriate to discard the promise directly?
+            // Unit Test: render react component which will update in render phase
+            if (!promises.done) {
+                promises.add(promise);
+            }
         }
@@ -384,15 +400,2 @@ };
 }
-function existPortal(instance) {
-    var $senior = instance.$senior;
-    do {
-        if ($senior.$isPortal) {
-            return true;
-        }
-        // $senior is rendered by React
-        if ($senior.$isReact) {
-            return false;
-        }
-    } while ($senior = $senior.$senior);
-    return false;
-}
 function rewriteParentElementApi(parentElement, preventListener) {
@@ -682,2 +685,5 @@ if (!parentElement._hasRewrite) {
             var promises = _this.$promises = new FakePromises();
+            {
+                promises.name = _this.constructor.name;
+            }
             _this.$parentPromises = intact.inject(PROMISES, null);
@@ -774,2 +780,3 @@ intact.provide(PROMISES, promises);
         this.$vNode = vNode;
+        var lastElement = intact.findDomFromVNode(vNode, false);
         var promises = this.$promises;
@@ -780,3 +787,9 @@ if (promises.done) {
             this.$update(lastVNode, vNode, this.$parentElement, null, mountedQueue, false);
-            this.$done(null);
+            this.$done(function () {
+                // maybe intact has changed the element
+                var element = intact.findDomFromVNode(vNode, false);
+                if (lastElement !== element) {
+                    updateElementOnUpdated(element, lastElement);
+                }
+            });
         }
@@ -818,2 +831,5 @@ else {
         }
+        if (this.$isPortal) {
+            preparePortalMount(intact.findDomFromVNode(this.get('children'), false));
+        }
     };
@@ -859,2 +875,5 @@ Component.prototype.$unmount = function (vNode, nextVNode) {
     parentElement.removeChild(placeholder);
+    updateElementOnUpdated(element, placeholder);
+}
+function updateElementOnUpdated(element, placeholder) {
     // replace some properties like React do
@@ -861,0 +880,0 @@ var fiber = precacheFiberNode(element, placeholder);

dist/index.cjs.prod.js

@@ -92,3 +92,3 @@ 'use strict';
 }());
-// let id = 0;
+var id = 0;
 var FakePromises = /*#__PURE__*/ /*#__PURE__*/ /** @class */ (function () {
@@ -100,4 +100,4 @@ function FakePromises() {
         this.all = null;
+        this.id = id++;
     }
-    // public id = id++;
     FakePromises.prototype.add = function (promise) {
@@ -130,2 +130,13 @@ this.value.push(promise);
 var listeningMarker;
+function preparePortalMount(dom) {
+    if (dom.parentElement !== document.body)
+        return;
+    var container = document.createComment(containerComment);
+    dom.appendChild(container);
+    dom[listeningMarker] = null;
+    reactDom.render(react.createElement('template'), container, function () {
+        dom.removeChild(this);
+        dom.removeChild(container);
+    });
+}
 var bind = Function.prototype.bind;
@@ -252,3 +263,3 @@ // excerpt from react definition
         var parentComponent = getParent(this);
-        rewriteParentElementApi(parentDom, !existPortal(this) && !!parentComponent);
+        rewriteParentElementApi(parentDom, !!parentComponent);
         this.render(vNode, parentDom, parentComponent);
@@ -354,3 +365,8 @@ };
         if (!promise.resolved && parentComponent) {
-            parentComponent.$promises.add(promise);
+            var promises = parentComponent.$promises;
+            // FIXME: Is it appropriate to discard the promise directly?
+            // Unit Test: render react component which will update in render phase
+            if (!promises.done) {
+                promises.add(promise);
+            }
         }
@@ -372,15 +388,2 @@ };
 }
-function existPortal(instance) {
-    var $senior = instance.$senior;
-    do {
-        if ($senior.$isPortal) {
-            return true;
-        }
-        // $senior is rendered by React
-        if ($senior.$isReact) {
-            return false;
-        }
-    } while ($senior = $senior.$senior);
-    return false;
-}
 function rewriteParentElementApi(parentElement, preventListener) {
@@ -745,2 +748,3 @@ if (!parentElement._hasRewrite) {
         this.$vNode = vNode;
+        var lastElement = intact.findDomFromVNode(vNode, false);
         var promises = this.$promises;
@@ -751,3 +755,9 @@ if (promises.done) {
             this.$update(lastVNode, vNode, this.$parentElement, null, mountedQueue, false);
-            this.$done(null);
+            this.$done(function () {
+                // maybe intact has changed the element
+                var element = intact.findDomFromVNode(vNode, false);
+                if (lastElement !== element) {
+                    updateElementOnUpdated(element, lastElement);
+                }
+            });
         }
@@ -789,2 +799,5 @@ else {
         }
+        if (this.$isPortal) {
+            preparePortalMount(intact.findDomFromVNode(this.get('children'), false));
+        }
     };
@@ -830,2 +843,5 @@ Component.prototype.$unmount = function (vNode, nextVNode) {
     parentElement.removeChild(placeholder);
+    updateElementOnUpdated(element, placeholder);
+}
+function updateElementOnUpdated(element, placeholder) {
     // replace some properties like React do
@@ -832,0 +848,0 @@ var fiber = precacheFiberNode(element, placeholder);

dist/index.esm.js

 import { __spreadArray, __assign, __extends } from 'tslib';
 import { removeVNodeDom, createVNode, createTextVNode, createComponentVNode, isComponentClass, validateProps, inject, provide, setInstance, findDomFromVNode, callAll, Component as Component$1 } from 'intact';
 export * from 'intact';
-import { createContext, cloneElement, createElement, forwardRef, Fragment, createRef } from 'react';
+import { createElement, createContext, cloneElement, forwardRef, Fragment, createRef } from 'react';
 import { render, unstable_renderSubtreeIntoContainer } from 'react-dom';
@@ -93,3 +93,3 @@
 }());
-// let id = 0;
+var id = 0;
 var FakePromises = /*#__PURE__*/ /*#__PURE__*/ /** @class */ (function () {
@@ -101,4 +101,4 @@ function FakePromises() {
         this.all = null;
+        this.id = id++;
     }
-    // public id = id++;
     FakePromises.prototype.add = function (promise) {
@@ -108,3 +108,3 @@ /* istanbul ignore next */
             if (this.done) {
-                console.error('The FakePromises has done and cannot add new promise. ' +
+                console.error("The FakePromises of '".concat(this.name, "' has done and cannot add new promise. ") +
                     'Maybe it is a bug of IntactReact');
@@ -139,2 +139,13 @@ }
 var listeningMarker;
+function preparePortalMount(dom) {
+    if (dom.parentElement !== document.body)
+        return;
+    var container = document.createComment(containerComment);
+    dom.appendChild(container);
+    dom[listeningMarker] = null;
+    render(createElement('template'), container, function () {
+        dom.removeChild(this);
+        dom.removeChild(container);
+    });
+}
 var bind = Function.prototype.bind;
@@ -261,3 +272,3 @@ // excerpt from react definition
         var parentComponent = getParent(this);
-        rewriteParentElementApi(parentDom, !existPortal(this) && !!parentComponent);
+        rewriteParentElementApi(parentDom, !!parentComponent);
         this.render(vNode, parentDom, parentComponent);
@@ -363,3 +374,8 @@ };
         if (!promise.resolved && parentComponent) {
-            parentComponent.$promises.add(promise);
+            var promises = parentComponent.$promises;
+            // FIXME: Is it appropriate to discard the promise directly?
+            // Unit Test: render react component which will update in render phase
+            if (!promises.done) {
+                promises.add(promise);
+            }
         }
@@ -381,15 +397,2 @@ };
 }
-function existPortal(instance) {
-    var $senior = instance.$senior;
-    do {
-        if ($senior.$isPortal) {
-            return true;
-        }
-        // $senior is rendered by React
-        if ($senior.$isReact) {
-            return false;
-        }
-    } while ($senior = $senior.$senior);
-    return false;
-}
 function rewriteParentElementApi(parentElement, preventListener) {
@@ -679,2 +682,5 @@ if (!parentElement._hasRewrite) {
             var promises = _this.$promises = new FakePromises();
+            if (process.env.NODE_ENV !== 'production') {
+                promises.name = _this.constructor.name;
+            }
             _this.$parentPromises = inject(PROMISES, null);
@@ -771,2 +777,3 @@ provide(PROMISES, promises);
         this.$vNode = vNode;
+        var lastElement = findDomFromVNode(vNode, false);
         var promises = this.$promises;
@@ -777,3 +784,9 @@ if (promises.done) {
             this.$update(lastVNode, vNode, this.$parentElement, null, mountedQueue, false);
-            this.$done(null);
+            this.$done(function () {
+                // maybe intact has changed the element
+                var element = findDomFromVNode(vNode, false);
+                if (lastElement !== element) {
+                    updateElementOnUpdated(element, lastElement);
+                }
+            });
         }
@@ -815,2 +828,5 @@ else {
         }
+        if (this.$isPortal) {
+            preparePortalMount(findDomFromVNode(this.get('children'), false));
+        }
     };
@@ -856,2 +872,5 @@ Component.prototype.$unmount = function (vNode, nextVNode) {
     parentElement.removeChild(placeholder);
+    updateElementOnUpdated(element, placeholder);
+}
+function updateElementOnUpdated(element, placeholder) {
     // replace some properties like React do
@@ -858,0 +877,0 @@ var fiber = precacheFiberNode(element, placeholder);

dist/packages/intact-react/src/fakePromise.d.ts

@@ -19,2 +19,4 @@ declare type Callback = () => void;
     all: AllReturn | null;
+    name?: string;
+    id: number;
     add(promise: FakePromise): void;
@@ -21,0 +23,0 @@ reset(): void;

dist/packages/intact-react/src/helpers.d.ts

@@ -5,2 +5,3 @@ declare type Fiber = any;
 export declare let listeningMarker: string;
+export declare function preparePortalMount(dom: HTMLElement): void;
 export {};

package.json

 {
   "name": "intact-react",
-  "version": "3.0.15",
+  "version": "3.0.16",
   "description": "A compatibility layer for running intact component in React@17",
@@ -32,5 +32,5 @@ "main": "index.js",
   "dependencies": {
-    "intact": "^3.0.15",
+    "intact": "^3.0.16",
     "tslib": "^2.3.1"
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

1017846

increased by0.71%

Number of package files

108

increased by0.93%

Lines of code

24124

increased by0.55%

Worsened metrics

Number of low supply chain risk alerts

8

increased by14.29%

Dependency changes

• Updatedintact@^3.0.16