Comparing version 0.0.10 to 0.0.11
@@ -43,2 +43,5 @@ export declare type ForgoRef<T> = { | ||
export declare function mount(forgoNode: ForgoNode, parentElement: HTMLElement | null): void; | ||
export declare function render(forgoNode: ForgoNode, fullRender?: boolean): { | ||
node: ChildNode; | ||
}; | ||
export declare function rerender(element: ForgoElementArg | undefined, props?: undefined, fullRerender?: boolean): void; |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.rerender = exports.mount = exports.setCustomEnv = void 0; | ||
exports.rerender = exports.render = exports.mount = exports.setCustomEnv = void 0; | ||
/* | ||
@@ -30,3 +30,3 @@ The element types we care about. | ||
*/ | ||
function render(forgoNode, node, pendingAttachStates, fullRerender) { | ||
function internalRender(forgoNode, node, pendingAttachStates, fullRerender) { | ||
// Just a string | ||
@@ -150,3 +150,3 @@ if (!isForgoElement(forgoNode)) { | ||
// Pass it on for rendering... | ||
return render(newForgoElement, node, statesToAttach, fullRerender); | ||
return internalRender(newForgoElement, node, statesToAttach, fullRerender); | ||
} | ||
@@ -166,3 +166,3 @@ // We have compatible state, and this is a rerender | ||
// Pass it on for rendering... | ||
return render(newForgoElement, node, statesToAttach, fullRerender); | ||
return internalRender(newForgoElement, node, statesToAttach, fullRerender); | ||
} | ||
@@ -191,3 +191,3 @@ else { | ||
// We have no node to render to yet. So pass undefined for the node. | ||
return render(newForgoElement, undefined, statesToAttach, fullRerender); | ||
return internalRender(newForgoElement, undefined, statesToAttach, fullRerender); | ||
} | ||
@@ -227,7 +227,7 @@ } | ||
childNodes[forgoChildIndex].nodeType === TEXT_NODE_TYPE) { | ||
render(stringOfPrimitiveNode(forgoChild), childNodes[forgoChildIndex], [], fullRerender); | ||
internalRender(stringOfPrimitiveNode(forgoChild), childNodes[forgoChildIndex], [], fullRerender); | ||
} | ||
// But otherwise, don't pass a replacement node. Just insert instead. | ||
else { | ||
const { node } = render(stringOfPrimitiveNode(forgoChild), undefined, [], fullRerender); | ||
const { node } = internalRender(stringOfPrimitiveNode(forgoChild), undefined, [], fullRerender); | ||
parentElement.insertBefore(node, childNodes[forgoChildIndex]); | ||
@@ -244,6 +244,6 @@ } | ||
} | ||
render(forgoChild, childNodes[forgoChildIndex], [], fullRerender); | ||
internalRender(forgoChild, childNodes[forgoChildIndex], [], fullRerender); | ||
} | ||
else { | ||
const { node } = render(forgoChild, undefined, [], fullRerender); | ||
const { node } = internalRender(forgoChild, undefined, [], fullRerender); | ||
if (childNodes.length > forgoChildIndex) { | ||
@@ -406,3 +406,3 @@ parentElement.insertBefore(node, childNodes[forgoChildIndex]); | ||
if (parentElement) { | ||
const { node } = render(forgoNode, undefined, [], true); | ||
const { node } = internalRender(forgoNode, undefined, [], true); | ||
parentElement.appendChild(node); | ||
@@ -416,2 +416,10 @@ } | ||
/* | ||
This render function returns the rendered dom node. | ||
forgoNode is the node to render. | ||
*/ | ||
function render(forgoNode, fullRender) { | ||
return internalRender(forgoNode, undefined, [], typeof fullRender === "undefined" ? false : fullRender); | ||
} | ||
exports.render = render; | ||
/* | ||
Code inside a component will call rerender whenever it wants to rerender. | ||
@@ -435,3 +443,3 @@ The following function is what they'll need to call. | ||
.concat(Object.assign(Object.assign({}, component), { props: effectiveProps })); | ||
render(forgoNode, element.node, statesToAttach, fullRerender); | ||
internalRender(forgoNode, element.node, statesToAttach, fullRerender); | ||
} | ||
@@ -438,0 +446,0 @@ else { |
{ | ||
"name": "forgo", | ||
"version": "0.0.10", | ||
"version": "0.0.11", | ||
"main": "./dist", | ||
@@ -12,2 +12,3 @@ "devDependencies": { | ||
"mocha": "^8.2.1", | ||
"rimraf": "^3.0.2", | ||
"should": "^13.2.3", | ||
@@ -17,4 +18,4 @@ "typescript": "^4.1.3" | ||
"scripts": { | ||
"build": "tsc", | ||
"build-test": "(cd test && ./build.sh)", | ||
"build": "rimraf ./dist && tsc", | ||
"build-test": "(cd test && rimraf ./dist && tsc)", | ||
"test": "mocha -r esm test/dist/test.js" | ||
@@ -21,0 +22,0 @@ }, |
@@ -165,2 +165,14 @@ # forgo | ||
## Rendering without mounting | ||
Forgo also exports a render method that returns the rendered DOM node that could then be manually mounted. | ||
```tsx | ||
const { node } = render(<Component />, false); | ||
window.addEventListener("load", () => { | ||
document.getElementById("root")!.firstElementChild!.replaceWith(node); | ||
}); | ||
``` | ||
## Try it out on CodeSandbox | ||
@@ -167,0 +179,0 @@ |
@@ -142,3 +142,3 @@ /* | ||
*/ | ||
function render( | ||
function internalRender( | ||
forgoNode: ForgoNode, | ||
@@ -308,3 +308,8 @@ node: ChildNode | undefined, | ||
// Pass it on for rendering... | ||
return render(newForgoElement, node, statesToAttach, fullRerender); | ||
return internalRender( | ||
newForgoElement, | ||
node, | ||
statesToAttach, | ||
fullRerender | ||
); | ||
} | ||
@@ -335,3 +340,8 @@ // We have compatible state, and this is a rerender | ||
// Pass it on for rendering... | ||
return render(newForgoElement, node, statesToAttach, fullRerender); | ||
return internalRender( | ||
newForgoElement, | ||
node, | ||
statesToAttach, | ||
fullRerender | ||
); | ||
} else { | ||
@@ -362,3 +372,8 @@ return { node }; | ||
// We have no node to render to yet. So pass undefined for the node. | ||
return render(newForgoElement, undefined, statesToAttach, fullRerender); | ||
return internalRender( | ||
newForgoElement, | ||
undefined, | ||
statesToAttach, | ||
fullRerender | ||
); | ||
} | ||
@@ -413,3 +428,3 @@ } | ||
) { | ||
render( | ||
internalRender( | ||
stringOfPrimitiveNode(forgoChild), | ||
@@ -423,3 +438,3 @@ childNodes[forgoChildIndex], | ||
else { | ||
const { node } = render( | ||
const { node } = internalRender( | ||
stringOfPrimitiveNode(forgoChild), | ||
@@ -450,5 +465,15 @@ undefined, | ||
} | ||
render(forgoChild, childNodes[forgoChildIndex], [], fullRerender); | ||
internalRender( | ||
forgoChild, | ||
childNodes[forgoChildIndex], | ||
[], | ||
fullRerender | ||
); | ||
} else { | ||
const { node } = render(forgoChild, undefined, [], fullRerender); | ||
const { node } = internalRender( | ||
forgoChild, | ||
undefined, | ||
[], | ||
fullRerender | ||
); | ||
if (childNodes.length > forgoChildIndex) { | ||
@@ -642,3 +667,3 @@ parentElement.insertBefore(node, childNodes[forgoChildIndex]); | ||
if (parentElement) { | ||
const { node } = render(forgoNode, undefined, [], true); | ||
const { node } = internalRender(forgoNode, undefined, [], true); | ||
parentElement.appendChild(node); | ||
@@ -651,2 +676,15 @@ } else { | ||
/* | ||
This render function returns the rendered dom node. | ||
forgoNode is the node to render. | ||
*/ | ||
export function render(forgoNode: ForgoNode, fullRender?: boolean) { | ||
return internalRender( | ||
forgoNode, | ||
undefined, | ||
[], | ||
typeof fullRender === "undefined" ? false : fullRender | ||
); | ||
} | ||
/* | ||
Code inside a component will call rerender whenever it wants to rerender. | ||
@@ -685,3 +723,3 @@ The following function is what they'll need to call. | ||
render(forgoNode, element.node, statesToAttach, fullRerender); | ||
internalRender(forgoNode, element.node, statesToAttach, fullRerender); | ||
} else { | ||
@@ -688,0 +726,0 @@ throw new Error( |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
72174
1220
323
9