@elementor/editor-elements 0.4.2 → 0.5.1

package/src/sync/types.ts

@@ -14,6 +14,7 @@ export type ExtendedWindow = Window & {
 				atomic_controls?: ControlItem[];
 				atomic_props_schema?: PropsSchema;
 				controls: object;
+				base_styles?: StyleDefinition[];
 				title: string;
 			}
 		>;
@@ -31,7 +32,7 @@ export type ExtendedWindow = Window & {
 export type V1Element = {
 	id: string;
 	model: V1Model< V1ElementModelProps >;
-	settings?: V1Model< V1ElementSettingsProps >;
+	settings: V1Model< V1ElementSettingsProps >;
 	children?: V1Element[];
 	view?: {
 		el: HTMLElement;
@@ -50,4 +51,6 @@ export type V1ElementSettingsProps = Record< string, PropValue >;
 
 type V1Model< T > = {
 	get: < K extends keyof T >( key: K ) => T[ K ];
+	set: < K extends keyof T >( key: K, value: T[ K ] ) => void;
+	toJSON: () => T;
 };

package/src/sync/update-element-settings.ts

@@ -0,0 +1,26 @@
+import { type Props } from '@elementor/editor-props';
+import { __privateRunCommandSync as runCommandSync } from '@elementor/editor-v1-adapters';
+
+import { type ElementID } from '../types';
+import getContainer from './get-container';
+
+export type UpdateElementSettingsArgs = {
+	id: ElementID;
+	props: Props;
+	withHistory?: boolean;
+};
+
+export const updateElementSettings = ( { id, props, withHistory = true }: UpdateElementSettingsArgs ) => {
+	const container = getContainer( id );
+
+	const args = {
+		container,
+		settings: { ...props },
+	};
+
+	if ( withHistory ) {
+		runCommandSync( 'document/elements/settings', args );
+	} else {
+		runCommandSync( 'document/elements/set-settings', args, { internal: true } );
+	}
+};

package/src/hooks/use-element-style-props.ts

@@ -1,54 +0,0 @@
-import { type Props } from '@elementor/editor-props';
-import { type StyleDefinition, type StyleDefinitionID, type StyleVariant } from '@elementor/editor-styles';
-import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';
-
-import { getElementStyles } from '../sync/get-element-styles';
-import { type ElementID } from '../types';
-
-export type UseElementStylePropsArgs< T extends Props > = {
-	elementID: ElementID;
-	styleDefID: StyleDefinitionID | null;
-	meta: StyleVariant[ 'meta' ];
-	propNames: Array< keyof T & string >;
-};
-
-type NullableObjectValues< T extends Props > = {
-	[ K in keyof T ]: T[ K ] | null;
-};
-
-export function useElementStyleProps< T extends Props >( {
-	elementID,
-	styleDefID,
-	meta,
-	propNames,
-}: UseElementStylePropsArgs< T > ): NullableObjectValues< T > | null {
-	return useListenTo(
-		commandEndEvent( 'document/atomic-widgets/styles' ),
-		() => {
-			if ( ! styleDefID ) {
-				return null;
-			}
-
-			const styleDef = getElementStyles( elementID )?.[ styleDefID ];
-
-			if ( ! styleDef ) {
-				return null;
-			}
-
-			const variant = getVariantByMeta( styleDef, meta );
-
-			return propNames.reduce< Record< string, unknown > >( ( acc, key ) => {
-				acc[ key ] = variant?.props[ key ] ?? null;
-
-				return acc;
-			}, {} ) as NullableObjectValues< T >;
-		},
-		[ elementID, styleDefID, JSON.stringify( propNames ), meta ]
-	);
-}
-
-export function getVariantByMeta( styleDef: StyleDefinition, meta: StyleVariant[ 'meta' ] ) {
-	return styleDef.variants.find( ( variant ) => {
-		return variant.meta.breakpoint === meta.breakpoint && variant.meta.state === meta.state;
-	} );
-}

package/src/sync/update-settings.ts

@@ -1,16 +0,0 @@
-import { type Props } from '@elementor/editor-props';
-import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';
-
-import { type ElementID } from '../types';
-import getContainer from './get-container';
-
-export const updateSettings = ( { id, props }: { id: ElementID; props: Props } ) => {
-	const container = getContainer( id );
-
-	runCommand( 'document/elements/settings', {
-		container,
-		settings: {
-			...props,
-		},
-	} );
-};

package/src/sync/update-styles.ts

@@ -1,28 +0,0 @@
-import { type PropKey, type Props } from '@elementor/editor-props';
-import { type StyleDefinitionID, type StyleVariant } from '@elementor/editor-styles';
-import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';
-
-import { type ElementID } from '../types';
-import getContainer from './get-container';
-
-export type UpdateStyleProps = {
-	elementID: ElementID;
-	styleDefID: StyleDefinitionID | null;
-	meta: StyleVariant[ 'meta' ];
-	props: Props;
-	bind: PropKey;
-	label?: string;
-};
-
-export const updateStyle = async ( { elementID, styleDefID, meta, props, bind, label }: UpdateStyleProps ) => {
-	const container = getContainer( elementID );
-
-	await runCommand( 'document/atomic-widgets/styles', {
-		container,
-		styleDefID,
-		bind,
-		meta,
-		props,
-		label,
-	} );
-};