@elementor/editor-props 0.14.0 → 0.15.0

package/src/prop-types/index.ts

@@ -27,3 +27,6 @@ export * from './color-stop';
 export * from './gradient-color-stop';
 export * from './key-value';
 export * from './position';
+export * from './filter-prop-types/filter';
+export * from './filter-prop-types/blur-filter';
+export * from './filter-prop-types/brightness-filter';

package/src/prop-types/key-value.ts

@@ -4,7 +4,7 @@ import { createPropUtils } from '../utils/create-prop-utils';
 import { unknownChildrenSchema } from './utils';
 
 export const keyValuePropTypeUtil = createPropUtils(
-	'keyValue',
+	'key-value',
 	z.strictObject( {
 		key: unknownChildrenSchema,
 		value: unknownChildrenSchema,

package/src/types.ts

@@ -1,9 +1,39 @@
 export type PropTypeKey = string;
 
+export type DependencyEffect = 'disable' | 'hide';
+
+export type DependencyOperator =
+	| 'lt'
+	| 'lte'
+	| 'eq'
+	| 'ne'
+	| 'gte'
+	| 'gt'
+	| 'exists'
+	| 'not_exist'
+	| 'in'
+	| 'nin'
+	| 'contains'
+	| 'ncontains';
+
+export type DependencyTerm< THasActualValue extends boolean = false > = {
+	operator: DependencyOperator;
+	path: string[];
+	value: PropValue;
+	actualValue: THasActualValue extends true ? PropValue : never;
+};
+
+export type Dependency< THasActualValue extends boolean = false > = {
+	effect: DependencyEffect;
+	relation: 'or' | 'and';
+	terms: ( DependencyTerm< THasActualValue > | Dependency< THasActualValue > )[];
+};
+
 type BasePropType< TValue > = {
 	default?: TValue | null;
 	settings: Record< string, unknown >;
 	meta: Record< string, unknown >;
+	dependencies?: Dependency[];
 };
 
 export type PlainPropType = BasePropType< PlainPropValue > & {

package/src/utils/prop-dependency-utils.ts

@@ -0,0 +1,83 @@
+import { type Dependency, type DependencyTerm, type PropValue } from '../types';
+
+type ParsedTerm = DependencyTerm< true >;
+
+type Relation = Dependency[ 'relation' ];
+
+export function shouldApplyEffect( { relation, terms }: Dependency< true > ): boolean {
+	if ( ! terms.length ) {
+		return false;
+	}
+
+	const method = getRelationMethod( relation );
+
+	return terms[ method ]( ( term: ParsedTerm | Dependency< true > ) =>
+		isDependency( term ) ? shouldApplyEffect( term ) : evaluateTerm( term, term.actualValue )
+	);
+}
+
+export function evaluateTerm( term: DependencyTerm< true >, actualValue: PropValue ) {
+	const { value: valueToCompare, operator } = term;
+
+	switch ( operator ) {
+		case 'eq':
+		case 'ne':
+			return ( actualValue === valueToCompare ) === ( 'eq' === operator );
+
+		case 'gt':
+		case 'lte':
+			return (
+				! isNaN( Number( actualValue ) ) &&
+				! isNaN( Number( valueToCompare ) ) &&
+				Number( actualValue ) > Number( valueToCompare ) === ( 'gt' === operator )
+			);
+
+		case 'lt':
+		case 'gte':
+			return (
+				! isNaN( Number( actualValue ) ) &&
+				! isNaN( Number( valueToCompare ) ) &&
+				Number( actualValue ) < Number( valueToCompare ) === ( 'lt' === operator )
+			);
+
+		case 'in':
+		case 'nin':
+			return Array.isArray( valueToCompare ) && valueToCompare.includes( actualValue ) === ( 'in' === operator );
+
+		case 'contains':
+		case 'ncontains':
+			return (
+				'string' === typeof actualValue &&
+				'string' === typeof valueToCompare &&
+				( 'contains' === operator ) === actualValue.includes( valueToCompare )
+			);
+
+		case 'exists':
+		case 'not_exist':
+			const evaluation = !! actualValue || 0 === actualValue || false === actualValue;
+
+			return ( 'exists' === operator ) === evaluation;
+
+		default:
+			return false;
+	}
+}
+
+function getRelationMethod( relation: Relation ) {
+	switch ( relation ) {
+		case 'or':
+			return 'some';
+
+		case 'and':
+			return 'every';
+
+		default:
+			throw new Error( `Relation not supported ${ relation }` );
+	}
+}
+
+function isDependency< THasActualValue extends boolean >(
+	term: DependencyTerm< THasActualValue > | Dependency< THasActualValue >
+): term is Dependency< THasActualValue > {
+	return 'relation' in term;
+}