@wordpress/interactivity
Version:
Package that provides a standard and simple way to handle the frontend interactivity of Gutenberg blocks.
53 lines (48 loc) • 1.56 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.initialVdom = exports.init = exports.getRegionRootFragment = void 0;
var _preact = require("preact");
var _vdom = require("./vdom");
var _utils = require("./utils");
var _constants = require("./constants");
/**
* External dependencies
*/
/**
* Internal dependencies
*/
// Keep the same root fragment for each interactive region node.
const regionRootFragments = new WeakMap();
const getRegionRootFragment = region => {
if (!regionRootFragments.has(region)) {
regionRootFragments.set(region, (0, _utils.createRootFragment)(region.parentElement, region));
}
return regionRootFragments.get(region);
};
exports.getRegionRootFragment = getRegionRootFragment;
function yieldToMain() {
return new Promise(resolve => {
// TODO: Use scheduler.yield() when available.
setTimeout(resolve, 0);
});
}
// Initial vDOM regions associated with its DOM element.
const initialVdom = exports.initialVdom = new WeakMap();
// Initialize the router with the initial DOM.
const init = async () => {
const nodes = document.querySelectorAll(`[data-${_constants.directivePrefix}-interactive]`);
for (const node of nodes) {
if (!_vdom.hydratedIslands.has(node)) {
await yieldToMain();
const fragment = getRegionRootFragment(node);
const vdom = (0, _vdom.toVdom)(node);
initialVdom.set(node, vdom);
await yieldToMain();
(0, _preact.hydrate)(vdom, fragment);
}
}
};
exports.init = init;
//# sourceMappingURL=init.js.map