@wix/interact 1.74.0 → 1.76.0

package/README.md

@@ -30,7 +30,7 @@ const config = {
   interactions: [
     {
       trigger: 'viewEnter',
-      source: '#my-element',
+      key: '#my-element',
       effects: [
         {
           effectId: 'fade-in',
@@ -42,7 +42,8 @@ const config = {
     'fade-in': {
       duration: 1000,
       keyframeEffect: {
-        opacity: [0, 1]
+        name: 'fade',
+        keyframes: {opacity: [0, 1]}
       }
     }
   }
@@ -56,7 +57,7 @@ const interact = Interact.create(config);
 
 ```html
 <!-- Wrap your target element with wix-interact-element -->
-<wix-interact-element data-wix-path="#my-element">
+<wix-interact-element data-wix-path="my-element">
   <div>This will fade in when it enters the viewport!</div>
 </wix-interact-element>
 ```
@@ -69,7 +70,7 @@ import React from 'react';
 
 function MyComponent() {
   return (
-    <wix-interact-element data-wix-path="#my-element">
+    <wix-interact-element data-wix-path="my-element">
       <div className="animated-content">
         Hello, animated world!
       </div>
@@ -94,7 +95,7 @@ Define when interactions should occur:
 Define what should happen:
 - **Time-based animations** - Duration-based effects with easing
 - **Scroll-driven animations** - Progress-based effects tied to scroll
-- **Pointer-driven animations** - Progress-based effects linked to pointer possition
+- **Pointer-driven animations** - Progress-based effects linked to pointer position
 - **CSS transitions** - Style property transitions
 - **Custom effects** - Integration with `@wix/motion`
 
@@ -104,14 +105,17 @@ Define what should happen:
   interactions: [    // Define trigger → effect relationships
     {
       trigger: 'viewEnter',
-      source: '#source-element',
+      key: 'source-element',
       effects: [{ effectId: 'my-effect' }]
     }
   ],
   effects: {         // Define reusable effect definitions
     'my-effect': {
       duration: 1000,
-      keyframeEffect: { opacity: [0, 1] }
+      keyframeEffect: {
+        name: 'fade',
+        keyframes: { opacity: [0, 1] }
+      }
     }
   },
   conditions: {      // Define conditional logic
@@ -132,20 +136,20 @@ Define what should happen:
 // Create a new instance with configuration
 Interact.create(config: InteractConfig): Interact
 
-// Get instance that handles a specific path
-Interact.getInstance(path: string): Interact | undefined
+// Get instance that handles a specific key
+Interact.getInstance(key: string): Interact | undefined
 
-// Get cached element by path
-Interact.getElement(path: string): IWixInteractElement | undefined
+// Get cached element by key
+Interact.getElement(key: string): IWixInteractElement | undefined
 ```
 
 ### Standalone Functions
 ```typescript
 // Add interactions to an element
-add(element: IWixInteractElement, path: string): boolean
+add(element: IWixInteractElement, key: string): boolean
 
 // Remove all interactions from an element
-remove(path: string): void
+remove(key: string): void
 ```
 
 ## Examples
@@ -155,7 +159,7 @@ remove(path: string): void
 {
   interactions: [{
     trigger: 'viewEnter',
-    source: '#hero',
+    key: 'hero',
     effects: [{ effectId: 'slide-up' }]
   }],
   effects: {
@@ -163,8 +167,11 @@ remove(path: string): void
       duration: 800,
       easing: 'ease-out',
       keyframeEffect: {
-        transform: ['translateY(50px)', 'translateY(0)'],
-        opacity: [0, 1]
+        name: 'slide-up',
+        keyframes: {
+          transform: ['translateY(20px)', 'translateY(0)'],
+          opacity: [0, 1]
+        }
       }
     }
   }
@@ -176,13 +183,15 @@ remove(path: string): void
 {
   interactions: [{
     trigger: 'click',
-    source: '#button',
+    key: 'button',
     effects: [{ effectId: 'bounce' }]
   }],
   effects: {
     'bounce': {
       duration: 600,
-      namedEffect: 'bounce'
+      namedEffect: {
+        type: 'Bounce'
+      }
     }
   }
 }
@@ -193,7 +202,7 @@ remove(path: string): void
 {
   interactions: [{
     trigger: 'hover',
-    source: '#card',
+    key: 'card',
     conditions: ['desktop-only'],
     effects: [{ effectId: 'lift' }]
   }],
@@ -207,8 +216,11 @@ remove(path: string): void
     'lift': {
       duration: 200,
       keyframeEffect: {
-        transform: ['translateY(0)', 'translateY(-8px)'],
-        boxShadow: ['0 2px 4px rgba(0,0,0,0.1)', '0 8px 16px rgba(0,0,0,0.15)']
+        name: 'lift',
+        keyframes: {
+          transform: ['translateY(0)', 'translateY(-8px)'],
+          boxShadow: ['0 2px 4px rgb(0 0 0 / 0.1)', '0 8px 16px rgb(0 0 0 / 0.15)']
+        }
       }
     }
   }

package/dist/cjs/WixInteractElement.js

@@ -5,7 +5,8 @@ exports.__esModule = true;
 exports.WIX_INTERACT_EFFECT_DATA_ATTR = void 0;
 exports.getWixInteractElement = getWixInteractElement;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _interact = require("./interact");
+var _add = require("./core/add");
+var _remove = require("./core/remove");
 const WIX_INTERACT_EFFECT_DATA_ATTR = exports.WIX_INTERACT_EFFECT_DATA_ATTR = 'wixInteractEffect';
 function getWixInteractElement() {
   let checkedForLegacyStateSyntax = false;
@@ -16,8 +17,10 @@ function getWixInteractElement() {
       (0, _defineProperty2.default)(this, "_internals", void 0);
       (0, _defineProperty2.default)(this, "connected", void 0);
       (0, _defineProperty2.default)(this, "sheet", void 0);
+      (0, _defineProperty2.default)(this, "_observers", void 0);
       this.connected = false;
       this.sheet = null;
+      this._observers = new WeakMap();
       if (this.attachInternals) {
         this._internals = this.attachInternals();
         if (!checkedForLegacyStateSyntax) {
@@ -38,37 +41,45 @@ function getWixInteractElement() {
       this.connect();
     }
     disconnectedCallback() {
-      const path = this.dataset.wixPath;
-      if (path) {
-        (0, _interact.remove)(path);
+      const key = this.dataset.wixPath;
+      if (key) {
+        (0, _remove.remove)(key);
       }
       if (this.sheet) {
         const index = document.adoptedStyleSheets.indexOf(this.sheet);
         document.adoptedStyleSheets.splice(index, 1);
       }
+      this._observers = new WeakMap();
       this.connected = false;
     }
-    connect(path) {
+    connect(key) {
       if (this.connected) {
         return;
       }
-      path = path || this.dataset.wixPath;
-      if (!path) {
-        console.warn('WixInteractElement: No path provided');
+      key = key || this.dataset.wixPath;
+      if (!key) {
+        console.warn('WixInteractElement: No key provided');
         return;
       }
-      if (this.firstElementChild) {
-        this.connected = (0, _interact.add)(this, path);
+      this.connected = (0, _add.add)(this, key);
+    }
+    renderStyle(cssRules) {
+      if (!this.sheet) {
+        this.sheet = new CSSStyleSheet();
+        void this.sheet.replace(cssRules.join('\n'));
+        document.adoptedStyleSheets.push(this.sheet);
       } else {
-        console.warn('WixInteractElement: No child element found');
+        let position = this.sheet.cssRules.length;
+        for (const cssRule of cssRules) {
+          try {
+            this.sheet.insertRule(cssRule, position);
+            position++;
+          } catch (e) {
+            console.error(e);
+          }
+        }
       }
     }
-    renderStyle(cssText) {
-      const sheet = new CSSStyleSheet();
-      this.sheet = sheet;
-      sheet.replace(cssText);
-      document.adoptedStyleSheets.push(sheet);
-    }
     toggleEffect(effectId, method) {
       if (isLegacyStateSyntax) {
         effectId = `--${effectId}`;
@@ -98,6 +109,39 @@ function getWixInteractElement() {
         this.dataset[WIX_INTERACT_EFFECT_DATA_ATTR] = Array.from(currentEffects).join(' ');
       }
     }
+    watchChildList(listContainer) {
+      const list = this.querySelector(listContainer);
+      if (list) {
+        // TODO: we can probably improve this and use less observers, this impl. uses one per container element
+        let observer = this._observers.get(list);
+        if (!observer) {
+          observer = new MutationObserver(this._childListChangeHandler.bind(this, listContainer));
+          this._observers.set(list, observer);
+          observer.observe(list, {
+            childList: true
+          });
+        }
+      }
+    }
+    _childListChangeHandler(listContainer, entries) {
+      const key = this.dataset.wixPath;
+      const removedElements = [];
+      const addedElements = [];
+      entries.forEach(entry => {
+        entry.removedNodes.forEach(el => {
+          if (el instanceof HTMLElement) {
+            removedElements.push(el);
+          }
+        });
+        entry.addedNodes.forEach(el => {
+          if (el instanceof HTMLElement) {
+            addedElements.push(el);
+          }
+        });
+      });
+      (0, _remove.removeListItems)(removedElements);
+      key && (0, _add.addListItems)(this, key, listContainer, addedElements);
+    }
   };
 }
 //# sourceMappingURL=WixInteractElement.js.map

package/dist/cjs/WixInteractElement.js.map

@@ -1 +1 @@
-{"version":3,"names":["_interact","require","WIX_INTERACT_EFFECT_DATA_ATTR","exports","getWixInteractElement","checkedForLegacyStateSyntax","isLegacyStateSyntax","WixInteractElement","HTMLElement","constructor","_defineProperty2","default","connected","sheet","attachInternals","_internals","states","add","delete","e","connectedCallback","connect","disconnectedCallback","path","dataset","wixPath","remove","index","document","adoptedStyleSheets","indexOf","splice","console","warn","firstElementChild","renderStyle","cssText","CSSStyleSheet","replace","push","toggleEffect","effectId","method","has","clear","_this$dataset$WIX_INT","currentEffects","Set","split","Array","from","join"],"sources":["../../src/WixInteractElement.ts"],"sourcesContent":["import type { StateParams } from './types';\nimport { add, remove } from './interact';\n\nexport const WIX_INTERACT_EFFECT_DATA_ATTR = 'wixInteractEffect';\n\nexport function getWixInteractElement() {\n  let checkedForLegacyStateSyntax = false;\n  let isLegacyStateSyntax = false;\n\n  return class WixInteractElement extends HTMLElement {\n    _internals: (ElementInternals & { states: Set<string> }) | null;\n    connected: boolean;\n    sheet: CSSStyleSheet | null;\n\n    constructor() {\n      super();\n\n      this.connected = false;\n      this.sheet = null;\n\n      if (this.attachInternals) {\n        this._internals = this.attachInternals() as ElementInternals & {\n          states: Set<string>;\n        };\n\n        if (!checkedForLegacyStateSyntax) {\n          checkedForLegacyStateSyntax = true;\n\n          try {\n            this._internals.states.add('test');\n            this._internals.states.delete('test');\n          } catch (e) {\n            isLegacyStateSyntax = true;\n          }\n        }\n      } else {\n        checkedForLegacyStateSyntax = true; // custom states not supported - skip syntax check\n        this._internals = null;\n      }\n    }\n    connectedCallback() {\n      this.connect();\n    }\n\n    disconnectedCallback() {\n      const path = this.dataset.wixPath;\n\n      if (path) {\n        remove(path);\n      }\n\n      if (this.sheet) {\n        const index = document.adoptedStyleSheets.indexOf(this.sheet);\n        document.adoptedStyleSheets.splice(index, 1);\n      }\n\n      this.connected = false;\n    }\n\n    connect(path?: string) {\n      if (this.connected) {\n        return;\n      }\n\n      path = path || this.dataset.wixPath;\n\n      if (!path) {\n        console.warn('WixInteractElement: No path provided');\n        return;\n      }\n\n      if (this.firstElementChild) {\n        this.connected = add(this, path);\n      } else {\n        console.warn('WixInteractElement: No child element found');\n      }\n    }\n\n    renderStyle(cssText: string) {\n      const sheet = new CSSStyleSheet();\n      this.sheet = sheet;\n\n      sheet.replace(cssText);\n\n      document.adoptedStyleSheets.push(sheet);\n    }\n\n    toggleEffect(effectId: string, method: StateParams['method']) {\n      if (isLegacyStateSyntax) {\n        effectId = `--${effectId}`;\n      }\n\n      if (this._internals) {\n        if (method === 'toggle') {\n          this._internals.states.has(effectId)\n            ? this._internals.states.delete(effectId)\n            : this._internals.states.add(effectId);\n        } else if (method === 'add') {\n          this._internals.states.add(effectId);\n        } else if (method === 'remove') {\n          this._internals.states.delete(effectId);\n        } else if (method === 'clear') {\n          this._internals.states.clear();\n        }\n      } else {\n        const currentEffects = new Set(\n          this.dataset[WIX_INTERACT_EFFECT_DATA_ATTR]?.split(' ') || [],\n        );\n\n        if (method === 'toggle') {\n          currentEffects.has(effectId)\n            ? currentEffects.delete(effectId)\n            : currentEffects.add(effectId);\n        } else if (method === 'add') {\n          currentEffects.add(effectId);\n        } else if (method === 'remove') {\n          currentEffects.delete(effectId);\n        } else if (method === 'clear') {\n          currentEffects.clear();\n        }\n\n        this.dataset[WIX_INTERACT_EFFECT_DATA_ATTR] =\n          Array.from(currentEffects).join(' ');\n      }\n    }\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_add","require","_remove","WIX_INTERACT_EFFECT_DATA_ATTR","exports","getWixInteractElement","checkedForLegacyStateSyntax","isLegacyStateSyntax","WixInteractElement","HTMLElement","constructor","_defineProperty2","default","connected","sheet","_observers","WeakMap","attachInternals","_internals","states","add","delete","e","connectedCallback","connect","disconnectedCallback","key","dataset","wixPath","remove","index","document","adoptedStyleSheets","indexOf","splice","console","warn","renderStyle","cssRules","CSSStyleSheet","replace","join","push","position","length","cssRule","insertRule","error","toggleEffect","effectId","method","has","clear","_this$dataset$WIX_INT","currentEffects","Set","split","Array","from","watchChildList","listContainer","list","querySelector","observer","get","MutationObserver","_childListChangeHandler","bind","set","observe","childList","entries","removedElements","addedElements","forEach","entry","removedNodes","el","addedNodes","removeListItems","addListItems"],"sources":["../../src/WixInteractElement.ts"],"sourcesContent":["import type { StateParams } from './types';\nimport { add, addListItems } from './core/add';\nimport { remove, removeListItems } from './core/remove';\n\nexport const WIX_INTERACT_EFFECT_DATA_ATTR = 'wixInteractEffect';\n\nexport function getWixInteractElement() {\n  let checkedForLegacyStateSyntax = false;\n  let isLegacyStateSyntax = false;\n\n  return class WixInteractElement extends HTMLElement {\n    _internals: (ElementInternals & { states: Set<string> }) | null;\n    connected: boolean;\n    sheet: CSSStyleSheet | null;\n    _observers: WeakMap<HTMLElement, MutationObserver>;\n\n    constructor() {\n      super();\n\n      this.connected = false;\n      this.sheet = null;\n      this._observers = new WeakMap();\n\n      if (this.attachInternals) {\n        this._internals = this.attachInternals() as ElementInternals & {\n          states: Set<string>;\n        };\n\n        if (!checkedForLegacyStateSyntax) {\n          checkedForLegacyStateSyntax = true;\n\n          try {\n            this._internals.states.add('test');\n            this._internals.states.delete('test');\n          } catch (e) {\n            isLegacyStateSyntax = true;\n          }\n        }\n      } else {\n        checkedForLegacyStateSyntax = true; // custom states not supported - skip syntax check\n        this._internals = null;\n      }\n    }\n    connectedCallback() {\n      this.connect();\n    }\n\n    disconnectedCallback() {\n      const key = this.dataset.wixPath;\n\n      if (key) {\n        remove(key);\n      }\n\n      if (this.sheet) {\n        const index = document.adoptedStyleSheets.indexOf(this.sheet);\n        document.adoptedStyleSheets.splice(index, 1);\n      }\n\n      this._observers = new WeakMap();\n\n      this.connected = false;\n    }\n\n    connect(key?: string) {\n      if (this.connected) {\n        return;\n      }\n\n      key = key || this.dataset.wixPath;\n\n      if (!key) {\n        console.warn('WixInteractElement: No key provided');\n        return;\n      }\n\n      this.connected = add(this, key);\n    }\n\n    renderStyle(cssRules: string[]) {\n      if (!this.sheet) {\n        this.sheet = new CSSStyleSheet();\n        void this.sheet.replace(cssRules.join('\\n'));\n\n        document.adoptedStyleSheets.push(this.sheet);\n      } else {\n        let position = this.sheet.cssRules.length;\n\n        for (const cssRule of cssRules) {\n          try {\n            this.sheet.insertRule(cssRule, position);\n            position++;\n          } catch (e) {\n            console.error(e);\n          }\n        }\n      }\n    }\n\n    toggleEffect(effectId: string, method: StateParams['method']) {\n      if (isLegacyStateSyntax) {\n        effectId = `--${effectId}`;\n      }\n\n      if (this._internals) {\n        if (method === 'toggle') {\n          this._internals.states.has(effectId)\n            ? this._internals.states.delete(effectId)\n            : this._internals.states.add(effectId);\n        } else if (method === 'add') {\n          this._internals.states.add(effectId);\n        } else if (method === 'remove') {\n          this._internals.states.delete(effectId);\n        } else if (method === 'clear') {\n          this._internals.states.clear();\n        }\n      } else {\n        const currentEffects = new Set(\n          this.dataset[WIX_INTERACT_EFFECT_DATA_ATTR]?.split(' ') || [],\n        );\n\n        if (method === 'toggle') {\n          currentEffects.has(effectId)\n            ? currentEffects.delete(effectId)\n            : currentEffects.add(effectId);\n        } else if (method === 'add') {\n          currentEffects.add(effectId);\n        } else if (method === 'remove') {\n          currentEffects.delete(effectId);\n        } else if (method === 'clear') {\n          currentEffects.clear();\n        }\n\n        this.dataset[WIX_INTERACT_EFFECT_DATA_ATTR] =\n          Array.from(currentEffects).join(' ');\n      }\n    }\n\n    watchChildList(listContainer: string): void {\n      const list = this.querySelector(listContainer);\n\n      if (list) {\n        // TODO: we can probably improve this and use less observers, this impl. uses one per container element\n        let observer = this._observers.get(list as HTMLElement);\n\n        if (!observer) {\n          observer = new MutationObserver(\n            this._childListChangeHandler.bind(this, listContainer),\n          );\n\n          this._observers.set(list as HTMLElement, observer);\n\n          observer.observe(list as HTMLElement, { childList: true });\n        }\n      }\n    }\n\n    _childListChangeHandler(listContainer: string, entries: MutationRecord[]) {\n      const key = this.dataset.wixPath;\n      const removedElements: HTMLElement[] = [];\n      const addedElements: HTMLElement[] = [];\n\n      entries.forEach((entry) => {\n        entry.removedNodes.forEach((el) => {\n          if (el instanceof HTMLElement) {\n            removedElements.push(el);\n          }\n        });\n\n        entry.addedNodes.forEach((el) => {\n          if (el instanceof HTMLElement) {\n            addedElements.push(el);\n          }\n        });\n      });\n\n      removeListItems(removedElements);\n      key && addListItems(this, key, listContainer, addedElements);\n    }\n  };\n}\n"],"mappings":"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","ignoreList":[]}