UNPKG

devextreme

Version:

HTML5 JavaScript Component Suite for Responsive Web Development

214 lines (203 loc) • 8.81 kB
/** * DevExtreme (cjs/__internal/core/r1/runtime/inferno/mocked/hydrate.js) * Version: 25.1.3 * Build date: Wed Jun 25 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/ */ "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.hydrate = hydrate; var _inferno = require("inferno"); var _shared = require("./shared"); var _vnodeFlags = require("./vnode-flags"); function isSameInnerHTML(dom, innerHTML) { const tempdom = document.createElement("i"); tempdom.innerHTML = innerHTML; return tempdom.innerHTML === dom.innerHTML } function findLastDOMFromVNode(vNode) { let flags; let children; while (vNode) { flags = vNode.flags; if (flags & _vnodeFlags.VNodeFlags.DOMRef) { return vNode.dom } children = vNode.children; if (flags & _vnodeFlags.VNodeFlags.Fragment) { vNode = vNode.childFlags === _vnodeFlags.ChildFlags.HasVNodeChildren ? children : children[children.length - 1] } else if (flags & _vnodeFlags.VNodeFlags.ComponentClass) { vNode = children.$LI } else { vNode = children } } return null } function isSamePropsInnerHTML(dom, props) { return Boolean(props && props.dangerouslySetInnerHTML && props.dangerouslySetInnerHTML.__html && isSameInnerHTML(dom, props.dangerouslySetInnerHTML.__html)) } function hydrateComponent(vNode, parentDOM, dom, context, isSVG, isClass, lifecycle, animations) { const type = vNode.type; const ref = vNode.ref; const props = vNode.props || _inferno.EMPTY_OBJ; let currentNode; if (isClass) { const instance = (0, _inferno._CI)(vNode, type, props, context, isSVG, lifecycle); const input = instance.$LI; currentNode = hydrateVNode(input, parentDOM, dom, instance.$CX, isSVG, lifecycle, animations); (0, _inferno._MCCC)(ref, instance, lifecycle, animations) } else { const input = (0, _inferno._HI)((0, _inferno._RFC)(vNode, context)); currentNode = hydrateVNode(input, parentDOM, dom, context, isSVG, lifecycle, animations); vNode.children = input; (0, _inferno._MFCC)(vNode, lifecycle, animations) } return currentNode } function hydrateChildren(parentVNode, parentNode, currentNode, context, isSVG, lifecycle, animations) { const childFlags = parentVNode.childFlags; const children = parentVNode.children; const props = parentVNode.props; const flags = parentVNode.flags; if (childFlags !== _vnodeFlags.ChildFlags.HasInvalidChildren) { if (childFlags === _vnodeFlags.ChildFlags.HasVNodeChildren) { if ((0, _shared.isNull)(currentNode)) { (0, _inferno._M)(children, parentNode, context, isSVG, null, lifecycle, animations) } else { currentNode = hydrateVNode(children, parentNode, currentNode, context, isSVG, lifecycle, animations); currentNode = currentNode ? currentNode.nextSibling : null } } else if (childFlags === _vnodeFlags.ChildFlags.HasTextChildren) { if ((0, _shared.isNull)(currentNode)) { parentNode.appendChild(document.createTextNode(children)) } else if (1 !== parentNode.childNodes.length || 3 !== currentNode.nodeType) { parentNode.textContent = children } else if (currentNode.nodeValue !== children) { currentNode.nodeValue = children } currentNode = null } else if (childFlags & _vnodeFlags.ChildFlags.MultipleChildren) { let prevVNodeIsTextNode = false; for (let i = 0, len = children.length; i < len; ++i) { const child = children[i]; if ((0, _shared.isNull)(currentNode) || prevVNodeIsTextNode && (child.flags & _vnodeFlags.VNodeFlags.Text) > 0) { (0, _inferno._M)(child, parentNode, context, isSVG, currentNode, lifecycle, animations) } else { currentNode = hydrateVNode(child, parentNode, currentNode, context, isSVG, lifecycle, animations); currentNode = currentNode ? currentNode.nextSibling : null } prevVNodeIsTextNode = (child.flags & _vnodeFlags.VNodeFlags.Text) > 0 } } if (0 === (flags & _vnodeFlags.VNodeFlags.Fragment)) { let nextSibling = null; while (currentNode) { nextSibling = currentNode.nextSibling; parentNode.removeChild(currentNode); currentNode = nextSibling } } } else if (!(0, _shared.isNull)(parentNode.firstChild) && !isSamePropsInnerHTML(parentNode, props)) { parentNode.textContent = ""; if (flags & _vnodeFlags.VNodeFlags.FormElement) { parentNode.defaultValue = "" } } } function hydrateElement(vNode, parentDOM, dom, context, isSVG, lifecycle, animations) { const props = vNode.props; const className = vNode.className; const flags = vNode.flags; const ref = vNode.ref; isSVG = isSVG || (flags & _vnodeFlags.VNodeFlags.SvgElement) > 0; if (1 !== dom.nodeType) { (0, _inferno._ME)(vNode, null, context, isSVG, null, lifecycle, animations); parentDOM.replaceChild(vNode.dom, dom) } else { vNode.dom = dom; hydrateChildren(vNode, dom, dom.firstChild, context, isSVG, lifecycle, animations); if (!(0, _shared.isNull)(props)) { (0, _inferno._MP)(vNode, flags, props, dom, isSVG, animations) } if ((0, _shared.isNullOrUndef)(className)) { if ("" !== dom.className) { dom.removeAttribute("class") } } else if (isSVG) { dom.setAttribute("class", className) } else { dom.className = className }(0, _inferno._MR)(ref, dom, lifecycle) } return vNode.dom } function hydrateText(vNode, parentDOM, dom) { if (3 !== dom.nodeType) { parentDOM.replaceChild(vNode.dom = document.createTextNode(vNode.children), dom) } else { const text = vNode.children; if (dom.nodeValue !== text) { dom.nodeValue = text } vNode.dom = dom } return vNode.dom } function hydrateFragment(vNode, parentDOM, dom, context, isSVG, lifecycle, animations) { const children = vNode.children; if (vNode.childFlags === _vnodeFlags.ChildFlags.HasVNodeChildren) { hydrateText(children, parentDOM, dom); return children.dom } hydrateChildren(vNode, parentDOM, dom, context, isSVG, lifecycle, animations); return findLastDOMFromVNode(children[children.length - 1]) } function hydrateVNode(vNode, parentDOM, currentDom, context, isSVG, lifecycle, animations) { const flags = vNode.flags |= _vnodeFlags.VNodeFlags.InUse; if (flags & _vnodeFlags.VNodeFlags.Component) { return hydrateComponent(vNode, parentDOM, currentDom, context, isSVG, (flags & _vnodeFlags.VNodeFlags.ComponentClass) > 0, lifecycle, animations) } if (flags & _vnodeFlags.VNodeFlags.Element) { return hydrateElement(vNode, parentDOM, currentDom, context, isSVG, lifecycle, animations) } if (flags & _vnodeFlags.VNodeFlags.Text) { return hydrateText(vNode, parentDOM, currentDom) } if (flags & _vnodeFlags.VNodeFlags.Void) { return vNode.dom = currentDom } if (flags & _vnodeFlags.VNodeFlags.Fragment) { return hydrateFragment(vNode, parentDOM, currentDom, context, isSVG, lifecycle, animations) }(0, _shared.throwError)(); return null } function hydrate(input, parentDOM, callback) { let dom = parentDOM.firstChild; if ((0, _shared.isNull)(dom)) { (0, _inferno.render)(input, parentDOM, callback) } else { const lifecycle = []; const animations = new _inferno.AnimationQueues; if (!(0, _shared.isInvalid)(input)) { dom = hydrateVNode(input, parentDOM, dom, {}, false, lifecycle, animations) } while (dom && (dom = dom.nextSibling)) { parentDOM.removeChild(dom) } if (lifecycle.length > 0) { let listener; while (void 0 !== (listener = lifecycle.shift())) { listener() } } } parentDOM.$V = input; if ((0, _shared.isFunction)(callback)) { callback() } }