@elementor/editor-props 0.13.0 → 0.15.0

package/src/index.ts

@@ -7,6 +7,7 @@ export * from './prop-types';
 
 // utils
 export { mergeProps } from './utils/merge-props';
-export { createPropUtils } from './utils/create-prop-utils';
+export { createPropUtils, createArrayPropUtils } from './utils/create-prop-utils';
+export { shouldApplyEffect, evaluateTerm } from './utils/prop-dependency-utils';
 export { isTransformable } from './utils/is-transformable';
 export { filterEmptyValues, isEmpty } from './utils/filter-empty-values';

package/src/prop-types/filter-prop-types/blur-filter.ts

@@ -0,0 +1,8 @@
+import { type z } from '@elementor/schema';
+
+import { createPropUtils } from '../../utils/create-prop-utils';
+import { unknownChildrenSchema } from '../utils';
+
+export const blurFilterPropTypeUtil = createPropUtils( 'blur', unknownChildrenSchema );
+
+export type BlurFilterPropValue = z.infer< typeof blurFilterPropTypeUtil.schema >;

package/src/prop-types/filter-prop-types/brightness-filter.ts

@@ -0,0 +1,8 @@
+import { type z } from '@elementor/schema';
+
+import { createPropUtils } from '../../utils/create-prop-utils';
+import { unknownChildrenSchema } from '../utils';
+
+export const brightnessFilterPropTypeUtil = createPropUtils( 'brightness', unknownChildrenSchema );
+
+export type BrightnessFilterPropValue = z.infer< typeof brightnessFilterPropTypeUtil.schema >;

package/src/prop-types/filter-prop-types/filter.ts

@@ -0,0 +1,12 @@
+import { z } from '@elementor/schema';
+
+import { createPropUtils } from '../../utils/create-prop-utils';
+import { blurFilterPropTypeUtil } from './blur-filter';
+import { brightnessFilterPropTypeUtil } from './brightness-filter';
+
+const filterTypes = blurFilterPropTypeUtil.schema.or( brightnessFilterPropTypeUtil.schema );
+export const filterPropTypeUtil = createPropUtils( 'filter', z.array( filterTypes ) );
+
+export type FilterPropValue = z.infer< typeof filterPropTypeUtil.schema >;
+
+export type FilterItemPropValue = z.infer< typeof filterTypes >;

package/src/prop-types/index.ts

@@ -25,3 +25,8 @@ export * from './background-prop-types/background-image-size-scale';
 export * from './boolean';
 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

@@ -0,0 +1,14 @@
+import { z } from '@elementor/schema';
+
+import { createPropUtils } from '../utils/create-prop-utils';
+import { unknownChildrenSchema } from './utils';
+
+export const keyValuePropTypeUtil = createPropUtils(
+	'key-value',
+	z.strictObject( {
+		key: unknownChildrenSchema,
+		value: unknownChildrenSchema,
+	} )
+);
+
+export type KeyValuePropValue = z.infer< typeof keyValuePropTypeUtil.schema >;

package/src/prop-types/position.ts

@@ -0,0 +1,14 @@
+import { z } from '@elementor/schema';
+
+import { createPropUtils } from '../utils/create-prop-utils';
+import { sizePropTypeUtil } from './size';
+
+export const positionPropTypeUtil = createPropUtils(
+	'object-position',
+	z.strictObject( {
+		x: sizePropTypeUtil.schema.nullable(),
+		y: sizePropTypeUtil.schema.nullable(),
+	} )
+);
+
+export type PositionPropTypeValue = z.infer< typeof positionPropTypeUtil.schema >;

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/create-prop-utils.ts

@@ -87,3 +87,10 @@ export function createPropUtils< TKey extends string, TValue extends PropValue >
 		key: key as TKey,
 	};
 }
+
+export function createArrayPropUtils< TKey extends string, TValue extends PropValue >(
+	key: TKey,
+	valueSchema: ZodType< TValue >
+) {
+	return createPropUtils( `${ key }-array`, z.array( valueSchema ) );
+}

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;
+}