@wordpress/block-library 8.13.0 → 8.14.0

package/src/utils/interactivity/portals.js

@@ -1,98 +0,0 @@
-/**
- * External dependencies
- */
-import { createElement, render } from 'preact';
-
-/**
- * @param {import('../../src/index').RenderableProps<{ context: any }>} props
- */
-function ContextProvider( props ) {
-	this.getChildContext = () => props.context;
-	return props.children;
-}
-
-/**
- * Portal component
- *
- * @this {import('./internal').Component}
- * @param {object | null | undefined} props
- *
- *                                          TODO: use createRoot() instead of fake root
- */
-function Portal( props ) {
-	const _this = this;
-	const container = props._container;
-
-	_this.componentWillUnmount = function () {
-		render( null, _this._temp );
-		_this._temp = null;
-		_this._container = null;
-	};
-
-	// When we change container we should clear our old container and
-	// indicate a new mount.
-	if ( _this._container && _this._container !== container ) {
-		_this.componentWillUnmount();
-	}
-
-	// When props.vnode is undefined/false/null we are dealing with some kind of
-	// conditional vnode. This should not trigger a render.
-	if ( props._vnode ) {
-		if ( ! _this._temp ) {
-			_this._container = container;
-
-			// Create a fake DOM parent node that manages a subset of `container`'s children:
-			_this._temp = {
-				nodeType: 1,
-				parentNode: container,
-				childNodes: [],
-				appendChild( child ) {
-					this.childNodes.push( child );
-					_this._container.appendChild( child );
-				},
-				insertBefore( child ) {
-					this.childNodes.push( child );
-					_this._container.appendChild( child );
-				},
-				removeChild( child ) {
-					this.childNodes.splice(
-						// eslint-disable-next-line no-bitwise
-						this.childNodes.indexOf( child ) >>> 1,
-						1
-					);
-					_this._container.removeChild( child );
-				},
-			};
-		}
-
-		// Render our wrapping element into temp.
-		render(
-			createElement(
-				ContextProvider,
-				{ context: _this.context },
-				props._vnode
-			),
-			_this._temp
-		);
-	}
-	// When we come from a conditional render, on a mounted
-	// portal we should clear the DOM.
-	else if ( _this._temp ) {
-		_this.componentWillUnmount();
-	}
-}
-
-/**
- * Create a `Portal` to continue rendering the vnode tree at a different DOM node
- *
- * @param {import('./internal').VNode}         vnode     The vnode to render
- * @param {import('./internal').PreactElement} container The DOM node to continue rendering in to.
- */
-export function createPortal( vnode, container ) {
-	const el = createElement( Portal, {
-		_vnode: vnode,
-		_container: container,
-	} );
-	el.containerInfo = container;
-	return el;
-}

package/src/utils/interactivity/store.js

@@ -1,45 +0,0 @@
-/**
- * External dependencies
- */
-import { deepSignal } from 'deepsignal';
-
-const isObject = ( item ) =>
-	item && typeof item === 'object' && ! Array.isArray( item );
-
-const deepMerge = ( target, source ) => {
-	if ( isObject( target ) && isObject( source ) ) {
-		for ( const key in source ) {
-			if ( isObject( source[ key ] ) ) {
-				if ( ! target[ key ] ) Object.assign( target, { [ key ]: {} } );
-				deepMerge( target[ key ], source[ key ] );
-			} else {
-				Object.assign( target, { [ key ]: source[ key ] } );
-			}
-		}
-	}
-};
-
-const getSerializedState = () => {
-	// TODO: change the store tag ID for a better one.
-	const storeTag = document.querySelector(
-		`script[type="application/json"]#store`
-	);
-	if ( ! storeTag ) return {};
-	try {
-		const { state } = JSON.parse( storeTag.textContent );
-		if ( isObject( state ) ) return state;
-		throw Error( 'Parsed state is not an object' );
-	} catch ( e ) {
-		// eslint-disable-next-line no-console
-		console.log( e );
-	}
-	return {};
-};
-
-const rawState = getSerializedState();
-export const rawStore = { state: deepSignal( rawState ) };
-
-export const store = ( { state, ...block } ) => {
-	deepMerge( rawStore, block );
-	deepMerge( rawState, state );
-};

package/src/utils/interactivity/utils.js

@@ -1,66 +0,0 @@
-/**
- * External dependencies
- */
-import { useRef, useEffect } from 'preact/hooks';
-import { effect } from '@preact/signals';
-
-function afterNextFrame( callback ) {
-	const done = () => {
-		window.cancelAnimationFrame( raf );
-		setTimeout( callback );
-	};
-	const raf = window.requestAnimationFrame( done );
-}
-
-// Using the mangled properties:
-// this.c: this._callback
-// this.x: this._compute
-// https://github.com/preactjs/signals/blob/main/mangle.json
-function createFlusher( compute, notify ) {
-	let flush;
-	const dispose = effect( function () {
-		flush = this.c.bind( this );
-		this.x = compute;
-		this.c = notify;
-		return compute();
-	} );
-	return { flush, dispose };
-}
-
-// Version of `useSignalEffect` with a `useEffect`-like execution. This hook
-// implementation comes from this PR:
-// https://github.com/preactjs/signals/pull/290.
-//
-// We need to include it here in this repo until the mentioned PR is merged.
-export function useSignalEffect( cb ) {
-	const callback = useRef( cb );
-	callback.current = cb;
-
-	useEffect( () => {
-		const execute = () => callback.current();
-		const notify = () => afterNextFrame( eff.flush );
-		const eff = createFlusher( execute, notify );
-		return eff.dispose;
-	}, [] );
-}
-
-// For wrapperless hydration.
-// See https://gist.github.com/developit/f4c67a2ede71dc2fab7f357f39cff28c
-export const createRootFragment = ( parent, replaceNode ) => {
-	replaceNode = [].concat( replaceNode );
-	const s = replaceNode[ replaceNode.length - 1 ].nextSibling;
-	function insert( c, r ) {
-		parent.insertBefore( c, r || s );
-	}
-	return ( parent.__k = {
-		nodeType: 1,
-		parentNode: parent,
-		firstChild: replaceNode[ 0 ],
-		childNodes: replaceNode,
-		insertBefore: insert,
-		appendChild: insert,
-		removeChild( c ) {
-			parent.removeChild( c );
-		},
-	} );
-};

package/src/utils/interactivity/vdom.js

@@ -1,111 +0,0 @@
-/**
- * External dependencies
- */
-import { h } from 'preact';
-/**
- * Internal dependencies
- */
-import { directivePrefix as p } from './constants';
-
-const ignoreAttr = `data-${ p }-ignore`;
-const islandAttr = `data-${ p }-interactive`;
-const fullPrefix = `data-${ p }-`;
-
-// Regular expression for directive parsing.
-const directiveParser = new RegExp(
-	`^data-${ p }-` + // ${p} must be a prefix string, like 'wp'.
-		// Match alphanumeric characters including hyphen-separated
-		// segments. It excludes underscore intentionally to prevent confusion.
-		// E.g., "custom-directive".
-		'([a-z0-9]+(?:-[a-z0-9]+)*)' +
-		// (Optional) Match '--' followed by any alphanumeric charachters. It
-		// excludes underscore intentionally to prevent confusion, but it can
-		// contain multiple hyphens. E.g., "--custom-prefix--with-more-info".
-		'(?:--([a-z0-9][a-z0-9-]+))?$',
-	'i' // Case insensitive.
-);
-
-export const hydratedIslands = new WeakSet();
-
-// Recursive function that transforms a DOM tree into vDOM.
-export function toVdom( root ) {
-	const treeWalker = document.createTreeWalker(
-		root,
-		205 // ELEMENT + TEXT + COMMENT + CDATA_SECTION + PROCESSING_INSTRUCTION
-	);
-
-	function walk( node ) {
-		const { attributes, nodeType } = node;
-
-		if ( nodeType === 3 ) return [ node.data ];
-		if ( nodeType === 4 ) {
-			const next = treeWalker.nextSibling();
-			node.replaceWith( new window.Text( node.nodeValue ) );
-			return [ node.nodeValue, next ];
-		}
-		if ( nodeType === 8 || nodeType === 7 ) {
-			const next = treeWalker.nextSibling();
-			node.remove();
-			return [ null, next ];
-		}
-
-		const props = {};
-		const children = [];
-		const directives = {};
-		let hasDirectives = false;
-		let ignore = false;
-		let island = false;
-
-		for ( let i = 0; i < attributes.length; i++ ) {
-			const n = attributes[ i ].name;
-			if (
-				n[ fullPrefix.length ] &&
-				n.slice( 0, fullPrefix.length ) === fullPrefix
-			) {
-				if ( n === ignoreAttr ) {
-					ignore = true;
-				} else if ( n === islandAttr ) {
-					island = true;
-				} else {
-					hasDirectives = true;
-					let val = attributes[ i ].value;
-					try {
-						val = JSON.parse( val );
-					} catch ( e ) {}
-					const [ , prefix, suffix ] = directiveParser.exec( n );
-					directives[ prefix ] = directives[ prefix ] || {};
-					directives[ prefix ][ suffix || 'default' ] = val;
-				}
-			} else if ( n === 'ref' ) {
-				continue;
-			}
-			props[ n ] = attributes[ i ].value;
-		}
-
-		if ( ignore && ! island )
-			return [
-				h( node.localName, {
-					...props,
-					innerHTML: node.innerHTML,
-					__directives: { ignore: true },
-				} ),
-			];
-		if ( island ) hydratedIslands.add( node );
-
-		if ( hasDirectives ) props.__directives = directives;
-
-		let child = treeWalker.firstChild();
-		if ( child ) {
-			while ( child ) {
-				const [ vnode, nextChild ] = walk( child );
-				if ( vnode ) children.push( vnode );
-				child = nextChild || treeWalker.nextSibling();
-			}
-			treeWalker.parentNode();
-		}
-
-		return [ h( node.localName, props, children ) ];
-	}
-
-	return walk( treeWalker.currentNode );
-}