Editor tools

Installation

Install the module

npm install @teft/editor-tools

Post Selector

Example:

import { PostSelector } from '@teft/editor-tools';
import { useState } from '@wordpress/element';

const [ postIds, setPostIds ] = useState( [] );
const [ visible, setVisible ] = useState( false );

{ visible && (
	<PostSelector
		ids={ postIds }
		onSelect={ ( ids ) => setPostIds( ids ) }
		onClose={ () => setVisible( false ) }
		postTypes={ [ 'post', 'page' ] }
	/>
) }

Query Sidebar

Example:

import { QuerySidebarOptions, queryServerAttributes } from '@teft/editor-tools';

function Edit( { attributes, setAttributes } ) {
	return (
		<>
			<QuerySidebarOptions
				attributes={ attributes }
				setAttributes={ setAttributes }
			/>

			<Disabled>
				<ServerSideRender
					block="teft/cards-query"
					attributes={ queryServerAttributes( attributes ) }
				/>
			</Disabled>
		</>
	);
}