@madj2k/fe-frontend-kit 2.0.34 → 2.0.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@madj2k/fe-frontend-kit",
3
- "version": "2.0.34",
3
+ "version": "2.0.35",
4
4
  "description": "Shared frontend utilities, menus and mixins for projects",
5
5
  "main": "index.js",
6
6
  "style": "index.scss",
@@ -8,10 +8,11 @@
8
8
  * - Reusable for any type of element (quotes, sections, etc.)
9
9
  * - Fully configurable: class name, threshold, delay
10
10
  * - Designed for CMS contexts with dynamically loaded content
11
+ * - Triggers an event that can be used for custom animations
11
12
  *
12
13
  * @author Steffen Kroggel <developer@steffenkroggel.de>
13
14
  * @copyright 2025 Steffen Kroggel
14
- * @version 1.0.1
15
+ * @version 1.0.2
15
16
  * @license GNU General Public License v3.0
16
17
  * @see https://www.gnu.org/licenses/gpl-3.0.en.html
17
18
  *
@@ -37,8 +38,14 @@
37
38
  * threshold: 0.5
38
39
  * });
39
40
  * });
40
- */
41
-
41
+ *
42
+ * @example
43
+ * // Event listener
44
+ * document.addEventListener('madj2k-element-in-viewport-active', () => {
45
+ * // do something
46
+ * });
47
+ *
48
+ * */
42
49
  class Madj2kElementInViewport {
43
50
  config = {
44
51
  visibleClass: 'is-in-viewport',
@@ -113,6 +120,13 @@ class Madj2kElementInViewport {
113
120
  this.element.classList.add(this.config.visibleClass);
114
121
  observer.unobserve(this.element);
115
122
  this._log(`Class "${this.config.visibleClass}" added.`);
123
+
124
+ // Custom event dispatch
125
+ const event = new CustomEvent('madj2k-element-in-viewport-active');
126
+ this.element.dispatchEvent(event);
127
+
128
+ this._log(`Event fired.`);
129
+
116
130
  }
117
131
 
118
132
  /**