use-snap-slider 1.0.0 → 1.0.2
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/dist/snap-slider.cjs +64 -46
- package/dist/snap-slider.cjs.map +1 -1
- package/dist/snap-slider.d.ts +1 -1
- package/dist/snap-slider.es.js +64 -46
- package/dist/snap-slider.es.js.map +1 -1
- package/dist/use-snap-slider.cjs +2 -1
- package/dist/use-snap-slider.cjs.map +1 -1
- package/dist/use-snap-slider.d.ts +2 -1
- package/dist/use-snap-slider.es.js +2 -1
- package/dist/use-snap-slider.es.js.map +1 -1
- package/package.json +1 -1
package/dist/snap-slider.cjs
CHANGED
|
@@ -106,8 +106,8 @@ function createSnapSlider({
|
|
|
106
106
|
nextEnabled: circular || countDelta2 - slidesPerPage > indexDelta2
|
|
107
107
|
};
|
|
108
108
|
};
|
|
109
|
-
function update(params) {
|
|
110
|
-
let dirty =
|
|
109
|
+
function update(params, forceUpdate = false) {
|
|
110
|
+
let dirty = forceUpdate;
|
|
111
111
|
let indexDeltaDirty = false;
|
|
112
112
|
const keys = Object.keys(
|
|
113
113
|
params
|
|
@@ -139,7 +139,7 @@ function createSnapSlider({
|
|
|
139
139
|
indexDelta: indexDelta2
|
|
140
140
|
};
|
|
141
141
|
}
|
|
142
|
-
function calculate() {
|
|
142
|
+
function calculate(forceUpdate = false) {
|
|
143
143
|
if (element) {
|
|
144
144
|
let contentWidth = 0;
|
|
145
145
|
let itemWidth = 0;
|
|
@@ -159,15 +159,20 @@ function createSnapSlider({
|
|
|
159
159
|
indexDelta: 0
|
|
160
160
|
} : {};
|
|
161
161
|
if (!isNaN(count2)) {
|
|
162
|
-
update(
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
162
|
+
update(
|
|
163
|
+
{
|
|
164
|
+
event: "inital",
|
|
165
|
+
count: count2,
|
|
166
|
+
countDelta: countDelta2,
|
|
167
|
+
...resetIndexMayby
|
|
168
|
+
},
|
|
169
|
+
forceUpdate
|
|
170
|
+
);
|
|
168
171
|
debug && console.log("update count", {
|
|
169
172
|
count: count2,
|
|
170
173
|
countDelta: countDelta2,
|
|
174
|
+
index: index2,
|
|
175
|
+
indexDelta,
|
|
171
176
|
itemPositions,
|
|
172
177
|
slidesPerPage,
|
|
173
178
|
clientWidth: element.clientWidth,
|
|
@@ -178,6 +183,31 @@ function createSnapSlider({
|
|
|
178
183
|
}
|
|
179
184
|
}
|
|
180
185
|
}
|
|
186
|
+
function onScrollEnd() {
|
|
187
|
+
if (element) {
|
|
188
|
+
const scrollLeft = element.scrollLeft;
|
|
189
|
+
const positionItem = itemPositions.reduce((prev, curr) => {
|
|
190
|
+
return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft) ? curr : prev;
|
|
191
|
+
});
|
|
192
|
+
const indexDelta2 = itemPositions.findIndex((x) => x === positionItem);
|
|
193
|
+
const pxLeftScrolling = Math.abs(scrollLeft - positionItem);
|
|
194
|
+
prevIndexDelta = indexDelta2;
|
|
195
|
+
debug && console.log("onScrollEnd", {
|
|
196
|
+
pxLeftScrolling,
|
|
197
|
+
indexDelta: indexDelta2,
|
|
198
|
+
scrollLeft,
|
|
199
|
+
positionItem,
|
|
200
|
+
itemPositions
|
|
201
|
+
});
|
|
202
|
+
update({
|
|
203
|
+
event: "scroll",
|
|
204
|
+
...fixIndex({
|
|
205
|
+
index: Math.floor(indexDelta2 / slidesPerPage),
|
|
206
|
+
indexDelta: indexDelta2
|
|
207
|
+
})
|
|
208
|
+
});
|
|
209
|
+
}
|
|
210
|
+
}
|
|
181
211
|
function onScroll() {
|
|
182
212
|
if (element) {
|
|
183
213
|
const scrollLeft = element.scrollLeft;
|
|
@@ -222,31 +252,7 @@ function createSnapSlider({
|
|
|
222
252
|
updateIndexDelta();
|
|
223
253
|
calculate();
|
|
224
254
|
if ("onscrollend" in window) {
|
|
225
|
-
element?.addEventListener("scrollend",
|
|
226
|
-
if (element) {
|
|
227
|
-
const scrollLeft = element.scrollLeft;
|
|
228
|
-
const positionItem = itemPositions.reduce((prev, curr) => {
|
|
229
|
-
return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft) ? curr : prev;
|
|
230
|
-
});
|
|
231
|
-
const indexDelta2 = itemPositions.findIndex((x) => x === positionItem);
|
|
232
|
-
const pxLeftScrolling = Math.abs(scrollLeft - positionItem);
|
|
233
|
-
prevIndexDelta = indexDelta2;
|
|
234
|
-
debug && console.log("onScrollEnd", {
|
|
235
|
-
pxLeftScrolling,
|
|
236
|
-
indexDelta: indexDelta2,
|
|
237
|
-
scrollLeft,
|
|
238
|
-
positionItem,
|
|
239
|
-
itemPositions
|
|
240
|
-
});
|
|
241
|
-
update({
|
|
242
|
-
event: "scroll",
|
|
243
|
-
...fixIndex({
|
|
244
|
-
index: Math.floor(indexDelta2 / slidesPerPage),
|
|
245
|
-
indexDelta: indexDelta2
|
|
246
|
-
})
|
|
247
|
-
});
|
|
248
|
-
}
|
|
249
|
-
});
|
|
255
|
+
element?.addEventListener("scrollend", onScrollEnd);
|
|
250
256
|
} else {
|
|
251
257
|
element?.addEventListener("scroll", onScrollFn);
|
|
252
258
|
}
|
|
@@ -254,27 +260,39 @@ function createSnapSlider({
|
|
|
254
260
|
}
|
|
255
261
|
_element && setElement(_element);
|
|
256
262
|
const jumpTo = function(index2, indexDelta2, event = "goto") {
|
|
263
|
+
let nextIndex = {
|
|
264
|
+
index: 0,
|
|
265
|
+
indexDelta: 0
|
|
266
|
+
};
|
|
257
267
|
if (indexDelta2 !== void 0) {
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
indexDelta: indexDelta2
|
|
263
|
-
})
|
|
264
|
-
});
|
|
268
|
+
nextIndex = {
|
|
269
|
+
index: Math.floor(indexDelta2 / slidesPerPage),
|
|
270
|
+
indexDelta: indexDelta2
|
|
271
|
+
};
|
|
265
272
|
}
|
|
266
273
|
if (index2 !== void 0) {
|
|
274
|
+
nextIndex = {
|
|
275
|
+
index: index2,
|
|
276
|
+
indexDelta: index2 * slidesPerPage
|
|
277
|
+
};
|
|
278
|
+
}
|
|
279
|
+
if (!isNaN(nextIndex.index) && !isNaN(nextIndex.indexDelta)) {
|
|
267
280
|
update({
|
|
268
281
|
event,
|
|
269
|
-
...fixIndex(
|
|
270
|
-
index: index2,
|
|
271
|
-
indexDelta: index2 * slidesPerPage
|
|
272
|
-
})
|
|
282
|
+
...fixIndex(nextIndex)
|
|
273
283
|
});
|
|
284
|
+
} else {
|
|
285
|
+
if (debug) {
|
|
286
|
+
console.log("catch", nextIndex);
|
|
287
|
+
}
|
|
274
288
|
}
|
|
275
289
|
};
|
|
276
290
|
const destroy = () => {
|
|
277
|
-
|
|
291
|
+
if ("onscrollend" in window) {
|
|
292
|
+
element?.removeEventListener("scrollend", onScrollEnd);
|
|
293
|
+
} else {
|
|
294
|
+
element?.removeEventListener("scroll", onScrollFn);
|
|
295
|
+
}
|
|
278
296
|
window.removeEventListener("resize", onResizeFn);
|
|
279
297
|
};
|
|
280
298
|
const goNext = () => {
|
package/dist/snap-slider.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snap-slider.cjs","sources":["../lib/throttle.ts","../lib/snap-slider.ts"],"sourcesContent":["export const throttle = (fn: Function, wait: number) => {\n let inThrottle: boolean\n let lastFn: ReturnType<typeof setTimeout>\n let lastTime: number\n return function (this: any) {\n const context = this\n const args = arguments\n if (!inThrottle) {\n fn.apply(context, args)\n lastTime = Date.now()\n inThrottle = true\n } else {\n clearTimeout(lastFn)\n lastFn = setTimeout(() => {\n if (Date.now() - lastTime >= wait) {\n fn.apply(context, args)\n lastTime = Date.now()\n }\n }, Math.max(wait - (Date.now() - lastTime), 0))\n }\n }\n}\n","import { throttle } from './throttle'\n\nexport type TSnapListnerEvent = 'scroll' | 'click' | 'inital' | 'goto'\n\nexport interface TSnapListnerStateIndex {\n index: number\n indexDelta: number\n}\n\nexport interface TSnapSliderState extends TSnapListnerStateIndex {\n count: number\n countDelta: number\n event: TSnapListnerEvent\n}\n\ninterface TSnapSliderStateUpdate {\n index?: number\n indexDelta?: number\n count?: number\n countDelta?: number\n event: TSnapListnerEvent\n}\n\nexport interface TSnapSliderStateFull extends TSnapSliderState {\n prevEnabled: boolean\n nextEnabled: boolean\n}\n\nexport type TSnapListner = (params: TSnapSliderStateFull) => void\n\nexport type TSnapSliderOptions = {\n circular?: boolean\n debug?: boolean\n scrollTimeThrottle?: number\n resizeTimeThrottle?: number\n scrollListenerThreshold?: number\n}\n\nexport type TSnapSliderParams = Omit<TSnapSliderStateUpdate, 'event'> &\n TSnapSliderOptions & {\n element: HTMLElement | null\n itemSelector?: string\n initalSubscriptionPublish?: boolean\n }\n\nexport type TSnapSliderJumpToFn = (\n index?: number,\n indexDelta?: number,\n event?: TSnapListnerEvent\n) => void\n\nexport interface TSnapSlider {\n destroy: () => void\n getState: () => TSnapSliderStateFull\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n subscribe: (fn: TSnapListner) => () => void\n setElement: (el: HTMLElement) => void\n calculate: () => void\n}\n\nexport function createSnapSlider({\n element: _element,\n count = 1,\n countDelta,\n index = 0,\n circular,\n indexDelta,\n initalSubscriptionPublish = true,\n itemSelector = ':scope > *',\n debug,\n scrollTimeThrottle = 500,\n resizeTimeThrottle = 500,\n scrollListenerThreshold = 2,\n}: TSnapSliderParams): TSnapSlider {\n let initalIndex: number | undefined = index\n let state: TSnapSliderState = {\n index,\n indexDelta: indexDelta || index,\n event: 'inital',\n count,\n countDelta: countDelta || count,\n }\n let prevIndexDelta: number = index\n let slidesPerPage: number = 1\n let itemPositions: number[] = []\n let muteScrollListner: boolean = false\n let left: number = 0\n let element: HTMLElement | null\n function updateIndexDelta() {\n if (element) {\n const prev = element.scrollLeft\n const { indexDelta, event } = state\n left = indexDelta * (element.offsetWidth / slidesPerPage)\n if (prevIndexDelta !== indexDelta) {\n const distance = Math.abs(prev - left)\n const limitInstantScroll = element.offsetWidth * 2\n prevIndexDelta = indexDelta\n muteScrollListner = true\n const behavior: ScrollBehavior =\n distance > limitInstantScroll || event === 'click'\n ? 'instant'\n : 'smooth'\n element.scroll({\n left,\n top: 0,\n behavior,\n })\n } else {\n if (initalIndex) {\n muteScrollListner = true\n element.scroll({\n left,\n top: 0,\n behavior: 'instant',\n })\n initalIndex = undefined\n }\n }\n }\n }\n\n let publishDirty = false\n let listeners: TSnapListner[] = []\n const subscribe = (callback: TSnapListner) => {\n listeners.push(callback)\n if (element && (publishDirty || initalSubscriptionPublish)) {\n callback(getState())\n }\n return () => {\n listeners = listeners.filter((x) => x !== callback)\n if (listeners.length < 1) {\n destroy()\n }\n }\n }\n function notify() {\n listeners.forEach((callback) => {\n callback(getState())\n })\n }\n const getState = (): TSnapSliderStateFull => {\n const { indexDelta, countDelta } = state\n return {\n ...state,\n prevEnabled: circular || indexDelta > 0,\n nextEnabled: circular || countDelta - slidesPerPage > indexDelta,\n }\n }\n function update(params: TSnapSliderStateUpdate) {\n let dirty = false\n let indexDeltaDirty = false\n type TSnapSliderStateUpdateKey = keyof typeof params\n const keys: TSnapSliderStateUpdateKey[] = Object.keys(\n params\n ) as Array<TSnapSliderStateUpdateKey>\n state['event'] = params['event']\n keys.forEach((key) => {\n if (key !== 'event' && state[key] !== params[key]) {\n state[key] = Number(params[key])\n dirty = true\n if (key === 'indexDelta') {\n indexDeltaDirty = true\n }\n }\n })\n if (dirty) {\n publishDirty = listeners.length === 0\n notify()\n if (indexDeltaDirty) {\n updateIndexDelta()\n }\n }\n }\n function fixIndex(nextIndex: TSnapListnerStateIndex): TSnapListnerStateIndex {\n const { index, indexDelta } = nextIndex\n const { countDelta, count } = state\n const last = countDelta - slidesPerPage\n return {\n index: indexDelta < last ? index : count - 1,\n indexDelta,\n }\n }\n function calculate() {\n if (element) {\n let contentWidth = 0\n let itemWidth = 0\n itemPositions = []\n const slides = element.querySelectorAll<HTMLDivElement>(itemSelector)\n slides.forEach((slide) => {\n itemPositions.push(contentWidth)\n contentWidth += slide.clientWidth\n itemWidth = slide.clientWidth\n })\n slidesPerPage = Math.round(element.offsetWidth / itemWidth)\n const countDelta = itemPositions.length\n const count = Math.ceil(countDelta / slidesPerPage)\n const { index } = state\n const resetIndexMayby =\n index + 1 > count\n ? {\n index: 0,\n indexDelta: 0,\n }\n : {}\n\n if (!isNaN(count)) {\n // if element not mounted / hidden not update\n update({\n event: 'inital',\n count,\n countDelta,\n ...resetIndexMayby,\n })\n debug &&\n console.log('update count', {\n count,\n countDelta,\n itemPositions,\n slidesPerPage,\n clientWidth: element.clientWidth,\n offsetWidth: element.offsetWidth,\n itemSelector,\n slides,\n })\n }\n }\n }\n\n function onScroll() {\n if (element) {\n const scrollLeft = element.scrollLeft\n if (muteScrollListner) {\n const leftToScroll = Math.abs(left - scrollLeft)\n if (leftToScroll < 2) {\n muteScrollListner = false\n }\n } else {\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScroll', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n if (pxLeftScrolling < scrollListenerThreshold) {\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n }\n }\n }\n const onScrollFn = throttle(onScroll, scrollTimeThrottle)\n const onResizeFn = throttle(calculate, resizeTimeThrottle)\n function setElement(_el: HTMLElement) {\n if (element) {\n destroy()\n }\n element = _el\n updateIndexDelta()\n calculate()\n\n if ('onscrollend' in window) {\n element?.addEventListener('scrollend', (event) => {\n if (element) {\n const scrollLeft = element.scrollLeft\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScrollEnd', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n })\n } else {\n element?.addEventListener('scroll', onScrollFn)\n }\n window.addEventListener('resize', onResizeFn)\n }\n _element && setElement(_element)\n const jumpTo: TSnapSliderJumpToFn = function (\n index,\n indexDelta,\n event = 'goto'\n ) {\n if (indexDelta !== undefined) {\n update({\n event,\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n if (index !== undefined) {\n update({\n event,\n ...fixIndex({\n index,\n indexDelta: index * slidesPerPage,\n }),\n })\n }\n }\n const destroy = () => {\n element?.removeEventListener('scroll', onScrollFn)\n window.removeEventListener('resize', onResizeFn)\n }\n const goNext = () => {\n const { countDelta, indexDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta + slidesPerPage <= last\n ? indexDelta + slidesPerPage\n : circular && indexDelta === last\n ? 0\n : last\n jumpTo(undefined, next)\n }\n const goPrev = () => {\n const { indexDelta, countDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta - slidesPerPage >= 0\n ? indexDelta - slidesPerPage\n : circular && indexDelta === 0\n ? last\n : 0\n jumpTo(undefined, next)\n }\n return {\n destroy,\n getState,\n subscribe,\n jumpTo,\n setElement,\n calculate,\n goNext,\n goPrev,\n }\n}\n"],"names":["indexDelta","countDelta","index","count"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"snap-slider.cjs","sources":["../lib/throttle.ts","../lib/snap-slider.ts"],"sourcesContent":["export const throttle = (fn: Function, wait: number) => {\n let inThrottle: boolean\n let lastFn: ReturnType<typeof setTimeout>\n let lastTime: number\n return function (this: any) {\n const context = this\n const args = arguments\n if (!inThrottle) {\n fn.apply(context, args)\n lastTime = Date.now()\n inThrottle = true\n } else {\n clearTimeout(lastFn)\n lastFn = setTimeout(() => {\n if (Date.now() - lastTime >= wait) {\n fn.apply(context, args)\n lastTime = Date.now()\n }\n }, Math.max(wait - (Date.now() - lastTime), 0))\n }\n }\n}\n","import { throttle } from './throttle'\n\nexport type TSnapListnerEvent = 'scroll' | 'click' | 'inital' | 'goto'\n\nexport interface TSnapListnerStateIndex {\n index: number\n indexDelta: number\n}\n\nexport interface TSnapSliderState extends TSnapListnerStateIndex {\n count: number\n countDelta: number\n event: TSnapListnerEvent\n}\n\ninterface TSnapSliderStateUpdate {\n index?: number\n indexDelta?: number\n count?: number\n countDelta?: number\n event: TSnapListnerEvent\n}\n\nexport interface TSnapSliderStateFull extends TSnapSliderState {\n prevEnabled: boolean\n nextEnabled: boolean\n}\n\nexport type TSnapListner = (params: TSnapSliderStateFull) => void\n\nexport type TSnapSliderOptions = {\n circular?: boolean\n debug?: boolean\n scrollTimeThrottle?: number\n resizeTimeThrottle?: number\n scrollListenerThreshold?: number\n}\n\nexport type TSnapSliderParams = Omit<TSnapSliderStateUpdate, 'event'> &\n TSnapSliderOptions & {\n element: HTMLElement | null\n itemSelector?: string\n initalSubscriptionPublish?: boolean\n }\n\nexport type TSnapSliderJumpToFn = (\n index?: number,\n indexDelta?: number,\n event?: TSnapListnerEvent,\n) => void\n\nexport interface TSnapSlider {\n destroy: () => void\n getState: () => TSnapSliderStateFull\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n subscribe: (fn: TSnapListner) => () => void\n setElement: (el: HTMLElement) => void\n calculate: (forceUpdate?: boolean) => void\n}\n\nexport function createSnapSlider({\n element: _element,\n count = 1,\n countDelta,\n index = 0,\n circular,\n indexDelta,\n initalSubscriptionPublish = true,\n itemSelector = ':scope > *',\n debug,\n scrollTimeThrottle = 500,\n resizeTimeThrottle = 500,\n scrollListenerThreshold = 2,\n}: TSnapSliderParams): TSnapSlider {\n let initalIndex: number | undefined = index\n let state: TSnapSliderState = {\n index,\n indexDelta: indexDelta || index,\n event: 'inital',\n count,\n countDelta: countDelta || count,\n }\n let prevIndexDelta: number = index\n let slidesPerPage: number = 1\n let itemPositions: number[] = []\n let muteScrollListner: boolean = false\n let left: number = 0\n let element: HTMLElement | null\n function updateIndexDelta() {\n if (element) {\n const prev = element.scrollLeft\n const { indexDelta, event } = state\n left = indexDelta * (element.offsetWidth / slidesPerPage)\n if (prevIndexDelta !== indexDelta) {\n const distance = Math.abs(prev - left)\n const limitInstantScroll = element.offsetWidth * 2\n prevIndexDelta = indexDelta\n muteScrollListner = true\n const behavior: ScrollBehavior =\n distance > limitInstantScroll || event === 'click'\n ? 'instant'\n : 'smooth'\n element.scroll({\n left,\n top: 0,\n behavior,\n })\n } else {\n if (initalIndex) {\n muteScrollListner = true\n element.scroll({\n left,\n top: 0,\n behavior: 'instant',\n })\n initalIndex = undefined\n }\n }\n }\n }\n\n let publishDirty = false\n let listeners: TSnapListner[] = []\n const subscribe = (callback: TSnapListner) => {\n listeners.push(callback)\n if (element && (publishDirty || initalSubscriptionPublish)) {\n callback(getState())\n }\n return () => {\n listeners = listeners.filter((x) => x !== callback)\n if (listeners.length < 1) {\n destroy()\n }\n }\n }\n function notify() {\n listeners.forEach((callback) => {\n callback(getState())\n })\n }\n const getState = (): TSnapSliderStateFull => {\n const { indexDelta, countDelta } = state\n return {\n ...state,\n prevEnabled: circular || indexDelta > 0,\n nextEnabled: circular || countDelta - slidesPerPage > indexDelta,\n }\n }\n function update(params: TSnapSliderStateUpdate, forceUpdate = false) {\n let dirty = forceUpdate\n let indexDeltaDirty = false\n type TSnapSliderStateUpdateKey = keyof typeof params\n const keys: TSnapSliderStateUpdateKey[] = Object.keys(\n params,\n ) as Array<TSnapSliderStateUpdateKey>\n state['event'] = params['event']\n keys.forEach((key) => {\n if (key !== 'event' && state[key] !== params[key]) {\n state[key] = Number(params[key])\n dirty = true\n if (key === 'indexDelta') {\n indexDeltaDirty = true\n }\n }\n })\n if (dirty) {\n publishDirty = listeners.length === 0\n notify()\n if (indexDeltaDirty) {\n updateIndexDelta()\n }\n }\n }\n function fixIndex(nextIndex: TSnapListnerStateIndex): TSnapListnerStateIndex {\n const { index, indexDelta } = nextIndex\n const { countDelta, count } = state\n const last = countDelta - slidesPerPage\n return {\n index: indexDelta < last ? index : count - 1,\n indexDelta,\n }\n }\n function calculate(forceUpdate = false) {\n if (element) {\n let contentWidth = 0\n let itemWidth = 0\n itemPositions = []\n const slides = element.querySelectorAll<HTMLDivElement>(itemSelector)\n slides.forEach((slide) => {\n itemPositions.push(contentWidth)\n contentWidth += slide.clientWidth\n itemWidth = slide.clientWidth\n })\n slidesPerPage = Math.round(element.offsetWidth / itemWidth)\n const countDelta = itemPositions.length\n const count = Math.ceil(countDelta / slidesPerPage)\n const { index } = state\n const resetIndexMayby =\n index + 1 > count\n ? {\n index: 0,\n indexDelta: 0,\n }\n : {}\n\n if (!isNaN(count)) {\n // if element not mounted / hidden not update\n update(\n {\n event: 'inital',\n count,\n countDelta,\n ...resetIndexMayby,\n },\n forceUpdate,\n )\n debug &&\n console.log('update count', {\n count,\n countDelta,\n index,\n indexDelta,\n itemPositions,\n slidesPerPage,\n clientWidth: element.clientWidth,\n offsetWidth: element.offsetWidth,\n itemSelector,\n slides,\n })\n }\n }\n }\n function onScrollEnd() {\n if (element) {\n const scrollLeft = element.scrollLeft\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScrollEnd', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n }\n function onScroll() {\n if (element) {\n const scrollLeft = element.scrollLeft\n if (muteScrollListner) {\n const leftToScroll = Math.abs(left - scrollLeft)\n if (leftToScroll < 2) {\n muteScrollListner = false\n }\n } else {\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScroll', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n if (pxLeftScrolling < scrollListenerThreshold) {\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n }\n }\n }\n const onScrollFn = throttle(onScroll, scrollTimeThrottle)\n const onResizeFn = throttle(calculate, resizeTimeThrottle)\n function setElement(_el: HTMLElement) {\n if (element) {\n destroy()\n }\n element = _el\n updateIndexDelta()\n calculate()\n if ('onscrollend' in window) {\n element?.addEventListener('scrollend', onScrollEnd)\n } else {\n element?.addEventListener('scroll', onScrollFn)\n }\n window.addEventListener('resize', onResizeFn)\n }\n _element && setElement(_element)\n const jumpTo: TSnapSliderJumpToFn = function (\n index,\n indexDelta,\n event = 'goto',\n ) {\n let nextIndex: TSnapListnerStateIndex = {\n index: 0,\n indexDelta: 0,\n }\n if (indexDelta !== undefined) {\n nextIndex = {\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }\n }\n if (index !== undefined) {\n nextIndex = {\n index,\n indexDelta: index * slidesPerPage,\n }\n }\n if (!isNaN(nextIndex.index) && !isNaN(nextIndex.indexDelta)) {\n update({\n event,\n ...fixIndex(nextIndex),\n })\n } else {\n if (debug) {\n console.log('catch', nextIndex)\n }\n }\n }\n const destroy = () => {\n if ('onscrollend' in window) {\n element?.removeEventListener('scrollend', onScrollEnd)\n } else {\n element?.removeEventListener('scroll', onScrollFn)\n }\n window.removeEventListener('resize', onResizeFn)\n }\n const goNext = () => {\n const { countDelta, indexDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta + slidesPerPage <= last\n ? indexDelta + slidesPerPage\n : circular && indexDelta === last\n ? 0\n : last\n jumpTo(undefined, next)\n }\n const goPrev = () => {\n const { indexDelta, countDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta - slidesPerPage >= 0\n ? indexDelta - slidesPerPage\n : circular && indexDelta === 0\n ? last\n : 0\n jumpTo(undefined, next)\n }\n return {\n destroy,\n getState,\n subscribe,\n jumpTo,\n setElement,\n calculate,\n goNext,\n goPrev,\n }\n}\n"],"names":["indexDelta","countDelta","index","count"],"mappings":"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"}
|
package/dist/snap-slider.d.ts
CHANGED
|
@@ -41,7 +41,7 @@ export interface TSnapSlider {
|
|
|
41
41
|
goPrev: () => void;
|
|
42
42
|
subscribe: (fn: TSnapListner) => () => void;
|
|
43
43
|
setElement: (el: HTMLElement) => void;
|
|
44
|
-
calculate: () => void;
|
|
44
|
+
calculate: (forceUpdate?: boolean) => void;
|
|
45
45
|
}
|
|
46
46
|
export declare function createSnapSlider({ element: _element, count, countDelta, index, circular, indexDelta, initalSubscriptionPublish, itemSelector, debug, scrollTimeThrottle, resizeTimeThrottle, scrollListenerThreshold, }: TSnapSliderParams): TSnapSlider;
|
|
47
47
|
export {};
|
package/dist/snap-slider.es.js
CHANGED
|
@@ -104,8 +104,8 @@ function createSnapSlider({
|
|
|
104
104
|
nextEnabled: circular || countDelta2 - slidesPerPage > indexDelta2
|
|
105
105
|
};
|
|
106
106
|
};
|
|
107
|
-
function update(params) {
|
|
108
|
-
let dirty =
|
|
107
|
+
function update(params, forceUpdate = false) {
|
|
108
|
+
let dirty = forceUpdate;
|
|
109
109
|
let indexDeltaDirty = false;
|
|
110
110
|
const keys = Object.keys(
|
|
111
111
|
params
|
|
@@ -137,7 +137,7 @@ function createSnapSlider({
|
|
|
137
137
|
indexDelta: indexDelta2
|
|
138
138
|
};
|
|
139
139
|
}
|
|
140
|
-
function calculate() {
|
|
140
|
+
function calculate(forceUpdate = false) {
|
|
141
141
|
if (element) {
|
|
142
142
|
let contentWidth = 0;
|
|
143
143
|
let itemWidth = 0;
|
|
@@ -157,15 +157,20 @@ function createSnapSlider({
|
|
|
157
157
|
indexDelta: 0
|
|
158
158
|
} : {};
|
|
159
159
|
if (!isNaN(count2)) {
|
|
160
|
-
update(
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
160
|
+
update(
|
|
161
|
+
{
|
|
162
|
+
event: "inital",
|
|
163
|
+
count: count2,
|
|
164
|
+
countDelta: countDelta2,
|
|
165
|
+
...resetIndexMayby
|
|
166
|
+
},
|
|
167
|
+
forceUpdate
|
|
168
|
+
);
|
|
166
169
|
debug && console.log("update count", {
|
|
167
170
|
count: count2,
|
|
168
171
|
countDelta: countDelta2,
|
|
172
|
+
index: index2,
|
|
173
|
+
indexDelta,
|
|
169
174
|
itemPositions,
|
|
170
175
|
slidesPerPage,
|
|
171
176
|
clientWidth: element.clientWidth,
|
|
@@ -176,6 +181,31 @@ function createSnapSlider({
|
|
|
176
181
|
}
|
|
177
182
|
}
|
|
178
183
|
}
|
|
184
|
+
function onScrollEnd() {
|
|
185
|
+
if (element) {
|
|
186
|
+
const scrollLeft = element.scrollLeft;
|
|
187
|
+
const positionItem = itemPositions.reduce((prev, curr) => {
|
|
188
|
+
return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft) ? curr : prev;
|
|
189
|
+
});
|
|
190
|
+
const indexDelta2 = itemPositions.findIndex((x) => x === positionItem);
|
|
191
|
+
const pxLeftScrolling = Math.abs(scrollLeft - positionItem);
|
|
192
|
+
prevIndexDelta = indexDelta2;
|
|
193
|
+
debug && console.log("onScrollEnd", {
|
|
194
|
+
pxLeftScrolling,
|
|
195
|
+
indexDelta: indexDelta2,
|
|
196
|
+
scrollLeft,
|
|
197
|
+
positionItem,
|
|
198
|
+
itemPositions
|
|
199
|
+
});
|
|
200
|
+
update({
|
|
201
|
+
event: "scroll",
|
|
202
|
+
...fixIndex({
|
|
203
|
+
index: Math.floor(indexDelta2 / slidesPerPage),
|
|
204
|
+
indexDelta: indexDelta2
|
|
205
|
+
})
|
|
206
|
+
});
|
|
207
|
+
}
|
|
208
|
+
}
|
|
179
209
|
function onScroll() {
|
|
180
210
|
if (element) {
|
|
181
211
|
const scrollLeft = element.scrollLeft;
|
|
@@ -220,31 +250,7 @@ function createSnapSlider({
|
|
|
220
250
|
updateIndexDelta();
|
|
221
251
|
calculate();
|
|
222
252
|
if ("onscrollend" in window) {
|
|
223
|
-
element?.addEventListener("scrollend",
|
|
224
|
-
if (element) {
|
|
225
|
-
const scrollLeft = element.scrollLeft;
|
|
226
|
-
const positionItem = itemPositions.reduce((prev, curr) => {
|
|
227
|
-
return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft) ? curr : prev;
|
|
228
|
-
});
|
|
229
|
-
const indexDelta2 = itemPositions.findIndex((x) => x === positionItem);
|
|
230
|
-
const pxLeftScrolling = Math.abs(scrollLeft - positionItem);
|
|
231
|
-
prevIndexDelta = indexDelta2;
|
|
232
|
-
debug && console.log("onScrollEnd", {
|
|
233
|
-
pxLeftScrolling,
|
|
234
|
-
indexDelta: indexDelta2,
|
|
235
|
-
scrollLeft,
|
|
236
|
-
positionItem,
|
|
237
|
-
itemPositions
|
|
238
|
-
});
|
|
239
|
-
update({
|
|
240
|
-
event: "scroll",
|
|
241
|
-
...fixIndex({
|
|
242
|
-
index: Math.floor(indexDelta2 / slidesPerPage),
|
|
243
|
-
indexDelta: indexDelta2
|
|
244
|
-
})
|
|
245
|
-
});
|
|
246
|
-
}
|
|
247
|
-
});
|
|
253
|
+
element?.addEventListener("scrollend", onScrollEnd);
|
|
248
254
|
} else {
|
|
249
255
|
element?.addEventListener("scroll", onScrollFn);
|
|
250
256
|
}
|
|
@@ -252,27 +258,39 @@ function createSnapSlider({
|
|
|
252
258
|
}
|
|
253
259
|
_element && setElement(_element);
|
|
254
260
|
const jumpTo = function(index2, indexDelta2, event = "goto") {
|
|
261
|
+
let nextIndex = {
|
|
262
|
+
index: 0,
|
|
263
|
+
indexDelta: 0
|
|
264
|
+
};
|
|
255
265
|
if (indexDelta2 !== void 0) {
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
indexDelta: indexDelta2
|
|
261
|
-
})
|
|
262
|
-
});
|
|
266
|
+
nextIndex = {
|
|
267
|
+
index: Math.floor(indexDelta2 / slidesPerPage),
|
|
268
|
+
indexDelta: indexDelta2
|
|
269
|
+
};
|
|
263
270
|
}
|
|
264
271
|
if (index2 !== void 0) {
|
|
272
|
+
nextIndex = {
|
|
273
|
+
index: index2,
|
|
274
|
+
indexDelta: index2 * slidesPerPage
|
|
275
|
+
};
|
|
276
|
+
}
|
|
277
|
+
if (!isNaN(nextIndex.index) && !isNaN(nextIndex.indexDelta)) {
|
|
265
278
|
update({
|
|
266
279
|
event,
|
|
267
|
-
...fixIndex(
|
|
268
|
-
index: index2,
|
|
269
|
-
indexDelta: index2 * slidesPerPage
|
|
270
|
-
})
|
|
280
|
+
...fixIndex(nextIndex)
|
|
271
281
|
});
|
|
282
|
+
} else {
|
|
283
|
+
if (debug) {
|
|
284
|
+
console.log("catch", nextIndex);
|
|
285
|
+
}
|
|
272
286
|
}
|
|
273
287
|
};
|
|
274
288
|
const destroy = () => {
|
|
275
|
-
|
|
289
|
+
if ("onscrollend" in window) {
|
|
290
|
+
element?.removeEventListener("scrollend", onScrollEnd);
|
|
291
|
+
} else {
|
|
292
|
+
element?.removeEventListener("scroll", onScrollFn);
|
|
293
|
+
}
|
|
276
294
|
window.removeEventListener("resize", onResizeFn);
|
|
277
295
|
};
|
|
278
296
|
const goNext = () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snap-slider.es.js","sources":["../lib/throttle.ts","../lib/snap-slider.ts"],"sourcesContent":["export const throttle = (fn: Function, wait: number) => {\n let inThrottle: boolean\n let lastFn: ReturnType<typeof setTimeout>\n let lastTime: number\n return function (this: any) {\n const context = this\n const args = arguments\n if (!inThrottle) {\n fn.apply(context, args)\n lastTime = Date.now()\n inThrottle = true\n } else {\n clearTimeout(lastFn)\n lastFn = setTimeout(() => {\n if (Date.now() - lastTime >= wait) {\n fn.apply(context, args)\n lastTime = Date.now()\n }\n }, Math.max(wait - (Date.now() - lastTime), 0))\n }\n }\n}\n","import { throttle } from './throttle'\n\nexport type TSnapListnerEvent = 'scroll' | 'click' | 'inital' | 'goto'\n\nexport interface TSnapListnerStateIndex {\n index: number\n indexDelta: number\n}\n\nexport interface TSnapSliderState extends TSnapListnerStateIndex {\n count: number\n countDelta: number\n event: TSnapListnerEvent\n}\n\ninterface TSnapSliderStateUpdate {\n index?: number\n indexDelta?: number\n count?: number\n countDelta?: number\n event: TSnapListnerEvent\n}\n\nexport interface TSnapSliderStateFull extends TSnapSliderState {\n prevEnabled: boolean\n nextEnabled: boolean\n}\n\nexport type TSnapListner = (params: TSnapSliderStateFull) => void\n\nexport type TSnapSliderOptions = {\n circular?: boolean\n debug?: boolean\n scrollTimeThrottle?: number\n resizeTimeThrottle?: number\n scrollListenerThreshold?: number\n}\n\nexport type TSnapSliderParams = Omit<TSnapSliderStateUpdate, 'event'> &\n TSnapSliderOptions & {\n element: HTMLElement | null\n itemSelector?: string\n initalSubscriptionPublish?: boolean\n }\n\nexport type TSnapSliderJumpToFn = (\n index?: number,\n indexDelta?: number,\n event?: TSnapListnerEvent\n) => void\n\nexport interface TSnapSlider {\n destroy: () => void\n getState: () => TSnapSliderStateFull\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n subscribe: (fn: TSnapListner) => () => void\n setElement: (el: HTMLElement) => void\n calculate: () => void\n}\n\nexport function createSnapSlider({\n element: _element,\n count = 1,\n countDelta,\n index = 0,\n circular,\n indexDelta,\n initalSubscriptionPublish = true,\n itemSelector = ':scope > *',\n debug,\n scrollTimeThrottle = 500,\n resizeTimeThrottle = 500,\n scrollListenerThreshold = 2,\n}: TSnapSliderParams): TSnapSlider {\n let initalIndex: number | undefined = index\n let state: TSnapSliderState = {\n index,\n indexDelta: indexDelta || index,\n event: 'inital',\n count,\n countDelta: countDelta || count,\n }\n let prevIndexDelta: number = index\n let slidesPerPage: number = 1\n let itemPositions: number[] = []\n let muteScrollListner: boolean = false\n let left: number = 0\n let element: HTMLElement | null\n function updateIndexDelta() {\n if (element) {\n const prev = element.scrollLeft\n const { indexDelta, event } = state\n left = indexDelta * (element.offsetWidth / slidesPerPage)\n if (prevIndexDelta !== indexDelta) {\n const distance = Math.abs(prev - left)\n const limitInstantScroll = element.offsetWidth * 2\n prevIndexDelta = indexDelta\n muteScrollListner = true\n const behavior: ScrollBehavior =\n distance > limitInstantScroll || event === 'click'\n ? 'instant'\n : 'smooth'\n element.scroll({\n left,\n top: 0,\n behavior,\n })\n } else {\n if (initalIndex) {\n muteScrollListner = true\n element.scroll({\n left,\n top: 0,\n behavior: 'instant',\n })\n initalIndex = undefined\n }\n }\n }\n }\n\n let publishDirty = false\n let listeners: TSnapListner[] = []\n const subscribe = (callback: TSnapListner) => {\n listeners.push(callback)\n if (element && (publishDirty || initalSubscriptionPublish)) {\n callback(getState())\n }\n return () => {\n listeners = listeners.filter((x) => x !== callback)\n if (listeners.length < 1) {\n destroy()\n }\n }\n }\n function notify() {\n listeners.forEach((callback) => {\n callback(getState())\n })\n }\n const getState = (): TSnapSliderStateFull => {\n const { indexDelta, countDelta } = state\n return {\n ...state,\n prevEnabled: circular || indexDelta > 0,\n nextEnabled: circular || countDelta - slidesPerPage > indexDelta,\n }\n }\n function update(params: TSnapSliderStateUpdate) {\n let dirty = false\n let indexDeltaDirty = false\n type TSnapSliderStateUpdateKey = keyof typeof params\n const keys: TSnapSliderStateUpdateKey[] = Object.keys(\n params\n ) as Array<TSnapSliderStateUpdateKey>\n state['event'] = params['event']\n keys.forEach((key) => {\n if (key !== 'event' && state[key] !== params[key]) {\n state[key] = Number(params[key])\n dirty = true\n if (key === 'indexDelta') {\n indexDeltaDirty = true\n }\n }\n })\n if (dirty) {\n publishDirty = listeners.length === 0\n notify()\n if (indexDeltaDirty) {\n updateIndexDelta()\n }\n }\n }\n function fixIndex(nextIndex: TSnapListnerStateIndex): TSnapListnerStateIndex {\n const { index, indexDelta } = nextIndex\n const { countDelta, count } = state\n const last = countDelta - slidesPerPage\n return {\n index: indexDelta < last ? index : count - 1,\n indexDelta,\n }\n }\n function calculate() {\n if (element) {\n let contentWidth = 0\n let itemWidth = 0\n itemPositions = []\n const slides = element.querySelectorAll<HTMLDivElement>(itemSelector)\n slides.forEach((slide) => {\n itemPositions.push(contentWidth)\n contentWidth += slide.clientWidth\n itemWidth = slide.clientWidth\n })\n slidesPerPage = Math.round(element.offsetWidth / itemWidth)\n const countDelta = itemPositions.length\n const count = Math.ceil(countDelta / slidesPerPage)\n const { index } = state\n const resetIndexMayby =\n index + 1 > count\n ? {\n index: 0,\n indexDelta: 0,\n }\n : {}\n\n if (!isNaN(count)) {\n // if element not mounted / hidden not update\n update({\n event: 'inital',\n count,\n countDelta,\n ...resetIndexMayby,\n })\n debug &&\n console.log('update count', {\n count,\n countDelta,\n itemPositions,\n slidesPerPage,\n clientWidth: element.clientWidth,\n offsetWidth: element.offsetWidth,\n itemSelector,\n slides,\n })\n }\n }\n }\n\n function onScroll() {\n if (element) {\n const scrollLeft = element.scrollLeft\n if (muteScrollListner) {\n const leftToScroll = Math.abs(left - scrollLeft)\n if (leftToScroll < 2) {\n muteScrollListner = false\n }\n } else {\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScroll', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n if (pxLeftScrolling < scrollListenerThreshold) {\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n }\n }\n }\n const onScrollFn = throttle(onScroll, scrollTimeThrottle)\n const onResizeFn = throttle(calculate, resizeTimeThrottle)\n function setElement(_el: HTMLElement) {\n if (element) {\n destroy()\n }\n element = _el\n updateIndexDelta()\n calculate()\n\n if ('onscrollend' in window) {\n element?.addEventListener('scrollend', (event) => {\n if (element) {\n const scrollLeft = element.scrollLeft\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScrollEnd', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n })\n } else {\n element?.addEventListener('scroll', onScrollFn)\n }\n window.addEventListener('resize', onResizeFn)\n }\n _element && setElement(_element)\n const jumpTo: TSnapSliderJumpToFn = function (\n index,\n indexDelta,\n event = 'goto'\n ) {\n if (indexDelta !== undefined) {\n update({\n event,\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n if (index !== undefined) {\n update({\n event,\n ...fixIndex({\n index,\n indexDelta: index * slidesPerPage,\n }),\n })\n }\n }\n const destroy = () => {\n element?.removeEventListener('scroll', onScrollFn)\n window.removeEventListener('resize', onResizeFn)\n }\n const goNext = () => {\n const { countDelta, indexDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta + slidesPerPage <= last\n ? indexDelta + slidesPerPage\n : circular && indexDelta === last\n ? 0\n : last\n jumpTo(undefined, next)\n }\n const goPrev = () => {\n const { indexDelta, countDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta - slidesPerPage >= 0\n ? indexDelta - slidesPerPage\n : circular && indexDelta === 0\n ? last\n : 0\n jumpTo(undefined, next)\n }\n return {\n destroy,\n getState,\n subscribe,\n jumpTo,\n setElement,\n calculate,\n goNext,\n goPrev,\n }\n}\n"],"names":["indexDelta","countDelta","index","count"],"mappings":"AAAO,MAAM,WAAW,CAAC,IAAc,SAAiB;AACtD,MAAI;AACJ,MAAI;AACJ,MAAI;AACJ,SAAO,WAAqB;AAC1B,UAAM,UAAU;AAChB,UAAM,OAAO;AACb,QAAI,CAAC,YAAY;AACf,SAAG,MAAM,SAAS,IAAI;AACtB,iBAAW,KAAK,IAAA;AAChB,mBAAa;AAAA,IACf,OAAO;AACL,mBAAa,MAAM;AACnB,eAAS,WAAW,MAAM;AACxB,YAAI,KAAK,QAAQ,YAAY,MAAM;AACjC,aAAG,MAAM,SAAS,IAAI;AACtB,qBAAW,KAAK,IAAA;AAAA,QAClB;AAAA,MACF,GAAG,KAAK,IAAI,QAAQ,KAAK,QAAQ,WAAW,CAAC,CAAC;AAAA,IAChD;AAAA,EACF;AACF;ACyCO,SAAS,iBAAiB;AAAA,EAC/B,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf;AAAA,EACA,qBAAqB;AAAA,EACrB,qBAAqB;AAAA,EACrB,0BAA0B;AAC5B,GAAmC;AACjC,MAAI,cAAkC;AACtC,MAAI,QAA0B;AAAA,IAC5B;AAAA,IACA,YAAY,cAAc;AAAA,IAC1B,OAAO;AAAA,IACP;AAAA,IACA,YAAY,cAAc;AAAA,EAAA;AAE5B,MAAI,iBAAyB;AAC7B,MAAI,gBAAwB;AAC5B,MAAI,gBAA0B,CAAA;AAC9B,MAAI,oBAA6B;AACjC,MAAI,OAAe;AACnB,MAAI;AACJ,WAAS,mBAAmB;AAC1B,QAAI,SAAS;AACX,YAAM,OAAO,QAAQ;AACrB,YAAM,EAAE,YAAAA,aAAY,MAAA,IAAU;AAC9B,aAAOA,eAAc,QAAQ,cAAc;AAC3C,UAAI,mBAAmBA,aAAY;AACjC,cAAM,WAAW,KAAK,IAAI,OAAO,IAAI;AACrC,cAAM,qBAAqB,QAAQ,cAAc;AACjD,yBAAiBA;AACjB,4BAAoB;AACpB,cAAM,WACJ,WAAW,sBAAsB,UAAU,UACvC,YACA;AACN,gBAAQ,OAAO;AAAA,UACb;AAAA,UACA,KAAK;AAAA,UACL;AAAA,QAAA,CACD;AAAA,MACH,OAAO;AACL,YAAI,aAAa;AACf,8BAAoB;AACpB,kBAAQ,OAAO;AAAA,YACb;AAAA,YACA,KAAK;AAAA,YACL,UAAU;AAAA,UAAA,CACX;AACD,wBAAc;AAAA,QAChB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,MAAI,eAAe;AACnB,MAAI,YAA4B,CAAA;AAChC,QAAM,YAAY,CAAC,aAA2B;AAC5C,cAAU,KAAK,QAAQ;AACvB,QAAI,YAAY,gBAAgB,4BAA4B;AAC1D,eAAS,UAAU;AAAA,IACrB;AACA,WAAO,MAAM;AACX,kBAAY,UAAU,OAAO,CAAC,MAAM,MAAM,QAAQ;AAClD,UAAI,UAAU,SAAS,GAAG;AACxB,gBAAA;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,WAAS,SAAS;AAChB,cAAU,QAAQ,CAAC,aAAa;AAC9B,eAAS,UAAU;AAAA,IACrB,CAAC;AAAA,EACH;AACA,QAAM,WAAW,MAA4B;AAC3C,UAAM,EAAE,YAAAA,aAAY,YAAAC,gBAAe;AACnC,WAAO;AAAA,MACL,GAAG;AAAA,MACH,aAAa,YAAYD,cAAa;AAAA,MACtC,aAAa,YAAYC,cAAa,gBAAgBD;AAAAA,IAAA;AAAA,EAE1D;AACA,WAAS,OAAO,QAAgC;AAC9C,QAAI,QAAQ;AACZ,QAAI,kBAAkB;AAEtB,UAAM,OAAoC,OAAO;AAAA,MAC/C;AAAA,IAAA;AAEF,UAAM,OAAO,IAAI,OAAO,OAAO;AAC/B,SAAK,QAAQ,CAAC,QAAQ;AACpB,UAAI,QAAQ,WAAW,MAAM,GAAG,MAAM,OAAO,GAAG,GAAG;AACjD,cAAM,GAAG,IAAI,OAAO,OAAO,GAAG,CAAC;AAC/B,gBAAQ;AACR,YAAI,QAAQ,cAAc;AACxB,4BAAkB;AAAA,QACpB;AAAA,MACF;AAAA,IACF,CAAC;AACD,QAAI,OAAO;AACT,qBAAe,UAAU,WAAW;AACpC,aAAA;AACA,UAAI,iBAAiB;AACnB,yBAAA;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,WAAS,SAAS,WAA2D;AAC3E,UAAM,EAAE,OAAAE,QAAO,YAAAF,gBAAe;AAC9B,UAAM,EAAE,YAAAC,aAAY,OAAAE,WAAU;AAC9B,UAAM,OAAOF,cAAa;AAC1B,WAAO;AAAA,MACL,OAAOD,cAAa,OAAOE,SAAQC,SAAQ;AAAA,MAC3C,YAAAH;AAAAA,IAAA;AAAA,EAEJ;AACA,WAAS,YAAY;AACnB,QAAI,SAAS;AACX,UAAI,eAAe;AACnB,UAAI,YAAY;AAChB,sBAAgB,CAAA;AAChB,YAAM,SAAS,QAAQ,iBAAiC,YAAY;AACpE,aAAO,QAAQ,CAAC,UAAU;AACxB,sBAAc,KAAK,YAAY;AAC/B,wBAAgB,MAAM;AACtB,oBAAY,MAAM;AAAA,MACpB,CAAC;AACD,sBAAgB,KAAK,MAAM,QAAQ,cAAc,SAAS;AAC1D,YAAMC,cAAa,cAAc;AACjC,YAAME,SAAQ,KAAK,KAAKF,cAAa,aAAa;AAClD,YAAM,EAAE,OAAAC,OAAAA,IAAU;AAClB,YAAM,kBACJA,SAAQ,IAAIC,SACR;AAAA,QACE,OAAO;AAAA,QACP,YAAY;AAAA,MAAA,IAEd,CAAA;AAEN,UAAI,CAAC,MAAMA,MAAK,GAAG;AAEjB,eAAO;AAAA,UACL,OAAO;AAAA,UACP,OAAAA;AAAAA,UACA,YAAAF;AAAAA,UACA,GAAG;AAAA,QAAA,CACJ;AACD,iBACE,QAAQ,IAAI,gBAAgB;AAAA,UAC1B,OAAAE;AAAAA,UACA,YAAAF;AAAAA,UACA;AAAA,UACA;AAAA,UACA,aAAa,QAAQ;AAAA,UACrB,aAAa,QAAQ;AAAA,UACrB;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MACL;AAAA,IACF;AAAA,EACF;AAEA,WAAS,WAAW;AAClB,QAAI,SAAS;AACX,YAAM,aAAa,QAAQ;AAC3B,UAAI,mBAAmB;AACrB,cAAM,eAAe,KAAK,IAAI,OAAO,UAAU;AAC/C,YAAI,eAAe,GAAG;AACpB,8BAAoB;AAAA,QACtB;AAAA,MACF,OAAO;AACL,cAAM,eAAe,cAAc,OAAO,CAAC,MAAM,SAAS;AACxD,iBAAO,KAAK,IAAI,OAAO,UAAU,IAAI,KAAK,IAAI,OAAO,UAAU,IAC3D,OACA;AAAA,QACN,CAAC;AACD,cAAMD,cAAa,cAAc,UAAU,CAAC,MAAM,MAAM,YAAY;AACpE,cAAM,kBAAkB,KAAK,IAAI,aAAa,YAAY;AAC1D,yBAAiBA;AACjB,iBACE,QAAQ,IAAI,YAAY;AAAA,UACtB;AAAA,UACA,YAAAA;AAAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA,CACD;AACH,YAAI,kBAAkB,yBAAyB;AAC7C,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,GAAG,SAAS;AAAA,cACV,OAAO,KAAK,MAAMA,cAAa,aAAa;AAAA,cAC5C,YAAAA;AAAAA,YAAA,CACD;AAAA,UAAA,CACF;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,QAAM,aAAa,SAAS,UAAU,kBAAkB;AACxD,QAAM,aAAa,SAAS,WAAW,kBAAkB;AACzD,WAAS,WAAW,KAAkB;AACpC,QAAI,SAAS;AACX,cAAA;AAAA,IACF;AACA,cAAU;AACV,qBAAA;AACA,cAAA;AAEA,QAAI,iBAAiB,QAAQ;AAC3B,eAAS,iBAAiB,aAAa,CAAC,UAAU;AAChD,YAAI,SAAS;AACX,gBAAM,aAAa,QAAQ;AAC3B,gBAAM,eAAe,cAAc,OAAO,CAAC,MAAM,SAAS;AACxD,mBAAO,KAAK,IAAI,OAAO,UAAU,IAAI,KAAK,IAAI,OAAO,UAAU,IAC3D,OACA;AAAA,UACN,CAAC;AACD,gBAAMA,cAAa,cAAc,UAAU,CAAC,MAAM,MAAM,YAAY;AACpE,gBAAM,kBAAkB,KAAK,IAAI,aAAa,YAAY;AAC1D,2BAAiBA;AACjB,mBACE,QAAQ,IAAI,eAAe;AAAA,YACzB;AAAA,YACA,YAAAA;AAAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA,CACD;AACH,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,GAAG,SAAS;AAAA,cACV,OAAO,KAAK,MAAMA,cAAa,aAAa;AAAA,cAC5C,YAAAA;AAAAA,YAAA,CACD;AAAA,UAAA,CACF;AAAA,QACH;AAAA,MACF,CAAC;AAAA,IACH,OAAO;AACL,eAAS,iBAAiB,UAAU,UAAU;AAAA,IAChD;AACA,WAAO,iBAAiB,UAAU,UAAU;AAAA,EAC9C;AACA,cAAY,WAAW,QAAQ;AAC/B,QAAM,SAA8B,SAClCE,QACAF,aACA,QAAQ,QACR;AACA,QAAIA,gBAAe,QAAW;AAC5B,aAAO;AAAA,QACL;AAAA,QACA,GAAG,SAAS;AAAA,UACV,OAAO,KAAK,MAAMA,cAAa,aAAa;AAAA,UAC5C,YAAAA;AAAAA,QAAA,CACD;AAAA,MAAA,CACF;AAAA,IACH;AACA,QAAIE,WAAU,QAAW;AACvB,aAAO;AAAA,QACL;AAAA,QACA,GAAG,SAAS;AAAA,UACV,OAAAA;AAAAA,UACA,YAAYA,SAAQ;AAAA,QAAA,CACrB;AAAA,MAAA,CACF;AAAA,IACH;AAAA,EACF;AACA,QAAM,UAAU,MAAM;AACpB,aAAS,oBAAoB,UAAU,UAAU;AACjD,WAAO,oBAAoB,UAAU,UAAU;AAAA,EACjD;AACA,QAAM,SAAS,MAAM;AACnB,UAAM,EAAE,YAAAD,aAAY,YAAAD,gBAAe;AACnC,UAAM,OAAOC,cAAa;AAC1B,UAAM,OACJD,cAAa,iBAAiB,OAC1BA,cAAa,gBACb,YAAYA,gBAAe,OAC3B,IACA;AACN,WAAO,QAAW,IAAI;AAAA,EACxB;AACA,QAAM,SAAS,MAAM;AACnB,UAAM,EAAE,YAAAA,aAAY,YAAAC,gBAAe;AACnC,UAAM,OAAOA,cAAa;AAC1B,UAAM,OACJD,cAAa,iBAAiB,IAC1BA,cAAa,gBACb,YAAYA,gBAAe,IAC3B,OACA;AACN,WAAO,QAAW,IAAI;AAAA,EACxB;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"snap-slider.es.js","sources":["../lib/throttle.ts","../lib/snap-slider.ts"],"sourcesContent":["export const throttle = (fn: Function, wait: number) => {\n let inThrottle: boolean\n let lastFn: ReturnType<typeof setTimeout>\n let lastTime: number\n return function (this: any) {\n const context = this\n const args = arguments\n if (!inThrottle) {\n fn.apply(context, args)\n lastTime = Date.now()\n inThrottle = true\n } else {\n clearTimeout(lastFn)\n lastFn = setTimeout(() => {\n if (Date.now() - lastTime >= wait) {\n fn.apply(context, args)\n lastTime = Date.now()\n }\n }, Math.max(wait - (Date.now() - lastTime), 0))\n }\n }\n}\n","import { throttle } from './throttle'\n\nexport type TSnapListnerEvent = 'scroll' | 'click' | 'inital' | 'goto'\n\nexport interface TSnapListnerStateIndex {\n index: number\n indexDelta: number\n}\n\nexport interface TSnapSliderState extends TSnapListnerStateIndex {\n count: number\n countDelta: number\n event: TSnapListnerEvent\n}\n\ninterface TSnapSliderStateUpdate {\n index?: number\n indexDelta?: number\n count?: number\n countDelta?: number\n event: TSnapListnerEvent\n}\n\nexport interface TSnapSliderStateFull extends TSnapSliderState {\n prevEnabled: boolean\n nextEnabled: boolean\n}\n\nexport type TSnapListner = (params: TSnapSliderStateFull) => void\n\nexport type TSnapSliderOptions = {\n circular?: boolean\n debug?: boolean\n scrollTimeThrottle?: number\n resizeTimeThrottle?: number\n scrollListenerThreshold?: number\n}\n\nexport type TSnapSliderParams = Omit<TSnapSliderStateUpdate, 'event'> &\n TSnapSliderOptions & {\n element: HTMLElement | null\n itemSelector?: string\n initalSubscriptionPublish?: boolean\n }\n\nexport type TSnapSliderJumpToFn = (\n index?: number,\n indexDelta?: number,\n event?: TSnapListnerEvent,\n) => void\n\nexport interface TSnapSlider {\n destroy: () => void\n getState: () => TSnapSliderStateFull\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n subscribe: (fn: TSnapListner) => () => void\n setElement: (el: HTMLElement) => void\n calculate: (forceUpdate?: boolean) => void\n}\n\nexport function createSnapSlider({\n element: _element,\n count = 1,\n countDelta,\n index = 0,\n circular,\n indexDelta,\n initalSubscriptionPublish = true,\n itemSelector = ':scope > *',\n debug,\n scrollTimeThrottle = 500,\n resizeTimeThrottle = 500,\n scrollListenerThreshold = 2,\n}: TSnapSliderParams): TSnapSlider {\n let initalIndex: number | undefined = index\n let state: TSnapSliderState = {\n index,\n indexDelta: indexDelta || index,\n event: 'inital',\n count,\n countDelta: countDelta || count,\n }\n let prevIndexDelta: number = index\n let slidesPerPage: number = 1\n let itemPositions: number[] = []\n let muteScrollListner: boolean = false\n let left: number = 0\n let element: HTMLElement | null\n function updateIndexDelta() {\n if (element) {\n const prev = element.scrollLeft\n const { indexDelta, event } = state\n left = indexDelta * (element.offsetWidth / slidesPerPage)\n if (prevIndexDelta !== indexDelta) {\n const distance = Math.abs(prev - left)\n const limitInstantScroll = element.offsetWidth * 2\n prevIndexDelta = indexDelta\n muteScrollListner = true\n const behavior: ScrollBehavior =\n distance > limitInstantScroll || event === 'click'\n ? 'instant'\n : 'smooth'\n element.scroll({\n left,\n top: 0,\n behavior,\n })\n } else {\n if (initalIndex) {\n muteScrollListner = true\n element.scroll({\n left,\n top: 0,\n behavior: 'instant',\n })\n initalIndex = undefined\n }\n }\n }\n }\n\n let publishDirty = false\n let listeners: TSnapListner[] = []\n const subscribe = (callback: TSnapListner) => {\n listeners.push(callback)\n if (element && (publishDirty || initalSubscriptionPublish)) {\n callback(getState())\n }\n return () => {\n listeners = listeners.filter((x) => x !== callback)\n if (listeners.length < 1) {\n destroy()\n }\n }\n }\n function notify() {\n listeners.forEach((callback) => {\n callback(getState())\n })\n }\n const getState = (): TSnapSliderStateFull => {\n const { indexDelta, countDelta } = state\n return {\n ...state,\n prevEnabled: circular || indexDelta > 0,\n nextEnabled: circular || countDelta - slidesPerPage > indexDelta,\n }\n }\n function update(params: TSnapSliderStateUpdate, forceUpdate = false) {\n let dirty = forceUpdate\n let indexDeltaDirty = false\n type TSnapSliderStateUpdateKey = keyof typeof params\n const keys: TSnapSliderStateUpdateKey[] = Object.keys(\n params,\n ) as Array<TSnapSliderStateUpdateKey>\n state['event'] = params['event']\n keys.forEach((key) => {\n if (key !== 'event' && state[key] !== params[key]) {\n state[key] = Number(params[key])\n dirty = true\n if (key === 'indexDelta') {\n indexDeltaDirty = true\n }\n }\n })\n if (dirty) {\n publishDirty = listeners.length === 0\n notify()\n if (indexDeltaDirty) {\n updateIndexDelta()\n }\n }\n }\n function fixIndex(nextIndex: TSnapListnerStateIndex): TSnapListnerStateIndex {\n const { index, indexDelta } = nextIndex\n const { countDelta, count } = state\n const last = countDelta - slidesPerPage\n return {\n index: indexDelta < last ? index : count - 1,\n indexDelta,\n }\n }\n function calculate(forceUpdate = false) {\n if (element) {\n let contentWidth = 0\n let itemWidth = 0\n itemPositions = []\n const slides = element.querySelectorAll<HTMLDivElement>(itemSelector)\n slides.forEach((slide) => {\n itemPositions.push(contentWidth)\n contentWidth += slide.clientWidth\n itemWidth = slide.clientWidth\n })\n slidesPerPage = Math.round(element.offsetWidth / itemWidth)\n const countDelta = itemPositions.length\n const count = Math.ceil(countDelta / slidesPerPage)\n const { index } = state\n const resetIndexMayby =\n index + 1 > count\n ? {\n index: 0,\n indexDelta: 0,\n }\n : {}\n\n if (!isNaN(count)) {\n // if element not mounted / hidden not update\n update(\n {\n event: 'inital',\n count,\n countDelta,\n ...resetIndexMayby,\n },\n forceUpdate,\n )\n debug &&\n console.log('update count', {\n count,\n countDelta,\n index,\n indexDelta,\n itemPositions,\n slidesPerPage,\n clientWidth: element.clientWidth,\n offsetWidth: element.offsetWidth,\n itemSelector,\n slides,\n })\n }\n }\n }\n function onScrollEnd() {\n if (element) {\n const scrollLeft = element.scrollLeft\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScrollEnd', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n }\n function onScroll() {\n if (element) {\n const scrollLeft = element.scrollLeft\n if (muteScrollListner) {\n const leftToScroll = Math.abs(left - scrollLeft)\n if (leftToScroll < 2) {\n muteScrollListner = false\n }\n } else {\n const positionItem = itemPositions.reduce((prev, curr) => {\n return Math.abs(curr - scrollLeft) < Math.abs(prev - scrollLeft)\n ? curr\n : prev\n })\n const indexDelta = itemPositions.findIndex((x) => x === positionItem)\n const pxLeftScrolling = Math.abs(scrollLeft - positionItem)\n prevIndexDelta = indexDelta\n debug &&\n console.log('onScroll', {\n pxLeftScrolling,\n indexDelta,\n scrollLeft,\n positionItem,\n itemPositions,\n })\n if (pxLeftScrolling < scrollListenerThreshold) {\n update({\n event: 'scroll',\n ...fixIndex({\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }),\n })\n }\n }\n }\n }\n const onScrollFn = throttle(onScroll, scrollTimeThrottle)\n const onResizeFn = throttle(calculate, resizeTimeThrottle)\n function setElement(_el: HTMLElement) {\n if (element) {\n destroy()\n }\n element = _el\n updateIndexDelta()\n calculate()\n if ('onscrollend' in window) {\n element?.addEventListener('scrollend', onScrollEnd)\n } else {\n element?.addEventListener('scroll', onScrollFn)\n }\n window.addEventListener('resize', onResizeFn)\n }\n _element && setElement(_element)\n const jumpTo: TSnapSliderJumpToFn = function (\n index,\n indexDelta,\n event = 'goto',\n ) {\n let nextIndex: TSnapListnerStateIndex = {\n index: 0,\n indexDelta: 0,\n }\n if (indexDelta !== undefined) {\n nextIndex = {\n index: Math.floor(indexDelta / slidesPerPage),\n indexDelta,\n }\n }\n if (index !== undefined) {\n nextIndex = {\n index,\n indexDelta: index * slidesPerPage,\n }\n }\n if (!isNaN(nextIndex.index) && !isNaN(nextIndex.indexDelta)) {\n update({\n event,\n ...fixIndex(nextIndex),\n })\n } else {\n if (debug) {\n console.log('catch', nextIndex)\n }\n }\n }\n const destroy = () => {\n if ('onscrollend' in window) {\n element?.removeEventListener('scrollend', onScrollEnd)\n } else {\n element?.removeEventListener('scroll', onScrollFn)\n }\n window.removeEventListener('resize', onResizeFn)\n }\n const goNext = () => {\n const { countDelta, indexDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta + slidesPerPage <= last\n ? indexDelta + slidesPerPage\n : circular && indexDelta === last\n ? 0\n : last\n jumpTo(undefined, next)\n }\n const goPrev = () => {\n const { indexDelta, countDelta } = state\n const last = countDelta - slidesPerPage\n const next =\n indexDelta - slidesPerPage >= 0\n ? indexDelta - slidesPerPage\n : circular && indexDelta === 0\n ? last\n : 0\n jumpTo(undefined, next)\n }\n return {\n destroy,\n getState,\n subscribe,\n jumpTo,\n setElement,\n calculate,\n goNext,\n goPrev,\n }\n}\n"],"names":["indexDelta","countDelta","index","count"],"mappings":"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"}
|
package/dist/use-snap-slider.cjs
CHANGED
|
@@ -39,7 +39,8 @@ function useSnapSlider(ref, count = 1, index = 0, countHash, options) {
|
|
|
39
39
|
...result,
|
|
40
40
|
jumpTo: observer.jumpTo,
|
|
41
41
|
goNext: observer.goNext,
|
|
42
|
-
goPrev: observer.goPrev
|
|
42
|
+
goPrev: observer.goPrev,
|
|
43
|
+
observer
|
|
43
44
|
};
|
|
44
45
|
}
|
|
45
46
|
exports.useSnapSlider = useSnapSlider;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-snap-slider.cjs","sources":["../lib/use-snap-slider.ts"],"sourcesContent":["import { RefObject, useEffect, useRef, useState } from 'react'\nimport {\n createSnapSlider,\n TSnapSliderJumpToFn,\n TSnapSliderOptions,\n type TSnapSliderStateFull,\n} from './snap-slider'\n\nexport interface TUseSnapSlider extends TSnapSliderStateFull {\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n}\n\nexport function useSnapSlider(\n ref: RefObject<HTMLDivElement | null>,\n count: number = 1,\n index: number = 0,\n countHash?: string | number,\n options?: TSnapSliderOptions
|
|
1
|
+
{"version":3,"file":"use-snap-slider.cjs","sources":["../lib/use-snap-slider.ts"],"sourcesContent":["import { RefObject, useEffect, useRef, useState } from 'react'\nimport {\n createSnapSlider,\n TSnapSlider,\n TSnapSliderJumpToFn,\n TSnapSliderOptions,\n type TSnapSliderStateFull,\n} from './snap-slider'\n\nexport interface TUseSnapSlider extends TSnapSliderStateFull {\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n observer: TSnapSlider\n}\n\nexport function useSnapSlider(\n ref: RefObject<HTMLDivElement | null>,\n count: number = 1,\n index: number = 0,\n countHash?: string | number,\n options?: TSnapSliderOptions,\n): TUseSnapSlider {\n const [, forceUpdate] = useState<number>(0)\n const mountedRef = useRef<boolean>(false)\n const initRef = useRef<boolean>(false)\n const [observer] = useState(() =>\n createSnapSlider({\n element: ref.current,\n count,\n index,\n initalSubscriptionPublish: false,\n ...options,\n }),\n )\n const result = observer.getState()\n useEffect(() => {\n if (mountedRef.current) {\n observer.jumpTo(0)\n observer.calculate()\n }\n }, [count, countHash, observer])\n useEffect(() => {\n mountedRef.current = true\n ref.current && observer.setElement(ref.current)\n const unsubscribe = observer.subscribe(() => {\n if (mountedRef.current) {\n forceUpdate((x) => x + 1)\n }\n })\n\n return () => {\n mountedRef.current = false\n unsubscribe()\n }\n }, [observer, forceUpdate])\n return {\n ...result,\n jumpTo: observer.jumpTo,\n goNext: observer.goNext,\n goPrev: observer.goPrev,\n observer,\n }\n}\n"],"names":["useState","useRef","createSnapSlider","useEffect"],"mappings":";;;;AAgBO,SAAS,cACd,KACA,QAAgB,GAChB,QAAgB,GAChB,WACA,SACgB;AAChB,QAAM,GAAG,WAAW,IAAIA,MAAAA,SAAiB,CAAC;AAC1C,QAAM,aAAaC,MAAAA,OAAgB,KAAK;AACxBA,QAAAA,OAAgB,KAAK;AACrC,QAAM,CAAC,QAAQ,IAAID,MAAAA;AAAAA,IAAS,MAC1BE,4BAAiB;AAAA,MACf,SAAS,IAAI;AAAA,MACb;AAAA,MACA;AAAA,MACA,2BAA2B;AAAA,MAC3B,GAAG;AAAA,IAAA,CACJ;AAAA,EAAA;AAEH,QAAM,SAAS,SAAS,SAAA;AACxBC,QAAAA,UAAU,MAAM;AACd,QAAI,WAAW,SAAS;AACtB,eAAS,OAAO,CAAC;AACjB,eAAS,UAAA;AAAA,IACX;AAAA,EACF,GAAG,CAAC,OAAO,WAAW,QAAQ,CAAC;AAC/BA,QAAAA,UAAU,MAAM;AACd,eAAW,UAAU;AACrB,QAAI,WAAW,SAAS,WAAW,IAAI,OAAO;AAC9C,UAAM,cAAc,SAAS,UAAU,MAAM;AAC3C,UAAI,WAAW,SAAS;AACtB,oBAAY,CAAC,MAAM,IAAI,CAAC;AAAA,MAC1B;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACX,iBAAW,UAAU;AACrB,kBAAA;AAAA,IACF;AAAA,EACF,GAAG,CAAC,UAAU,WAAW,CAAC;AAC1B,SAAO;AAAA,IACL,GAAG;AAAA,IACH,QAAQ,SAAS;AAAA,IACjB,QAAQ,SAAS;AAAA,IACjB,QAAQ,SAAS;AAAA,IACjB;AAAA,EAAA;AAEJ;;"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { RefObject } from 'react';
|
|
2
|
-
import { TSnapSliderJumpToFn, TSnapSliderOptions, TSnapSliderStateFull } from './snap-slider';
|
|
2
|
+
import { TSnapSlider, TSnapSliderJumpToFn, TSnapSliderOptions, TSnapSliderStateFull } from './snap-slider';
|
|
3
3
|
export interface TUseSnapSlider extends TSnapSliderStateFull {
|
|
4
4
|
jumpTo: TSnapSliderJumpToFn;
|
|
5
5
|
goNext: () => void;
|
|
6
6
|
goPrev: () => void;
|
|
7
|
+
observer: TSnapSlider;
|
|
7
8
|
}
|
|
8
9
|
export declare function useSnapSlider(ref: RefObject<HTMLDivElement | null>, count?: number, index?: number, countHash?: string | number, options?: TSnapSliderOptions): TUseSnapSlider;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-snap-slider.es.js","sources":["../lib/use-snap-slider.ts"],"sourcesContent":["import { RefObject, useEffect, useRef, useState } from 'react'\nimport {\n createSnapSlider,\n TSnapSliderJumpToFn,\n TSnapSliderOptions,\n type TSnapSliderStateFull,\n} from './snap-slider'\n\nexport interface TUseSnapSlider extends TSnapSliderStateFull {\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n}\n\nexport function useSnapSlider(\n ref: RefObject<HTMLDivElement | null>,\n count: number = 1,\n index: number = 0,\n countHash?: string | number,\n options?: TSnapSliderOptions
|
|
1
|
+
{"version":3,"file":"use-snap-slider.es.js","sources":["../lib/use-snap-slider.ts"],"sourcesContent":["import { RefObject, useEffect, useRef, useState } from 'react'\nimport {\n createSnapSlider,\n TSnapSlider,\n TSnapSliderJumpToFn,\n TSnapSliderOptions,\n type TSnapSliderStateFull,\n} from './snap-slider'\n\nexport interface TUseSnapSlider extends TSnapSliderStateFull {\n jumpTo: TSnapSliderJumpToFn\n goNext: () => void\n goPrev: () => void\n observer: TSnapSlider\n}\n\nexport function useSnapSlider(\n ref: RefObject<HTMLDivElement | null>,\n count: number = 1,\n index: number = 0,\n countHash?: string | number,\n options?: TSnapSliderOptions,\n): TUseSnapSlider {\n const [, forceUpdate] = useState<number>(0)\n const mountedRef = useRef<boolean>(false)\n const initRef = useRef<boolean>(false)\n const [observer] = useState(() =>\n createSnapSlider({\n element: ref.current,\n count,\n index,\n initalSubscriptionPublish: false,\n ...options,\n }),\n )\n const result = observer.getState()\n useEffect(() => {\n if (mountedRef.current) {\n observer.jumpTo(0)\n observer.calculate()\n }\n }, [count, countHash, observer])\n useEffect(() => {\n mountedRef.current = true\n ref.current && observer.setElement(ref.current)\n const unsubscribe = observer.subscribe(() => {\n if (mountedRef.current) {\n forceUpdate((x) => x + 1)\n }\n })\n\n return () => {\n mountedRef.current = false\n unsubscribe()\n }\n }, [observer, forceUpdate])\n return {\n ...result,\n jumpTo: observer.jumpTo,\n goNext: observer.goNext,\n goPrev: observer.goPrev,\n observer,\n }\n}\n"],"names":[],"mappings":";;AAgBO,SAAS,cACd,KACA,QAAgB,GAChB,QAAgB,GAChB,WACA,SACgB;AAChB,QAAM,GAAG,WAAW,IAAI,SAAiB,CAAC;AAC1C,QAAM,aAAa,OAAgB,KAAK;AACxB,SAAgB,KAAK;AACrC,QAAM,CAAC,QAAQ,IAAI;AAAA,IAAS,MAC1B,iBAAiB;AAAA,MACf,SAAS,IAAI;AAAA,MACb;AAAA,MACA;AAAA,MACA,2BAA2B;AAAA,MAC3B,GAAG;AAAA,IAAA,CACJ;AAAA,EAAA;AAEH,QAAM,SAAS,SAAS,SAAA;AACxB,YAAU,MAAM;AACd,QAAI,WAAW,SAAS;AACtB,eAAS,OAAO,CAAC;AACjB,eAAS,UAAA;AAAA,IACX;AAAA,EACF,GAAG,CAAC,OAAO,WAAW,QAAQ,CAAC;AAC/B,YAAU,MAAM;AACd,eAAW,UAAU;AACrB,QAAI,WAAW,SAAS,WAAW,IAAI,OAAO;AAC9C,UAAM,cAAc,SAAS,UAAU,MAAM;AAC3C,UAAI,WAAW,SAAS;AACtB,oBAAY,CAAC,MAAM,IAAI,CAAC;AAAA,MAC1B;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACX,iBAAW,UAAU;AACrB,kBAAA;AAAA,IACF;AAAA,EACF,GAAG,CAAC,UAAU,WAAW,CAAC;AAC1B,SAAO;AAAA,IACL,GAAG;AAAA,IACH,QAAQ,SAAS;AAAA,IACjB,QAAQ,SAAS;AAAA,IACjB,QAAQ,SAAS;AAAA,IACjB;AAAA,EAAA;AAEJ;"}
|