cascade - npm Package Compare versions

Comparing version 0.7.0 to 0.7.1

dist/scripts/cascade/Cascade.d.ts

@@ -31,3 +31,3 @@ import Graph from '../graph/Graph';
     static wrapContext(callback: () => any, thisArg?: any): IObservable<any>[];
-    static createElement<T extends IVirtualNodeProps>(type: string | (new (props: T) => Component<T>), props: T, ...children: Array<any>): IVirtualNode<T>;
+    static createElement<T extends IVirtualNodeProps>(type: string | (new (props: T, children: Array<any>) => Component<T>), props: T, ...children: Array<any>): IVirtualNode<T>;
     static render(node: HTMLElement | string, virtualNode: IVirtualNode<any>): Node;
@@ -34,0 +34,0 @@ static Fragment: typeof Fragment;

dist/scripts/cascade/Cascade.js

@@ -202,9 +202,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
     static createElement(type, props, ...children) {
-        props = props || {};
-        props.children = props.children || children;
+        children = VirtualNode_1.default.fixChildrenArrays(children);
         if (typeof type === 'string') {
-            return new VirtualNode_1.default(type, props);
+            return new VirtualNode_1.default(type, props, children);
         }
         else {
-            return new ComponentNode_1.default(type, props);
+            return new ComponentNode_1.default(type, props, children);
         }
@@ -211,0 +210,0 @@ }

dist/scripts/dom/Component.d.ts

@@ -12,2 +12,3 @@ import VirtualNode from './VirtualNode';
     prevProps: T & IVirtualNodeProps;
+    children: any;
     key: string | number;
@@ -21,7 +22,7 @@ root: any;
     portal: boolean;
-    constructor(props?: T & IVirtualNodeProps);
-    storeProps(props?: T & IVirtualNodeProps): void;
+    constructor(props?: T & IVirtualNodeProps, children?: any[]);
+    storeProps(props?: T & IVirtualNodeProps, children?: any[]): void;
     build(): any;
     init(): void;
-    update(props?: T & IVirtualNodeProps): this["root"];
+    update(props?: T & IVirtualNodeProps, children?: any[]): this["root"];
     abstract render(): any;
@@ -28,0 +29,0 @@ toNode(namespace?: string, oldRoot?: any): Node;

dist/scripts/dom/Component.js

@@ -12,3 +12,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 class Component {
-    constructor(props) {
+    constructor(props, children) {
         this.uniqueId = Math.floor(Math.random() * 1000000);
@@ -18,8 +18,9 @@ this.mounted = false;
         this.portal = false;
-        this.storeProps(props);
+        this.storeProps(props, children);
     }
-    storeProps(props) {
+    storeProps(props, children) {
         this.prevProps = this.props;
-        this.props = props;
+        this.props = props || {};
         this.key = this.props.key;
+        this.children = children;
         this.afterProps(this.mounted);
@@ -70,4 +71,4 @@ }
     }
-    update(props) {
-        this.storeProps(props);
+    update(props, children) {
+        this.storeProps(props, children);
         this.rendered = false;
@@ -211,3 +212,3 @@ return Cascade_1.default.update(this, 'root');
         newRootComponentNode.component = oldRoot;
-        oldRoot.update(newRootComponentNode.props);
+        oldRoot.update(newRootComponentNode.props, newRootComponentNode.children);
         this.diffVirtualNodes(oldRoot, oldRoot, oldElement, namespace, offsetIndex);
@@ -232,3 +233,3 @@ return oldElement;
         let innerOldRoot = Cascade_1.default.peekDirty(oldRoot, 'root');
-        let innerRoot = oldRoot.update(newRootComponentNode.props);
+        let innerRoot = oldRoot.update(newRootComponentNode.props, newRootComponentNode.children);
         if (!innerOldRoot) {
@@ -327,6 +328,6 @@ switch (typeof innerRoot) {
         else {
-            var diff = Diff_1.default.compare(oldRoot.props.children, newRoot.props.children, compareVirtualNodes);
+            var diff = Diff_1.default.compare(oldRoot.children, newRoot.children, compareVirtualNodes);
             var propertyDiff = Diff_1.default.compareHash(oldRoot.props, newRoot.props);
             namespace = namespace || ((oldElement && oldElement.namespaceURI && oldElement.namespaceURI.endsWith('svg')) ? oldElement.namespaceURI : undefined);
-            var childIndex = oldRoot.props.children.length - 1 + (offsetIndex || 0);
+            var childIndex = oldRoot.children.length - 1 + (offsetIndex || 0);
             for (var index = 0, length = diff.length; index < length; index++) {
@@ -333,0 +334,0 @@ var diffItem = diff[index];

dist/scripts/dom/ComponentNode.d.ts

 import { IVirtualNode, IVirtualNodeProps } from './IVirtualNode';
 import { Component } from './Component';
 export default class ComponentNode<T> implements IVirtualNode<T> {
-    componentConstructor: new (props?: T) => Component<T>;
+    componentConstructor: new (props?: T, children?: any[]) => Component<T>;
     props: T & IVirtualNodeProps;
+    children: any;
     key: string | number;
     component: Component<T>;
-    constructor(componentConstructor: new (props?: T & IVirtualNodeProps) => Component<T>, props?: T);
+    constructor(componentConstructor: new (props?: T & IVirtualNodeProps, children?: any[]) => Component<T>, props?: T, children?: Array<any>);
     toComponent(): Component<T>;
@@ -10,0 +11,0 @@ toNode(namespace: string): Node;

dist/scripts/dom/ComponentNode.js

 Object.defineProperty(exports, "__esModule", { value: true });
 const Component_1 = require("./Component");
-const VirtualNode_1 = require("./VirtualNode");
 const Fragment_1 = require("./Fragment");
 class ComponentNode {
-    constructor(componentConstructor, props) {
+    constructor(componentConstructor, props, children) {
         this.componentConstructor = componentConstructor;
         this.props = props || {};
         this.key = this.props.key;
-        this.props.children = this.props.children ? VirtualNode_1.default.fixChildrenArrays(this.props.children) : [];
+        this.children = children;
         let context = Component_1.Component.getContext();
@@ -17,3 +16,3 @@ if (context) {
     toComponent() {
-        this.component = new this.componentConstructor(this.props);
+        this.component = new this.componentConstructor(this.props, this.children);
         if (!(this.component instanceof Fragment_1.default)) {
@@ -20,0 +19,0 @@ this.component.init();

dist/scripts/dom/Fragment.d.ts

 import { IVirtualNode, IVirtualNodeProps } from './IVirtualNode';
 export default class Fragment implements IVirtualNode<IVirtualNodeProps> {
     type: string;
-    children: any;
+    children: any[];
     props: IVirtualNodeProps;
     key: string | number;
     element: Node;
-    constructor(props?: IVirtualNodeProps);
-    storeProps(props?: IVirtualNodeProps): void;
-    update(props?: IVirtualNodeProps): void;
+    constructor(props?: IVirtualNodeProps, children?: Array<any>);
+    storeProps(props?: IVirtualNodeProps, children?: any[]): void;
+    update(props?: IVirtualNodeProps, children?: Array<any>): void;
     toNode(): DocumentFragment;
@@ -12,0 +12,0 @@ toString(): string;

dist/scripts/dom/Fragment.js

 Object.defineProperty(exports, "__esModule", { value: true });
 class Fragment {
-    constructor(props) {
-        this.storeProps(props);
+    constructor(props, children) {
+        this.storeProps(props, children);
     }
-    storeProps(props) {
-        this.props = props;
+    storeProps(props, children) {
+        this.props = props || {};
         this.key = this.props.key;
+        this.children = children;
     }
-    update(props) {
-        this.storeProps(props);
+    update(props, children) {
+        this.storeProps(props, children);
     }
     toNode() {
         var node = document.createDocumentFragment();
-        for (var index = 0, length = this.props.children.length; index < length; index++) {
-            var child = this.props.children[index];
+        for (var index = 0, length = this.children.length; index < length; index++) {
+            var child = this.children[index];
             switch (typeof child) {
@@ -61,3 +62,3 @@ case 'string':
         let childLength = 0;
-        for (let child of this.props.children) {
+        for (let child of this.children) {
             if (child !== null && child !== undefined) {
@@ -64,0 +65,0 @@ if (child.getChildLength) {

dist/scripts/dom/IVirtualNode.d.ts

 import Ref from './Ref';
 export interface IVirtualNodeProps {
-    children?: any[];
     key?: string | number;
@@ -12,2 +11,3 @@ ref?: Ref | ((node: Node) => void);
     props: T & IVirtualNodeProps;
+    children: any[];
     key: string | number;
@@ -14,0 +14,0 @@ toNode(namespace?: string): Node;

dist/scripts/dom/Portal.d.ts

 import { Component } from "./Component";
 export interface IPortalProps {
     element: HTMLElement;
+    remove?: boolean;
 }
@@ -5,0 +6,0 @@ export default class Portal extends Component<IPortalProps> {

dist/scripts/dom/Portal.js

@@ -10,8 +10,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
     render() {
-        return (Cascade_1.default.createElement("div", null, this.props.children));
+        return (Cascade_1.default.createElement("div", null, this.children));
     }
     afterRender(node, updated) {
         if (!this.props.element.contains(node)) {
-            this.props.element.appendChild(node);
+            if (!this.props.remove) {
+                this.props.element.appendChild(node);
+            }
         }
+        else {
+            if (this.props.remove) {
+                this.props.element.removeChild(node);
+            }
+        }
     }
@@ -18,0 +25,0 @@ afterDispose(node) {

dist/scripts/dom/VirtualNode.d.ts

@@ -5,5 +5,6 @@ import { IVirtualNode, IVirtualElementProps } from './IVirtualNode';
     props: T & IVirtualElementProps;
+    children: any[];
     key: string | number;
     element: Node;
-    constructor(type: string, props?: T & IVirtualElementProps);
+    constructor(type: string, props?: T & IVirtualElementProps, children?: Array<any>);
     toNode(namespace?: string): HTMLElement;
@@ -10,0 +11,0 @@ toString(): string;

dist/scripts/dom/VirtualNode.js

@@ -1,17 +0,8 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 class VirtualNode {
-    constructor(type, props) {
+    constructor(type, props, children) {
         this.type = type;
         this.props = props || {};
         this.key = this.props.key;
-        this.props.children = this.props.children ? VirtualNode.fixChildrenArrays(this.props.children) : [];
+        this.children = children;
     }
@@ -27,4 +18,4 @@ toNode(namespace) {
         }
-        for (var index = 0, length = this.props.children.length; index < length; index++) {
-            var child = this.props.children[index];
+        for (var index = 0, length = this.children.length; index < length; index++) {
+            var child = this.children[index];
             switch (typeof child) {
@@ -54,17 +45,16 @@ case 'string':
         }
-        let _a = this.props, { key, ref, children } = _a, props = __rest(_a, ["key", "ref", "children"]);
-        for (var name in props) {
-            if (props.hasOwnProperty(name)) {
-                let value = props[name];
+        for (var name in this.props) {
+            if (this.props.hasOwnProperty(name)) {
+                let value = this.props[name];
                 if (value !== undefined && value !== null) {
-                    VirtualNode.setAttribute(node, name, props[name], namespace);
+                    VirtualNode.setAttribute(node, name, this.props[name], namespace);
                 }
             }
         }
-        if (ref) {
-            if (typeof ref === 'function') {
-                ref(node);
+        if (this.props && this.props.ref) {
+            if (typeof this.props.ref === 'function') {
+                this.props.ref(node);
             }
             else {
-                ref.current = node;
+                this.props.ref.current = node;
             }
@@ -82,11 +72,13 @@ }
         fixedChildren = fixedChildren || [];
-        for (var index = 0, length = children.length; index < length; index++) {
-            var child = children[index];
-            if (typeof child !== 'undefined' && child !== null) {
-                if (child instanceof Array) {
-                    VirtualNode.fixChildrenArrays(child, fixedChildren);
+        if (children) {
+            for (var index = 0, length = children.length; index < length; index++) {
+                var child = children[index];
+                if (typeof child !== 'undefined' && child !== null) {
+                    if (child instanceof Array) {
+                        VirtualNode.fixChildrenArrays(child, fixedChildren);
+                    }
+                    else {
+                        fixedChildren.push(child);
+                    }
                 }
-                else {
-                    fixedChildren.push(child);
-                }
             }
@@ -93,0 +85,0 @@ }

package.json

 {
   "name": "cascade",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "A modern library for creating user interfaces.",
@@ -5,0 +5,0 @@ "author": "Sean Johnson <[e-mail]>",

src/scripts/cascade/Cascade.ts

@@ -340,9 +340,8 @@ import Graph from '../graph/Graph';
 
-    static createElement<T extends IVirtualNodeProps>(type: string | (new (props: T) => Component<T>), props: T, ...children: Array<any>): IVirtualNode<T> {
-        props = props || {} as any;
-        props.children = props.children || children;
+    static createElement<T extends IVirtualNodeProps>(type: string | (new (props: T, children: Array<any>) => Component<T>), props: T, ...children: Array<any>): IVirtualNode<T> {
+        children = VirtualNode.fixChildrenArrays(children);
         if (typeof type === 'string') {
-            return new VirtualNode(type, props);
+            return new VirtualNode(type, props, children);
         } else {
-            return new ComponentNode(type, props);
+            return new ComponentNode(type, props, children);
         }
@@ -349,0 +348,0 @@ }

src/scripts/dom/Component.ts

@@ -24,2 +24,3 @@ import Cascade from '../cascade/Cascade';
     prevProps: T & IVirtualNodeProps;
+    children: any;
     key: string | number;
@@ -34,10 +35,15 @@ root: any;
 
-    constructor(props?: T & IVirtualNodeProps) {
-        this.storeProps(props);
+    constructor(props?: T & IVirtualNodeProps, children?: any[]) {
+        this.storeProps(props, children);
     }
 
-    storeProps(props?: T & IVirtualNodeProps) {
+    storeProps(props?: T & IVirtualNodeProps, children?: any[]) {
         this.prevProps = this.props;
-        this.props = props;
+        this.props = props || ({} as any);
         this.key = this.props.key;
+        // TODO: Remove key and ref?
+        // if (this.props.key) {
+        // delete this.props.key;
+        // }
+        this.children = children;
         this.afterProps(this.mounted);
@@ -104,4 +110,4 @@ }
 
-    update(props?: T & IVirtualNodeProps) {
-        this.storeProps(props);
+    update(props?: T & IVirtualNodeProps, children?: any[]) {
+        this.storeProps(props, children);
         this.rendered = false;
@@ -282,3 +288,3 @@ return Cascade.update(this, 'root');
 
-        oldRoot.update(newRootComponentNode.props);
+        oldRoot.update(newRootComponentNode.props, newRootComponentNode.children);
         this.diffVirtualNodes(oldRoot as any, oldRoot as any, oldElement as any, namespace, offsetIndex);
@@ -313,3 +319,3 @@
         let innerOldRoot = Cascade.peekDirty(oldRoot, 'root');
-        let innerRoot = oldRoot.update(newRootComponentNode.props);
+        let innerRoot = oldRoot.update(newRootComponentNode.props, newRootComponentNode.children);
 
@@ -424,6 +430,6 @@ if (!innerOldRoot) {
             // Old and New Roots match
-            var diff = Diff.compare(oldRoot.props.children, newRoot.props.children, compareVirtualNodes);
+            var diff = Diff.compare(oldRoot.children, newRoot.children, compareVirtualNodes);
             var propertyDiff = Diff.compareHash(oldRoot.props, newRoot.props);
             namespace = namespace || ((oldElement && oldElement.namespaceURI && oldElement.namespaceURI.endsWith('svg')) ? oldElement.namespaceURI : undefined)
-            var childIndex = oldRoot.props.children.length - 1 + (offsetIndex || 0);
+            var childIndex = oldRoot.children.length - 1 + (offsetIndex || 0);
             for (var index = 0, length = diff.length; index < length; index++) {
@@ -430,0 +436,0 @@ var diffItem = diff[index];

src/scripts/dom/ComponentNode.ts

@@ -7,4 +7,5 @@ import { IVirtualNode, IVirtualNodeProps } from './IVirtualNode';
 export default class ComponentNode<T> implements IVirtualNode<T> {
-    componentConstructor: new (props?: T) => Component<T>;
+    componentConstructor: new (props?: T, children?: any[]) => Component<T>;
     props: T & IVirtualNodeProps;
+    children: any;
     key: string | number;
@@ -14,4 +15,5 @@ component: Component<T>;
     constructor(
-        componentConstructor: new (props?: T & IVirtualNodeProps) => Component<T>,
-        props?: T
+        componentConstructor: new (props?: T & IVirtualNodeProps, children?: any[]) => Component<T>,
+        props?: T,
+        children?: Array<any>
     ) {
@@ -21,3 +23,3 @@ this.componentConstructor = componentConstructor;
         this.key = this.props.key;
-        this.props.children = this.props.children ? VirtualNode.fixChildrenArrays(this.props.children) : [];
+        this.children = children;
 
@@ -32,3 +34,3 @@ // Push this to the current context
     toComponent(): Component<T> {
-        this.component = new this.componentConstructor(this.props);
+        this.component = new this.componentConstructor(this.props, this.children);
         if (!(this.component instanceof Fragment)) {
@@ -35,0 +37,0 @@ this.component.init();

src/scripts/dom/Fragment.ts

@@ -6,3 +6,3 @@ import VirtualNode from './VirtualNode';
     type: string;
-    children: any;
+    children: any[];
     props: IVirtualNodeProps;
@@ -12,13 +12,18 @@ key: string | number;
 
-    constructor(props?: IVirtualNodeProps) {
-        this.storeProps(props);
+    constructor(props?: IVirtualNodeProps, children?: Array<any>) {
+        this.storeProps(props, children);
     }
 
-    storeProps(props?: IVirtualNodeProps) {
-        this.props = props;
+    storeProps(props?: IVirtualNodeProps, children?: any[]) {
+        this.props = props || ({} as any);
         this.key = this.props.key;
+        // TODO: Remove key and ref?
+        // if (this.props.key) {
+        // delete this.props.key;
+        // }
+        this.children = children;
     }
 
-    update(props?: IVirtualNodeProps) {
-        this.storeProps(props);
+    update(props?: IVirtualNodeProps, children?: Array<any>) {
+        this.storeProps(props, children);
     }
@@ -28,4 +33,4 @@
         var node = document.createDocumentFragment();
-        for (var index = 0, length = this.props.children.length; index < length; index++) {
-            var child = this.props.children[index];
+        for (var index = 0, length = this.children.length; index < length; index++) {
+            var child = this.children[index];
             switch (typeof child) {
@@ -78,3 +83,3 @@ case 'string':
         let childLength = 0;
-        for (let child of this.props.children) {
+        for (let child of this.children) {
             if (child !== null && child !== undefined) {
@@ -81,0 +86,0 @@ if (child.getChildLength) {

src/scripts/dom/IVirtualNode.ts

 import Ref from './Ref';
 
 export interface IVirtualNodeProps {
-    children?: any[];
     key?: string | number;
@@ -15,2 +14,3 @@ ref?: Ref | ((node: Node) => void);
     props: T & IVirtualNodeProps;
+    children: any[];
     key: string | number;
@@ -17,0 +17,0 @@

src/scripts/dom/VirtualNode.ts

@@ -1,2 +0,2 @@
-import { IVirtualNode, IVirtualElementProps, IVirtualNodeProps } from './IVirtualNode';
+import { IVirtualNode, IVirtualElementProps } from './IVirtualNode';
 import Ref from './Ref';
@@ -7,6 +7,7 @@
     props: T & IVirtualElementProps;
+    children: any[];
     key: string | number;
     element: Node;
 
-    constructor(type: string, props?: T & IVirtualElementProps) {
+    constructor(type: string, props?: T & IVirtualElementProps, children?: Array<any>) {
         this.type = type;
@@ -19,3 +20,3 @@ this.props = props || ({} as any);
         // }
-        this.props.children = this.props.children ? VirtualNode.fixChildrenArrays(this.props.children) : [];
+        this.children = children;
     }
@@ -32,4 +33,4 @@
         }
-        for (var index = 0, length = this.props.children.length; index < length; index++) {
-            var child = this.props.children[index];
+        for (var index = 0, length = this.children.length; index < length; index++) {
+            var child = this.children[index];
             switch (typeof child) {
@@ -59,16 +60,15 @@ case 'string':
         }
-        let { key, ref, children, ...props } = this.props as IVirtualNodeProps;
-        for (var name in props) {
-            if (props.hasOwnProperty(name)) {
-                let value = props[name];
+        for (var name in this.props) {
+            if (this.props.hasOwnProperty(name)) {
+                let value = this.props[name];
                 if (value !== undefined && value !== null) {
-                    VirtualNode.setAttribute(node, name, props[name], namespace);
+                    VirtualNode.setAttribute(node, name, this.props[name], namespace);
                 }
             }
         }
-        if (ref) {
-            if (typeof ref === 'function') {
-                ref(node);
+        if (this.props && this.props.ref) {
+            if (typeof this.props.ref === 'function') {
+                this.props.ref(node);
             } else {
-                ref.current = node;
+                this.props.ref.current = node;
             }
@@ -88,10 +88,12 @@ }
         fixedChildren = fixedChildren || [];
-        for (var index = 0, length = children.length; index < length; index++) {
-            var child = children[index];
-            // Remove undefined and null elements
-            if (typeof child !== 'undefined' && child !== null) {
-                if (child instanceof Array) {
-                    VirtualNode.fixChildrenArrays(child, fixedChildren);
-                } else {
-                    fixedChildren.push(child);
+        if (children) {
+            for (var index = 0, length = children.length; index < length; index++) {
+                var child = children[index];
+                // Remove undefined and null elements
+                if (typeof child !== 'undefined' && child !== null) {
+                    if (child instanceof Array) {
+                        VirtualNode.fixChildrenArrays(child, fixedChildren);
+                    } else {
+                        fixedChildren.push(child);
+                    }
                 }
@@ -98,0 +100,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

385757

increased by0.23%

Lines of code

10553

increased by0.2%

No dependency changes