@elementor/editor-components 4.0.0-manual → 4.0.0

package/src/extended/store/actions/delete-overridable-prop.ts

@@ -1,70 +0,0 @@
-import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
-
-import { selectCurrentComponent, selectOverridableProps, slice } from '../../../store/store';
-import { type ComponentId, type OverridableProp } from '../../../types';
-import { type Source, trackComponentEvent } from '../../../utils/tracking';
-import { revertElementOverridableSetting } from '../../utils/revert-overridable-settings';
-import { removePropFromAllGroups } from '../utils/groups-transformers';
-
-type DeletePropParams = {
-	componentId: ComponentId;
-	propKey: string | string[];
-	source: Source;
-};
-
-export function deleteOverridableProp( { componentId, propKey, source }: DeletePropParams ): void {
-	const overridableProps = selectOverridableProps( getState(), componentId );
-
-	if ( ! overridableProps || Object.keys( overridableProps.props ).length === 0 ) {
-		return;
-	}
-
-	const propKeysToDelete = Array.isArray( propKey ) ? propKey : [ propKey ];
-	const deletedProps: OverridableProp[] = [];
-
-	for ( const key of propKeysToDelete ) {
-		const prop = overridableProps.props[ key ];
-
-		if ( ! prop ) {
-			continue;
-		}
-
-		deletedProps.push( prop );
-		revertElementOverridableSetting( prop.elementId, prop.propKey, prop.originValue, key );
-	}
-
-	if ( deletedProps.length === 0 ) {
-		return;
-	}
-
-	const remainingProps = Object.fromEntries(
-		Object.entries( overridableProps.props ).filter( ( [ key ] ) => ! propKeysToDelete.includes( key ) )
-	);
-
-	const updatedGroups = removePropFromAllGroups( overridableProps.groups, propKey );
-
-	dispatch(
-		slice.actions.setOverridableProps( {
-			componentId,
-			overridableProps: {
-				...overridableProps,
-				props: remainingProps,
-				groups: updatedGroups,
-			},
-		} )
-	);
-
-	const currentComponent = selectCurrentComponent( getState() );
-
-	for ( const prop of deletedProps ) {
-		trackComponentEvent( {
-			action: 'propertyRemoved',
-			source,
-			component_uid: currentComponent?.uid,
-			property_id: prop.overrideKey,
-			property_path: prop.propKey,
-			property_name: prop.label,
-			element_type: prop.widgetType ?? prop.elType,
-		} );
-	}
-}

package/src/extended/store/actions/rename-component.ts

@@ -1,49 +0,0 @@
-import { getV1DocumentsManager, setDocumentModifiedStatus } from '@elementor/editor-documents';
-import { getAllDescendants, type V1Element } from '@elementor/editor-elements';
-import { __dispatch as dispatch } from '@elementor/store';
-
-import { COMPONENT_WIDGET_TYPE } from '../../../create-component-type';
-import { slice } from '../../../store/store';
-
-const TITLE_EXTERNAL_CHANGE_COMMAND = 'title_external_change';
-
-export const renameComponent = ( componentUid: string, newName: string ) => {
-	dispatch( slice.actions.rename( { componentUid, name: newName } ) );
-
-	setDocumentModifiedStatus( true );
-
-	refreshComponentInstanceTitles( componentUid );
-};
-
-function refreshComponentInstanceTitles( componentUid: string ) {
-	const documentContainer = getDocumentContainer();
-
-	if ( ! documentContainer ) {
-		return;
-	}
-
-	const componentInstances = findComponentInstancesByUid( documentContainer, componentUid );
-
-	componentInstances.forEach( ( element ) => {
-		element.model.trigger?.( TITLE_EXTERNAL_CHANGE_COMMAND );
-	} );
-}
-
-function getDocumentContainer(): V1Element | undefined {
-	const documentsManager = getV1DocumentsManager();
-
-	return documentsManager?.getCurrent()?.container as V1Element | undefined;
-}
-
-function findComponentInstancesByUid( documentContainer: V1Element, componentUid: string ): V1Element[] {
-	const allDescendants = getAllDescendants( documentContainer );
-
-	return allDescendants.filter( ( element ) => {
-		const widgetType = element.model.get( 'widgetType' );
-		const editorSettings = element.model.get( 'editor_settings' );
-
-		const isMatch = widgetType === COMPONENT_WIDGET_TYPE && editorSettings?.component_uid === componentUid;
-
-		return isMatch;
-	} );
-}

package/src/extended/store/actions/rename-overridable-group.ts

@@ -1,39 +0,0 @@
-import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
-
-import { selectOverridableProps, slice } from '../../../store/store';
-import { type ComponentId } from '../../../types';
-import { renameGroup } from '../utils/groups-transformers';
-
-type RenameGroupParams = {
-	componentId: ComponentId;
-	groupId: string;
-	label: string;
-};
-
-export function renameOverridableGroup( { componentId, groupId, label }: RenameGroupParams ): boolean {
-	const overridableProps = selectOverridableProps( getState(), componentId );
-
-	if ( ! overridableProps ) {
-		return false;
-	}
-
-	const group = overridableProps.groups.items[ groupId ];
-
-	if ( ! group ) {
-		return false;
-	}
-
-	const updatedGroups = renameGroup( overridableProps.groups, groupId, label );
-
-	dispatch(
-		slice.actions.setOverridableProps( {
-			componentId,
-			overridableProps: {
-				...overridableProps,
-				groups: updatedGroups,
-			},
-		} )
-	);
-
-	return true;
-}

package/src/extended/store/actions/reorder-group-props.ts

@@ -1,43 +0,0 @@
-import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
-
-import { selectOverridableProps, slice } from '../../../store/store';
-import { type ComponentId } from '../../../types';
-
-type ReorderGroupPropsParams = {
-	componentId: ComponentId;
-	groupId: string;
-	newPropsOrder: string[];
-};
-
-export function reorderGroupProps( { componentId, groupId, newPropsOrder }: ReorderGroupPropsParams ): void {
-	const overridableProps = selectOverridableProps( getState(), componentId );
-
-	if ( ! overridableProps ) {
-		return;
-	}
-
-	const group = overridableProps.groups.items[ groupId ];
-
-	if ( ! group ) {
-		return;
-	}
-
-	dispatch(
-		slice.actions.setOverridableProps( {
-			componentId,
-			overridableProps: {
-				...overridableProps,
-				groups: {
-					...overridableProps.groups,
-					items: {
-						...overridableProps.groups.items,
-						[ groupId ]: {
-							...group,
-							props: newPropsOrder,
-						},
-					},
-				},
-			},
-		} )
-	);
-}

package/src/extended/store/actions/reorder-overridable-groups.ts

@@ -1,30 +0,0 @@
-import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
-
-import { selectOverridableProps, slice } from '../../../store/store';
-import { type ComponentId } from '../../../types';
-
-type ReorderGroupsParams = {
-	componentId: ComponentId;
-	newOrder: string[];
-};
-
-export function reorderOverridableGroups( { componentId, newOrder }: ReorderGroupsParams ): void {
-	const overridableProps = selectOverridableProps( getState(), componentId );
-
-	if ( ! overridableProps ) {
-		return;
-	}
-
-	dispatch(
-		slice.actions.setOverridableProps( {
-			componentId,
-			overridableProps: {
-				...overridableProps,
-				groups: {
-					...overridableProps.groups,
-					order: newOrder,
-				},
-			},
-		} )
-	);
-}

package/src/extended/store/actions/reset-sanitized-components.ts

@@ -1,7 +0,0 @@
-import { __dispatch as dispatch } from '@elementor/store';
-
-import { slice } from '../../../store/store';
-
-export function resetSanitizedComponents() {
-	dispatch( slice.actions.resetSanitizedComponents() );
-}

package/src/extended/store/actions/set-overridable-prop.ts

@@ -1,117 +0,0 @@
-import { type PropValue } from '@elementor/editor-props';
-import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
-import { generateUniqueId } from '@elementor/utils';
-
-import { selectCurrentComponent, selectOverridableProps, slice } from '../../../store/store';
-import { type OriginPropFields, type OverridableProp } from '../../../types';
-import { type Source, trackComponentEvent } from '../../../utils/tracking';
-import {
-	addPropToGroup,
-	ensureGroupInOrder,
-	removePropFromGroup,
-	removePropsFromState,
-	resolveOrCreateGroup,
-} from '../utils/groups-transformers';
-
-type Props = {
-	componentId: number;
-	overrideKey: string | null;
-	elementId: string;
-	label: string;
-	groupId: string | null;
-	propKey: string;
-	elType: string;
-	widgetType: string;
-	originValue: PropValue;
-	originPropFields?: OriginPropFields;
-	source: Source;
-};
-
-export function setOverridableProp( {
-	componentId,
-	overrideKey,
-	elementId,
-	label,
-	groupId,
-	propKey,
-	elType,
-	widgetType,
-	originValue,
-	originPropFields,
-	source,
-}: Props ): OverridableProp | undefined {
-	const overridableProps = selectOverridableProps( getState(), componentId );
-
-	if ( ! overridableProps ) {
-		return;
-	}
-
-	const existingOverridableProp = overrideKey ? overridableProps.props[ overrideKey ] : null;
-	const duplicatedTargetProps = Object.values( overridableProps.props ).filter(
-		( prop ) => prop.elementId === elementId && prop.propKey === propKey && prop !== existingOverridableProp
-	);
-
-	const { groups: groupsAfterResolve, groupId: currentGroupId } = resolveOrCreateGroup(
-		overridableProps.groups,
-		groupId || existingOverridableProp?.groupId || undefined
-	);
-
-	const overridableProp: OverridableProp = {
-		overrideKey: existingOverridableProp?.overrideKey || generateUniqueId( 'prop' ),
-		label,
-		elementId,
-		propKey,
-		widgetType,
-		elType,
-		originValue,
-		groupId: currentGroupId,
-		originPropFields,
-	};
-
-	const stateAfterRemovingDuplicates = removePropsFromState(
-		{ ...overridableProps, groups: groupsAfterResolve },
-		duplicatedTargetProps
-	);
-
-	const props = {
-		...stateAfterRemovingDuplicates.props,
-		[ overridableProp.overrideKey ]: overridableProp,
-	};
-
-	let groups = addPropToGroup( stateAfterRemovingDuplicates.groups, currentGroupId, overridableProp.overrideKey );
-	groups = ensureGroupInOrder( groups, currentGroupId );
-
-	const isChangingGroups = existingOverridableProp && existingOverridableProp.groupId !== currentGroupId;
-
-	if ( isChangingGroups ) {
-		groups = removePropFromGroup( groups, existingOverridableProp.groupId, overridableProp.overrideKey );
-	}
-
-	dispatch(
-		slice.actions.setOverridableProps( {
-			componentId,
-			overridableProps: {
-				props,
-				groups,
-			},
-		} )
-	);
-
-	const isNewProperty = ! existingOverridableProp;
-
-	if ( isNewProperty ) {
-		const currentComponent = selectCurrentComponent( getState() );
-
-		trackComponentEvent( {
-			action: 'propertyExposed',
-			source,
-			component_uid: currentComponent?.uid,
-			property_id: overridableProp.overrideKey,
-			property_path: propKey,
-			property_name: label,
-			element_type: widgetType ?? elType,
-		} );
-	}
-
-	return overridableProp;
-}

package/src/extended/store/actions/update-component-sanitized-attribute.ts

@@ -1,8 +0,0 @@
-import { __dispatch as dispatch } from '@elementor/store';
-
-import { type SanitizeAttributes, slice } from '../../../store/store';
-import { type ComponentId } from '../../../types';
-
-export function updateComponentSanitizedAttribute( componentId: ComponentId, attribute: SanitizeAttributes ) {
-	dispatch( slice.actions.updateComponentSanitizedAttribute( { componentId, attribute } ) );
-}

package/src/extended/store/actions/update-current-component.ts

@@ -1,21 +0,0 @@
-import { type V1Document } from '@elementor/editor-documents';
-import { __getStore as getStore } from '@elementor/store';
-
-import { type ComponentsPathItem, slice } from '../../../store/store';
-
-export function updateCurrentComponent( {
-	path,
-	currentComponentId,
-}: {
-	path: ComponentsPathItem[];
-	currentComponentId: V1Document[ 'id' ] | null;
-} ) {
-	const dispatch = getStore()?.dispatch;
-
-	if ( ! dispatch ) {
-		return;
-	}
-
-	dispatch( slice.actions.setPath( path ) );
-	dispatch( slice.actions.setCurrentComponentId( currentComponentId ) );
-}

package/src/extended/store/actions/update-overridable-prop-params.ts

@@ -1,58 +0,0 @@
-import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
-
-import { selectOverridableProps, slice } from '../../../store/store';
-import { type ComponentId, type OverridableProp } from '../../../types';
-import { movePropBetweenGroups } from '../utils/groups-transformers';
-
-type UpdatePropParams = {
-	componentId: ComponentId;
-	overrideKey: string;
-	label: string;
-	groupId: string | null;
-};
-
-export function updateOverridablePropParams( {
-	componentId,
-	overrideKey,
-	label,
-	groupId,
-}: UpdatePropParams ): OverridableProp | undefined {
-	const overridableProps = selectOverridableProps( getState(), componentId );
-
-	if ( ! overridableProps ) {
-		return;
-	}
-
-	const prop = overridableProps.props[ overrideKey ];
-
-	if ( ! prop ) {
-		return;
-	}
-
-	const oldGroupId = prop.groupId;
-	const newGroupId = groupId ?? oldGroupId;
-
-	const updatedProp: OverridableProp = {
-		...prop,
-		label,
-		groupId: newGroupId,
-	};
-
-	const updatedGroups = movePropBetweenGroups( overridableProps.groups, overrideKey, oldGroupId, newGroupId );
-
-	dispatch(
-		slice.actions.setOverridableProps( {
-			componentId,
-			overridableProps: {
-				...overridableProps,
-				props: {
-					...overridableProps.props,
-					[ overrideKey ]: updatedProp,
-				},
-				groups: updatedGroups,
-			},
-		} )
-	);
-
-	return updatedProp;
-}

package/src/extended/store/utils/groups-transformers.ts

@@ -1,187 +0,0 @@
-import { generateUniqueId } from '@elementor/utils';
-import { __ } from '@wordpress/i18n';
-
-import { type OverridableProp, type OverridableProps, type OverridablePropsGroup } from '../../../types';
-
-type Groups = OverridableProps[ 'groups' ];
-
-export function removePropFromAllGroups( groups: Groups, propKey: string | string[] ): Groups {
-	const propKeys = Array.isArray( propKey ) ? propKey : [ propKey ];
-
-	return {
-		...groups,
-		items: Object.fromEntries(
-			Object.entries( groups.items ).map( ( [ groupId, group ] ) => [
-				groupId,
-				{
-					...group,
-					props: group.props.filter( ( p ) => ! propKeys.includes( p ) ),
-				},
-			] )
-		),
-	};
-}
-
-export function addPropToGroup( groups: Groups, groupId: string, propKey: string ): Groups {
-	const group = groups.items[ groupId ];
-
-	if ( ! group ) {
-		return groups;
-	}
-
-	if ( group.props.includes( propKey ) ) {
-		return groups;
-	}
-
-	return {
-		...groups,
-		items: {
-			...groups.items,
-			[ groupId ]: {
-				...group,
-				props: [ ...group.props, propKey ],
-			},
-		},
-	};
-}
-
-export function movePropBetweenGroups(
-	groups: Groups,
-	propKey: string,
-	fromGroupId: string,
-	toGroupId: string
-): Groups {
-	if ( fromGroupId === toGroupId ) {
-		return groups;
-	}
-
-	const withoutProp = removePropFromGroup( groups, fromGroupId, propKey );
-	return addPropToGroup( withoutProp, toGroupId, propKey );
-}
-
-export function removePropFromGroup( groups: Groups, groupId: string, propKey: string ): Groups {
-	const group = groups.items[ groupId ];
-
-	if ( ! group ) {
-		return groups;
-	}
-
-	return {
-		...groups,
-		items: {
-			...groups.items,
-			[ groupId ]: {
-				...group,
-				props: group.props.filter( ( p ) => p !== propKey ),
-			},
-		},
-	};
-}
-
-type ResolvedGroup = {
-	groups: Groups;
-	groupId: string;
-};
-
-export function resolveOrCreateGroup( groups: Groups, requestedGroupId?: string ): ResolvedGroup {
-	if ( requestedGroupId && groups.items[ requestedGroupId ] ) {
-		return { groups, groupId: requestedGroupId };
-	}
-
-	if ( ! requestedGroupId && groups.order.length > 0 ) {
-		return { groups, groupId: groups.order[ 0 ] };
-	}
-
-	return createGroup( groups, requestedGroupId );
-}
-
-function createGroup( groups: Groups, groupId?: string, label?: string ): ResolvedGroup {
-	const newGroupId = groupId || generateUniqueId( 'group' );
-	const newLabel = label || __( 'Default', 'elementor' );
-
-	return {
-		groups: {
-			...groups,
-			items: {
-				...groups.items,
-				[ newGroupId ]: {
-					id: newGroupId,
-					label: newLabel,
-					props: [],
-				},
-			},
-			order: [ ...groups.order, newGroupId ],
-		},
-		groupId: newGroupId,
-	};
-}
-
-export function removePropsFromState(
-	overridableProps: OverridableProps,
-	propsToRemove: OverridableProp[]
-): OverridableProps {
-	const overrideKeysToRemove = propsToRemove.map( ( prop ) => prop.overrideKey );
-
-	const remainingProps = Object.fromEntries(
-		Object.entries( overridableProps.props ).filter( ( [ , prop ] ) => ! propsToRemove.includes( prop ) )
-	);
-
-	const updatedGroupItems = Object.fromEntries(
-		Object.entries( overridableProps.groups.items ).map(
-			( [ groupId, group ]: [ string, OverridablePropsGroup ] ) => [
-				groupId,
-				{
-					...group,
-					props: group.props.filter( ( prop ) => ! overrideKeysToRemove.includes( prop ) ),
-				},
-			]
-		)
-	);
-
-	return {
-		props: remainingProps,
-		groups: {
-			items: updatedGroupItems,
-			order: overridableProps.groups.order.filter( ( groupId ) => ! overrideKeysToRemove.includes( groupId ) ),
-		},
-	};
-}
-
-export function ensureGroupInOrder( groups: Groups, groupId: string ): Groups {
-	if ( groups.order.includes( groupId ) ) {
-		return groups;
-	}
-
-	return {
-		...groups,
-		order: [ ...groups.order, groupId ],
-	};
-}
-
-export function deleteGroup( groups: Groups, groupId: string ): Groups {
-	const { [ groupId ]: removed, ...remainingItems } = groups.items;
-
-	return {
-		items: remainingItems,
-		order: groups.order.filter( ( id ) => id !== groupId ),
-	};
-}
-
-export function renameGroup( groups: Groups, groupId: string, newLabel: string ): Groups {
-	const group = groups.items[ groupId ];
-
-	if ( ! group ) {
-		return groups;
-	}
-
-	return {
-		...groups,
-		items: {
-			...groups.items,
-			[ groupId ]: {
-				...group,
-				label: newLabel,
-			},
-		},
-	};
-}

package/src/extended/sync/before-save.ts

@@ -1,52 +0,0 @@
-import { type V1Document } from '@elementor/editor-documents';
-import { type V1Element, type V1ElementData } from '@elementor/editor-elements';
-
-import { publishDraftComponentsInPageBeforeSave } from '../../sync/publish-draft-components-in-page-before-save';
-import { type DocumentSaveStatus } from '../../types';
-import { setComponentOverridablePropsSettingsBeforeSave } from '../sync/set-component-overridable-props-settings-before-save';
-import { updateArchivedComponentBeforeSave } from '../sync/update-archived-component-before-save';
-import { updateComponentTitleBeforeSave } from '../sync/update-component-title-before-save';
-import { createComponentsBeforeSave } from './create-components-before-save';
-
-type Options = {
-	container: V1Element & {
-		document: V1Document;
-		model: {
-			get: ( key: 'elements' ) => {
-				toJSON: () => V1ElementData[];
-			};
-		};
-	};
-	status: DocumentSaveStatus;
-};
-
-export const beforeSave = ( { container, status }: Options ) => {
-	const elements = container?.model.get( 'elements' ).toJSON?.() ?? [];
-
-	return Promise.all( [
-		syncComponents( { elements, status } ),
-		setComponentOverridablePropsSettingsBeforeSave( { container } ),
-	] );
-};
-
-// These operations run sequentially to prevent race conditions when multiple
-// edits occur on the same component simultaneously.
-// TODO: Consolidate these into a single PUT /components endpoint.
-const syncComponents = async ( { elements, status }: { elements: V1ElementData[]; status: DocumentSaveStatus } ) => {
-	// This order is important - first update existing components, then create new components,
-	// Since new component validation depends on the existing components (preventing duplicate names).
-	await updateExistingComponentsBeforeSave( { elements, status } );
-	await createComponentsBeforeSave( { elements, status } );
-};
-
-const updateExistingComponentsBeforeSave = async ( {
-	elements,
-	status,
-}: {
-	elements: V1ElementData[];
-	status: DocumentSaveStatus;
-} ) => {
-	await updateComponentTitleBeforeSave( status );
-	await updateArchivedComponentBeforeSave( status );
-	await publishDraftComponentsInPageBeforeSave( { elements, status } );
-};