coonlink-luxy 26.1.7 → 26.1.9

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.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAYA,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,OAAO,CAAC;IAC7C,OAAO,IAAI,IAAI,CAAC;CACjB;AAqLD,wBAAgB,kBAAkB,IAAI,oBAAoB,CAEzD;AAED,wBAAgB,uBAAuB,IAAI,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC,CAEjF"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAYA,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,OAAO,CAAC;IAC7C,OAAO,IAAI,IAAI,CAAC;CACjB;AAiND,wBAAgB,kBAAkB,IAAI,oBAAoB,CAEzD;AAED,wBAAgB,uBAAuB,IAAI,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC,CAEjF"}
package/dist/index.js CHANGED
@@ -39,18 +39,44 @@ class Engine {
39
39
  this.settings = defaults;
40
40
  this.wrapper = null;
41
41
  this.targets = [];
42
+ this.contentHeight = 0;
42
43
  this.wrapperOffset = 0;
43
44
  this.scrollTop = 0;
44
45
  this.rafId = 0;
45
46
  this.pauseForOverlay = false;
46
47
  this.overlayObserver = null;
48
+ this.spacerObserver = null;
47
49
  this.onWindowResize = () => {
48
50
  cancelAnimationFrame(this.rafId);
49
51
  this.rafId = 0;
50
- setTimeout(() => { if (this.wrapper)
51
- this.startLoop(); }, 200);
52
+ setTimeout(() => { if (this.wrapper) {
53
+ this.syncBodyHeight();
54
+ this.startLoop();
55
+ } }, 200);
52
56
  };
53
57
  }
58
+ syncBodyHeight() {
59
+ if (!this.wrapper)
60
+ return;
61
+ const h = Math.max(this.wrapper.scrollHeight, this.wrapper.clientHeight);
62
+ if (this.contentHeight === h)
63
+ return;
64
+ this.contentHeight = h;
65
+ document.body.style.height = `${h}px`;
66
+ }
67
+ attachSpacerObserver() {
68
+ this.detachSpacerObserver();
69
+ if (!this.wrapper)
70
+ return;
71
+ this.syncBodyHeight();
72
+ this.spacerObserver = new ResizeObserver(() => this.syncBodyHeight());
73
+ this.spacerObserver.observe(this.wrapper);
74
+ }
75
+ detachSpacerObserver() {
76
+ var _a;
77
+ (_a = this.spacerObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
78
+ this.spacerObserver = null;
79
+ }
54
80
  syncOverlayPause() {
55
81
  if (!this.settings.respectOpenModalOverlay) {
56
82
  this.pauseForOverlay = false;
@@ -85,14 +111,9 @@ class Engine {
85
111
  this.rafId = 0;
86
112
  return;
87
113
  }
88
- // Keep body height in sync with wrapper content height
89
- const h = Math.max(this.wrapper.scrollHeight, this.wrapper.clientHeight);
90
- if (parseInt(document.body.style.height) !== h) {
91
- document.body.style.height = `${h}px`;
92
- }
93
114
  if (!this.pauseForOverlay) {
94
- this.scrollTop = getScrollTop();
95
- this.wrapperUpdate(h);
115
+ this.scrollTop = Math.round(getScrollTop());
116
+ this.wrapperUpdate();
96
117
  for (let i = 0; i < this.targets.length; i++)
97
118
  this.targetsUpdate(this.targets[i]);
98
119
  }
@@ -100,12 +121,20 @@ class Engine {
100
121
  };
101
122
  this.rafId = window.requestAnimationFrame(loop);
102
123
  }
103
- wrapperUpdate(contentHeight) {
124
+ wrapperUpdate() {
104
125
  if (!this.wrapper)
105
126
  return;
106
- this.wrapperOffset += (this.scrollTop - this.wrapperOffset) * this.settings.wrapperSpeed;
107
- const maxOffset = Math.max(0, contentHeight - window.innerHeight);
108
- this.wrapperOffset = Math.max(0, Math.min(this.wrapperOffset, maxOffset));
127
+ const maxOffset = Math.max(0, this.contentHeight - window.innerHeight);
128
+ const target = Math.max(0, Math.min(this.scrollTop, maxOffset));
129
+ const delta = target - this.wrapperOffset;
130
+ if (Math.abs(delta) < 0.1) {
131
+ if (this.wrapperOffset !== target) {
132
+ this.wrapperOffset = target;
133
+ this.wrapper.style.transform = `translate3d(0, ${-Math.round(this.wrapperOffset)}px, 0)`;
134
+ }
135
+ return;
136
+ }
137
+ this.wrapperOffset += delta * this.settings.wrapperSpeed;
109
138
  const y = Math.round(-this.wrapperOffset * 100) / 100;
110
139
  this.wrapper.style.transform = `translate3d(0, ${y}px, 0)`;
111
140
  }
@@ -137,8 +166,6 @@ class Engine {
137
166
  return false;
138
167
  this.wrapper = el;
139
168
  const nodeList = document.querySelectorAll(this.settings.targets);
140
- const scrollHeight = Math.max(this.wrapper.scrollHeight, this.wrapper.clientHeight);
141
- document.body.style.height = `${scrollHeight}px`;
142
169
  this.wrapper.style.width = '100%';
143
170
  this.wrapper.style.position = 'fixed';
144
171
  this.targets = [];
@@ -162,11 +189,13 @@ class Engine {
162
189
  });
163
190
  }
164
191
  window.addEventListener('resize', this.onWindowResize);
192
+ this.attachSpacerObserver();
165
193
  this.attachOverlayWatcher();
166
194
  this.startLoop();
167
195
  return true;
168
196
  }
169
197
  destroy() {
198
+ this.detachSpacerObserver();
170
199
  this.detachOverlayWatcher();
171
200
  cancelAnimationFrame(this.rafId);
172
201
  this.rafId = 0;
@@ -180,6 +209,7 @@ class Engine {
180
209
  this.targets[i].elm.removeAttribute('style');
181
210
  this.targets = [];
182
211
  this.wrapperOffset = 0;
212
+ this.contentHeight = 0;
183
213
  }
184
214
  }
185
215
  export function createCoonlinkLuxy() {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "coonlink-luxy",
3
- "version": "26.1.7",
3
+ "version": "26.1.9",
4
4
  "description": "Inertia scroll and parallax (luxy-style) with fixes for modern browsers, React/Next, and prefers-reduced-motion.",
5
5
  "homepage": "https://dev.coonlink.com",
6
6
  "keywords": [