@wix/interact 2.0.0 → 2.0.1

package/rules/pointermove.md

@@ -87,7 +87,7 @@ Controls how the progress range is calculated:
 - `[TARGET_KEY]`: Unique identifier for target element to animate (can be same as source or different)
 - `[HIT_AREA]`: 'self' (mouse within source element) or 'root' (mouse anywhere in viewport)
 - `[3D_EFFECT_TYPE]`: 'Tilt3DMouse', 'Track3DMouse', 'SwivelMouse'
-- `[EFFECT_PROPERTIES]`: Named effect specific properties (angle, perspective, power, etc.)
+- `[EFFECT_PROPERTIES]`: Named effect specific properties (angle, perspective, direction, etc.)
 - `[CENTERED_TO_TARGET]`: true (center range at target) or false (use source element bounds)
 - `[UNIQUE_EFFECT_ID]`: Optional unique identifier
 
@@ -106,8 +106,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'Tilt3DMouse',
                 angle: 15,
-                perspective: 1000,
-                power: 'medium'
+                perspective: 1000
             }
         }
     ]
@@ -142,8 +141,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: '[MOVEMENT_EFFECT_TYPE]',
                 distance: { value: [DISTANCE_VALUE], unit: '[DISTANCE_UNIT]' },
-                axis: '[AXIS_CONSTRAINT]',
-                power: '[POWER_LEVEL]'
+                axis: '[AXIS_CONSTRAINT]'
             },
             centeredToTarget: [CENTERED_TO_TARGET],
             effectId: '[UNIQUE_EFFECT_ID]'
@@ -158,7 +156,6 @@ Controls how the progress range is calculated:
 - `[DISTANCE_VALUE]`: Numeric value for movement distance
 - `[DISTANCE_UNIT]`: 'px', 'percentage', 'vw', 'vh'
 - `[AXIS_CONSTRAINT]`: 'both', 'horizontal', 'vertical'
-- `[POWER_LEVEL]`: 'soft', 'medium', 'hard'
 - Other variables same as Rule 1
 
 **Example - Cursor Follower Element**:
@@ -175,8 +172,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'TrackMouse',
                 distance: { value: 50, unit: 'percentage' },
-                axis: 'both',
-                power: 'medium'
+                axis: 'both'
             },
             centeredToTarget: false
         }
@@ -199,8 +195,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'AiryMouse',
                 distance: { value: 30, unit: 'px' },
-                axis: 'both',
-                power: 'soft'
+                axis: 'both'
             },
             centeredToTarget: true,
             effectId: 'hero-float'
@@ -248,7 +243,7 @@ Controls how the progress range is calculated:
 **Variables**:
 
 - `[SCALE_EFFECT_TYPE]`: 'ScaleMouse', 'BlobMouse', 'SkewMouse'
-- `[SCALE_PROPERTIES]`: Effect-specific properties (scale, distance, axis, power)
+- `[SCALE_PROPERTIES]`: Effect-specific properties (scale, distance, axis)
 - Other variables same as Rule 1
 
 **Example - Interactive Scale Button**:
@@ -267,8 +262,7 @@ Controls how the progress range is calculated:
                 type: 'ScaleMouse',
                 scale: 1.1,
                 distance: { value: 100, unit: 'px' },
-                axis: 'both',
-                power: 'medium'
+                axis: 'both'
             },
             centeredToTarget: true
         }
@@ -291,8 +285,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'BlobMouse',
                 intensity: 0.8,
-                smoothness: 0.6,
-                power: 'medium'
+                smoothness: 0.6
             },
             effectId: 'blob-morph'
         }
@@ -339,7 +332,7 @@ Controls how the progress range is calculated:
 **Variables**:
 
 - `[VISUAL_EFFECT_TYPE]`: 'BlurMouse', 'SpinMouse'
-- `[VISUAL_PROPERTIES]`: Effect-specific properties (blur amount, rotation speed, power)
+- `[VISUAL_PROPERTIES]`: Effect-specific properties (blur amount, rotation speed)
 - Other variables same as Rule 1
 
 **Example - Motion Blur Card**:
@@ -357,8 +350,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'BlurMouse',
                 blurAmount: 5,
-                motionIntensity: 0.7,
-                power: 'medium'
+                motionIntensity: 0.7
             },
             centeredToTarget: true
         }
@@ -381,8 +373,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'SpinMouse',
                 rotationSpeed: 0.5,
-                direction: 'clockwise',
-                power: 'soft'
+                direction: 'clockwise'
             },
             centeredToTarget: false,
             effectId: 'icon-spin'
@@ -418,8 +409,7 @@ Controls how the progress range is calculated:
             key: '[BACKGROUND_LAYER_KEY]',
             namedEffect: {
                 type: '[BACKGROUND_EFFECT_TYPE]',
-                distance: { value: [BACKGROUND_DISTANCE], unit: '[DISTANCE_UNIT]' },
-                power: '[BACKGROUND_POWER]'
+                distance: { value: [BACKGROUND_DISTANCE], unit: '[DISTANCE_UNIT]' }
             },
             centeredToTarget: [CENTERED_TO_TARGET]
         },
@@ -427,8 +417,7 @@ Controls how the progress range is calculated:
             key: '[MIDGROUND_LAYER_KEY]',
             namedEffect: {
                 type: '[MIDGROUND_EFFECT_TYPE]',
-                distance: { value: [MIDGROUND_DISTANCE], unit: '[DISTANCE_UNIT]' },
-                power: '[MIDGROUND_POWER]'
+                distance: { value: [MIDGROUND_DISTANCE], unit: '[DISTANCE_UNIT]' }
             },
             centeredToTarget: [CENTERED_TO_TARGET]
         },
@@ -436,8 +425,7 @@ Controls how the progress range is calculated:
             key: '[FOREGROUND_LAYER_KEY]',
             namedEffect: {
                 type: '[FOREGROUND_EFFECT_TYPE]',
-                distance: { value: [FOREGROUND_DISTANCE], unit: '[DISTANCE_UNIT]' },
-                power: '[FOREGROUND_POWER]'
+                distance: { value: [FOREGROUND_DISTANCE], unit: '[DISTANCE_UNIT]' }
             },
             centeredToTarget: [CENTERED_TO_TARGET]
         }
@@ -451,7 +439,6 @@ Controls how the progress range is calculated:
 - `[*_LAYER_KEY]`: Unique identifier for different layer elements
 - `[*_EFFECT_TYPE]`: Named effects for each layer (typically movement effects)
 - `[*_DISTANCE]`: Movement distance for each layer (creating depth)
-- `[*_POWER]`: Power level for each layer response
 - Other variables same as previous rules
 
 **Example - Parallax Card Layers**:
@@ -469,8 +456,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'AiryMouse',
                 distance: { value: 15, unit: 'px' },
-                axis: 'both',
-                power: 'soft'
+                axis: 'both'
             },
             centeredToTarget: true
         },
@@ -479,8 +465,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'TrackMouse',
                 distance: { value: 25, unit: 'px' },
-                axis: 'both',
-                power: 'medium'
+                axis: 'both'
             },
             centeredToTarget: true
         },
@@ -489,8 +474,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'BounceMouse',
                 distance: { value: 35, unit: 'px' },
-                axis: 'both',
-                power: 'medium'
+                axis: 'both'
             },
             centeredToTarget: true
         }
@@ -513,8 +497,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'AiryMouse',
                 distance: { value: 20, unit: 'px' },
-                axis: 'both',
-                power: 'soft'
+                axis: 'both'
             },
             centeredToTarget: true
         },
@@ -523,8 +506,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'TrackMouse',
                 distance: { value: 40, unit: 'px' },
-                axis: 'horizontal',
-                power: 'medium'
+                axis: 'horizontal'
             },
             centeredToTarget: true
         },
@@ -533,8 +515,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'ScaleMouse',
                 scale: 1.05,
-                distance: { value: 60, unit: 'px' },
-                power: 'medium'
+                distance: { value: 60, unit: 'px' }
             },
             centeredToTarget: true
         }
@@ -610,8 +591,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'Tilt3DMouse',
                 angle: 12,
-                perspective: 1000,
-                power: 'soft'
+                perspective: 1000
             },
             centeredToTarget: true
         },
@@ -620,8 +600,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'AiryMouse',
                 distance: { value: 20, unit: 'px' },
-                axis: 'both',
-                power: 'soft'
+                axis: 'both'
             },
             centeredToTarget: true
         }
@@ -644,8 +623,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'ScaleMouse',
                 scale: 1.05,
-                distance: { value: 80, unit: 'px' },
-                power: 'medium'
+                distance: { value: 80, unit: 'px' }
             },
             centeredToTarget: true
         },
@@ -654,8 +632,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'TrackMouse',
                 distance: { value: 15, unit: 'px' },
-                axis: 'horizontal',
-                power: 'hard'
+                axis: 'horizontal'
             },
             centeredToTarget: false
         }
@@ -722,8 +699,7 @@ Controls how the progress range is calculated:
             namedEffect: {
                 type: 'TrackMouse',
                 distance: { value: 0, unit: 'px' },
-                axis: 'both',
-                power: 'hard'
+                axis: 'both'
             },
             centeredToTarget: false,
             effectId: 'global-cursor'
@@ -745,9 +721,8 @@ Controls how the progress range is calculated:
         {
             namedEffect: {
                 type: 'AiryMouse',
-                distance: { value: 50, type: 'px' },
-                axis: 'both',
-                power: 'soft'
+                distance: { value: 50, unit: 'px' },
+                axis: 'both'
             },
             centeredToTarget: false,
             effectId: 'decoration-follower'
@@ -1264,8 +1239,7 @@ Adjusting pointer sensitivity based on device capabilities:
             namedEffect: {
                 type: 'Tilt3DMouse',
                 angle: 20,
-                perspective: 800,
-                power: 'medium'
+                perspective: 800
             },
             centeredToTarget: true
         }
@@ -1284,8 +1258,7 @@ Adjusting pointer sensitivity based on device capabilities:
             key: 'responsive-element',
             namedEffect: {
                 type: 'ScaleMouse',
-                scale: 1.02,
-                power: 'soft'
+                scale: 1.02
             },
             centeredToTarget: true
         }
@@ -1310,8 +1283,7 @@ Different hit areas for different interaction contexts:
             key: 'local-card',
             namedEffect: {
                 type: 'Tilt3DMouse',
-                angle: 15,
-                power: 'medium'
+                angle: 15
             },
             centeredToTarget: true
         }
@@ -1329,8 +1301,7 @@ Different hit areas for different interaction contexts:
             key: 'ambient-element',
             namedEffect: {
                 type: 'AiryMouse',
-                distance: { value: 30, unit: 'px' },
-                power: 'soft'
+                distance: { value: 30, unit: 'px' }
             },
             centeredToTarget: false
         }
@@ -1355,8 +1326,7 @@ Controlling movement direction for specific design needs:
             namedEffect: {
                 type: 'TrackMouse',
                 distance: { value: 100, unit: 'px' },
-                axis: 'horizontal',
-                power: 'medium'
+                axis: 'horizontal'
             },
             centeredToTarget: true
         },
@@ -1366,8 +1336,7 @@ Controlling movement direction for specific design needs:
                 type: 'ScaleMouse',
                 scale: 1.2,
                 distance: { value: 150, unit: 'px' },
-                axis: 'vertical',
-                power: 'medium'
+                axis: 'vertical'
             },
             centeredToTarget: true
         }
@@ -1527,7 +1496,6 @@ Controlling movement direction for specific design needs:
 
 **Poor pointer responsiveness**:
 
-- Check `power` settings (soft/medium/hard) for namedEffect
 - Verify `hitArea` configuration
 - Test `centeredToTarget` settings
 - Ensure target elements are properly positioned

package/rules/scroll-list.md

@@ -25,8 +25,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: '[CONTAINER_NAMED_EFFECT]'
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             easing: 'linear',
             effectId: '[UNIQUE_EFFECT_ID]'
         }
@@ -54,8 +54,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'PanScroll'
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             effectId: 'gallery-slide'
         }
@@ -75,8 +75,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'BgParallax'
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             effectId: 'bg-parallax'
         }
@@ -109,8 +109,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: '[ITEM_NAMED_EFFECT]'
             },
-            rangeStart: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             easing: '[EASING_FUNCTION]',
             effectId: '[UNIQUE_EFFECT_ID]'
         }
@@ -145,8 +145,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                 type: 'RevealScroll',
                 direction: 'bottom'
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 60 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 60 } },
             easing: 'ease-out',
             effectId: 'item-reveal'
         }
@@ -166,8 +166,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'GrowScroll'
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: 50 } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: 50 } },
             easing: 'ease-in-out',
             effectId: 'item-grow'
         }
@@ -200,8 +200,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: '[CONTENT_NAMED_EFFECT]'
             },
-            rangeStart: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             easing: '[EASING_FUNCTION]',
             effectId: '[UNIQUE_EFFECT_ID]'
         }
@@ -234,8 +234,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'FadeScroll'
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 20 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 80 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 20 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 80 } },
             easing: 'ease-out',
             effectId: 'text-reveal-1'
         }
@@ -251,8 +251,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'FadeScroll'
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 20 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 80 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 20 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 80 } },
             easing: 'ease-out',
             effectId: 'text-reveal-2'
         }
@@ -273,8 +273,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'RevealScroll'
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 50 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 50 } },
             easing: 'cubic-bezier(0.16, 1, 0.3, 1)',
             effectId: 'product-image-reveal'
         }
@@ -312,8 +312,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { [CSS_PROPERTY_1]: '[END_VALUE_1]', [CSS_PROPERTY_2]: '[END_VALUE_2]', [CSS_PROPERTY_3]: '[END_VALUE_3]' }
                 ]
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             easing: 'linear',
             fill: 'both',
             effectId: '[UNIQUE_EFFECT_ID]'
@@ -347,8 +347,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { transform: 'translateX(-100%)', filter: 'brightness(1)', backgroundColor: 'rgb(255 255 255 / 0)' }
                 ]
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             fill: 'both',
             effectId: 'container-slide'
@@ -373,8 +373,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { transform: 'scale(1) rotate(0deg)', opacity: '1', filter: 'hue-rotate(0deg)' }
                 ]
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             fill: 'both',
             effectId: 'bg-transform'
@@ -413,8 +413,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { [CSS_PROPERTY_1]: '[END_VALUE_1]', [CSS_PROPERTY_2]: '[END_VALUE_2]' }
                 ]
             },
-            rangeStart: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             easing: '[EASING_FUNCTION]',
             fill: 'both',
             effectId: '[UNIQUE_EFFECT_ID]'
@@ -447,8 +447,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { opacity: '1', transform: 'translateY(0) scale(1) rotate(0deg)', filter: 'blur(0)', boxShadow: '0 20px 40px rgb(0 0 0 / 0.15)' }
                 ]
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 80 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 80 } },
             easing: 'cubic-bezier(0.16, 1, 0.3, 1)',
             fill: 'both',
             effectId: 'timeline-entrance'
@@ -474,8 +474,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { opacity: '0', transform: 'scale(0.8) rotate(-5deg)', filter: 'brightness(0.6)' }
                 ]
             },
-            rangeStart: { name: 'exit', offset: { type: 'percentage', value: 20 } },
-            rangeEnd: { name: 'exit', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'exit', offset: { unit: 'percentage', value: 20 } },
+            rangeEnd: { name: 'exit', offset: { unit: 'percentage', value: 100 } },
             easing: 'ease-in',
             fill: 'both',
             effectId: 'card-exit'
@@ -503,8 +503,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
     effects: {
         [EFFECT_ID]: {
             [EFFECT_TYPE]: [EFFECT_DEFINITION],
-            rangeStart: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             easing: '[EASING_FUNCTION]'
         }
     },
@@ -532,8 +532,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
             namedEffect: {
                 type: 'SlideScroll'
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 60 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 60 } },
             easing: 'linear'
         }
     },
@@ -582,8 +582,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     { opacity: '1', transform: 'translateY(0) scale(1)' }
                 ]
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 100 } },
             easing: 'expoOut',
             fill: 'both'
         }
@@ -648,8 +648,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                 [DYNAMIC_CONTENT_UPDATE]
                 [VISUAL_PROPERTY_UPDATES]
             },
-            rangeStart: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [START_PERCENTAGE] } },
-            rangeEnd: { name: '[RANGE_TYPE]', offset: { type: 'percentage', value: [END_PERCENTAGE] } },
+            rangeStart: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [START_PERCENTAGE] } },
+            rangeEnd: { name: '[RANGE_TYPE]', offset: { unit: 'percentage', value: [END_PERCENTAGE] } },
             fill: 'both',
             effectId: '[UNIQUE_EFFECT_ID]'
         }
@@ -692,8 +692,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     progressBar.style.width = `${percentage}%`;
                 }
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'exit', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'exit', offset: { unit: 'percentage', value: 100 } },
             fill: 'both',
             effectId: 'stats-counter'
         }
@@ -748,8 +748,8 @@ These rules help generate scroll-driven list animations using the `@wix/interact
                     progressIndicator.textContent = `${Math.floor(progress * 100)}% Complete`;
                 }
             },
-            rangeStart: { name: 'cover', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'cover', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'cover', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'cover', offset: { unit: 'percentage', value: 100 } },
             fill: 'both',
             effectId: 'task-progress'
         }
@@ -780,8 +780,8 @@ Coordinating container, items, and content simultaneously:
                     { transform: 'scale(1) translateY(-50px)', filter: 'blur(2px)' }
                 ]
             },
-            rangeStart: { name: 'cover', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'cover', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'cover', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'cover', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             fill: 'both'
         },
@@ -795,8 +795,8 @@ Coordinating container, items, and content simultaneously:
                     { transform: 'translateX(-50%)' }
                 ]
             },
-            rangeStart: { name: 'contain', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'contain', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'contain', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'contain', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             fill: 'both'
         },
@@ -810,8 +810,8 @@ Coordinating container, items, and content simultaneously:
                     { transform: 'translateY(-100px)', opacity: '1' }
                 ]
             },
-            rangeStart: { name: 'cover', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'cover', offset: { type: 'percentage', value: 100 } },
+            rangeStart: { name: 'cover', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'cover', offset: { unit: 'percentage', value: 100 } },
             easing: 'linear',
             fill: 'both'
         }
@@ -839,8 +839,8 @@ Adaptive patterns based on screen size and device capabilities:
                     { transform: 'translateY(0) rotateY(0deg)', boxShadow: '0 0 0 rgb(0 0 0 / 0)' }
                 ]
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 80 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 80 } },
             easing: 'cubic-bezier(0.16, 1, 0.3, 1)',
             fill: 'both'
         }
@@ -861,8 +861,8 @@ Adaptive patterns based on screen size and device capabilities:
                     { opacity: '1', transform: 'translateY(0)' }
                 ]
             },
-            rangeStart: { name: 'entry', offset: { type: 'percentage', value: 0 } },
-            rangeEnd: { name: 'entry', offset: { type: 'percentage', value: 60 } },
+            rangeStart: { name: 'entry', offset: { unit: 'percentage', value: 0 } },
+            rangeEnd: { name: 'entry', offset: { unit: 'percentage', value: 60 } },
             easing: 'ease-out',
             fill: 'both'
         }

package/rules/viewenter.md

@@ -597,7 +597,6 @@ Same as Rule 2
         namedEffect: {
           type: 'SlideIn',
           direction: 'bottom',
-          power: 'medium',
         },
         duration: 600,
         easing: 'ease-out',
@@ -618,7 +617,6 @@ Same as Rule 2
         namedEffect: {
           type: 'SlideIn',
           direction: 'bottom',
-          power: 'medium',
         },
         duration: 600,
         easing: 'ease-out',
@@ -639,7 +637,6 @@ Same as Rule 2
         namedEffect: {
           type: 'SlideIn',
           direction: 'bottom',
-          power: 'medium',
         },
         duration: 600,
         easing: 'ease-out',