namespace Elementor\Modules\Components;
use Elementor\Core\Base\Document;
use Elementor\Core\Utils\Api\Error_Builder;
use Elementor\Core\Utils\Api\Response_Builder;
use Elementor\Core\Utils\Collection;
use Elementor\Modules\Components\Documents\Component;
use Elementor\Modules\Components\OverridableProps\Component_Overridable_Props_Parser;
if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly.
class Components_REST_API {
const API_NAMESPACE = 'elementor/v1';
const API_BASE = 'components';
const LOCK_DOCUMENT_TYPE_NAME = 'components';
const STYLES_ROUTE = 'styles';
const MAX_COMPONENTS = 100;
private $repository = null;
public function register_hooks() {
add_action( 'rest_api_init', fn() => $this->register_routes() );
private function get_repository() {
if ( ! $this->repository ) {
$this->repository = new Components_Repository();
return $this->repository;
* @return Component_Lock_Manager instance
private function get_component_lock_manager() {
return Component_Lock_Manager::get_instance();
private function register_routes() {
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE, [
'callback' => fn() => $this->route_wrapper( fn() => $this->get_components() ),
'permission_callback' => fn() => current_user_can( 'edit_posts' ),
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/' . self::STYLES_ROUTE, [
'callback' => fn() => $this->route_wrapper( fn() => $this->get_styles() ),
'permission_callback' => fn() => current_user_can( 'edit_posts' ),
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE, [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->create_components( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'enum' => [ Document::STATUS_PUBLISH, Document::STATUS_DRAFT, Document::STATUS_AUTOSAVE ],
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/create-validate', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->create_validate_components( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/overridable-props', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->get_overridable_props( $request ) ),
'permission_callback' => fn() => current_user_can( 'edit_posts' ),
'description' => 'The component ID to get overridable props for',
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/status', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->update_statuses( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'enum' => [ Document::STATUS_PUBLISH ],
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/lock', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->lock_component( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'description' => 'The component ID to unlock',
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/unlock', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->unlock_component( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'description' => 'The component ID to unlock',
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/lock-status', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->get_lock_status( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'description' => 'The component ID to check lock status',
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/archive', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->archive_components( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'description' => 'The component IDs to archive',
'enum' => [ Document::STATUS_PUBLISH, Document::STATUS_DRAFT, Document::STATUS_AUTOSAVE ],
register_rest_route( self::API_NAMESPACE, '/' . self::API_BASE . '/update-titles', [
'callback' => fn( $request ) => $this->route_wrapper( fn() => $this->update_components_title( $request ) ),
'permission_callback' => fn() => current_user_can( 'manage_options' ),
'description' => 'The component ID to update title',
'description' => 'The new title for the component',
'enum' => [ Document::STATUS_PUBLISH, Document::STATUS_DRAFT, Document::STATUS_AUTOSAVE ],
private function get_components() {
$components = $this->get_repository()->all();
$components_list = array_values( $components
->map( fn( $component ) => [
'id' => $component['id'],
'name' => $component['title'],
'uid' => $component['uid'],
'isArchived' => $component['is_archived'] ?? false,
return Response_Builder::make( $components_list )->build();
private function get_styles() {
$components = $this->get_repository()->all();
$components->each( function( $component ) use ( &$styles ) {
$styles[ $component['id'] ] = $component['styles'];
return Response_Builder::make( $styles )->build();
private function get_overridable_props( \WP_REST_Request $request ) {
$component_id = (int) $request->get_param( 'componentId' );
return Error_Builder::make( 'invalid_component_id' )
->set_message( __( 'Invalid component ID', 'elementor' ) )
$document = $this->get_repository()->get( $component_id );
return Error_Builder::make( 'component_not_found' )
->set_message( __( 'Component not found', 'elementor' ) )
$overridable = $document->get_json_meta( Component::OVERRIDABLE_PROPS_META_KEY ) ?? null;
if ( empty( $overridable ) ) {
return Response_Builder::make( $overridable )->build();
private function create_components( \WP_REST_Request $request ) {
$save_status = $request->get_param( 'status' );
$items = Collection::make( $request->get_param( 'items' ) );
$components = $this->get_repository()->all();
$result = Save_Components_Validator::make( $components )->validate( $items );
if ( ! $result['success'] ) {
return Error_Builder::make( 'components_validation_failed' )
->set_message( 'Validation failed: ' . implode( ', ', $result['messages'] ) )
$circular_result = Circular_Dependency_Validator::make()->validate_new_components( $items );
if ( ! $circular_result['success'] ) {
return Error_Builder::make( 'circular_dependency_detected' )
->set_message( __( "Can't add this component - components that contain each other can't be nested.", 'elementor' ) )
->set_meta( [ 'caused_by' => $circular_result['messages'] ] )
$non_atomic_result = Non_Atomic_Widget_Validator::make()->validate_items( $items );
if ( ! $non_atomic_result['success'] ) {
return Error_Builder::make( Non_Atomic_Widget_Validator::ERROR_CODE )
->set_message( __( 'Components require atomic elements only. Remove widgets to create this component.', 'elementor' ) )
->set_meta( [ 'non_atomic_elements' => $non_atomic_result['non_atomic_elements'] ] )
$created = $items->map_with_keys( function ( $item ) use ( $save_status, &$validation_errors ) {
$title = sanitize_text_field( $item['title'] );
$content = $item['elements'];
$settings = isset( $item['settings'] ) ? $this->parse_settings( $item['settings'] ) : [];
$status = Document::STATUS_AUTOSAVE === $save_status
$component_id = $this->get_repository()->create( $title, $content, $status, $uid, $settings );
return [ $uid => $component_id ];
} catch ( \Exception $e ) {
$validation_errors[ $uid ] = $e->getMessage();
if ( ! empty( $validation_errors ) ) {
return Error_Builder::make( 'settings_validation_failed' )
->set_message( 'Settings validation failed: ' . json_encode( $validation_errors ) )
return Response_Builder::make( $created->all() )
private function update_statuses( \WP_REST_Request $request ) {
$result = Collection::make( $request->get_param( 'ids' ) )
function ( $result, int $component_id ) {
$component = $this->get_repository()->get( $component_id );
$result['failed'][] = $component_id;
$publish_result = $this->get_repository()->publish_component( $component );
$result[ $publish_result ? 'success' : 'failed' ][] = $component_id;
return Response_Builder::make( $result )->build();
private function lock_component( \WP_REST_Request $request ) {
$component_id = $request->get_param( 'componentId' );
$success = $this->get_component_lock_manager()->lock( $component_id );
} catch ( \Exception $e ) {
error_log( 'Components REST API lock_component error: ' . $e->getMessage() );
return Error_Builder::make( 'lock_failed' )
->set_message( __( 'Failed to lock component', 'elementor' ) )
return Error_Builder::make( 'lock_failed' )
->set_message( __( 'Failed to lock component', 'elementor' ) )
return Response_Builder::make( [ 'locked' => $success ] )->build();
private function unlock_component( \WP_REST_Request $request ) {
$component_id = $request->get_param( 'componentId' );
$success = $this->get_component_lock_manager()->unlock( $component_id );
} catch ( \Exception $e ) {
error_log( 'Components REST API unlock_component error: ' . $e->getMessage() );
return Error_Builder::make( 'unlock_failed' )
->set_message( __( 'Failed to unlock component', 'elementor' ) )
return Error_Builder::make( 'unlock_failed' )
->set_message( __( 'Failed to unlock component', 'elementor' ) )
return Response_Builder::make( [ 'unlocked' => $success ] )->build();
private function get_lock_status( \WP_REST_Request $request ) {
$component_id = (int) $request->get_param( 'componentId' );
$lock_manager = $this->get_component_lock_manager();
if ( $lock_manager->is_lock_expired( $component_id ) ) {
$lock_manager->unlock( $component_id );
$lock_data = $lock_manager->get_lock_data( $component_id );
$current_user_id = get_current_user_id();
// if current user is the lock user, return true
if ( $lock_data['locked_by'] && $lock_data['locked_by'] === $current_user_id ) {
return Response_Builder::make( [
'is_current_user_allow_to_edit' => true,
'locked_by' => get_user_by( 'id', $lock_data['locked_by'] )->display_name,
// if the user is not the lock user, return false
if ( $lock_data['locked_by'] && $lock_data['locked_by'] !== $current_user_id ) {