@asante-org/atlascopco-vt-litesitegenerator 3.0.2 → 3.0.7
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/index.esm.js +2163 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.esm.scss +657 -12
- package/dist/index.js +2167 -3
- package/dist/index.js.map +1 -1
- package/dist/index.scss +657 -12
- package/dist/src/components/lsg/index.d.ts +4 -0
- package/dist/src/index.d.ts +5 -5
- package/dist/src/themes/createThemeComponents.d.ts +1 -0
- package/dist/src/themes/theme-1/components.d.ts +2 -1
- package/dist/src/themes/theme-2/components.d.ts +2 -1
- package/dist/src/themes/theme-3/components.d.ts +2 -1
- package/dist/themes/theme-1.css +510 -6
- package/dist/themes/theme-1.css.map +1 -1
- package/dist/themes/theme-1.js +2016 -0
- package/dist/themes/theme-1.js.map +1 -1
- package/dist/themes/theme-2.css +320 -6
- package/dist/themes/theme-2.css.map +1 -1
- package/dist/themes/theme-2.js +2016 -0
- package/dist/themes/theme-2.js.map +1 -1
- package/dist/themes/theme-3.css +320 -6
- package/dist/themes/theme-3.css.map +1 -1
- package/dist/themes/theme-3.js +2016 -0
- package/dist/themes/theme-3.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +4 -2
package/dist/index.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState, useRef, useId, useEffect, useMemo, forwardRef,
|
|
1
|
+
import React, { useState, useRef, useId, useEffect, useCallback, useMemo, forwardRef, useImperativeHandle } from 'react';
|
|
2
2
|
|
|
3
3
|
function _extends() {
|
|
4
4
|
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
@@ -1333,6 +1333,2159 @@ var LsgFooter = function (_a) {
|
|
|
1333
1333
|
}))))), bottomBar);
|
|
1334
1334
|
};
|
|
1335
1335
|
|
|
1336
|
+
function isNumber$1(subject) {
|
|
1337
|
+
return typeof subject === 'number';
|
|
1338
|
+
}
|
|
1339
|
+
function isString(subject) {
|
|
1340
|
+
return typeof subject === 'string';
|
|
1341
|
+
}
|
|
1342
|
+
function isBoolean(subject) {
|
|
1343
|
+
return typeof subject === 'boolean';
|
|
1344
|
+
}
|
|
1345
|
+
function isObject(subject) {
|
|
1346
|
+
return Object.prototype.toString.call(subject) === '[object Object]';
|
|
1347
|
+
}
|
|
1348
|
+
function mathAbs(n) {
|
|
1349
|
+
return Math.abs(n);
|
|
1350
|
+
}
|
|
1351
|
+
function mathSign(n) {
|
|
1352
|
+
return Math.sign(n);
|
|
1353
|
+
}
|
|
1354
|
+
function deltaAbs(valueB, valueA) {
|
|
1355
|
+
return mathAbs(valueB - valueA);
|
|
1356
|
+
}
|
|
1357
|
+
function factorAbs(valueB, valueA) {
|
|
1358
|
+
if (valueB === 0 || valueA === 0) return 0;
|
|
1359
|
+
if (mathAbs(valueB) <= mathAbs(valueA)) return 0;
|
|
1360
|
+
const diff = deltaAbs(mathAbs(valueB), mathAbs(valueA));
|
|
1361
|
+
return mathAbs(diff / valueB);
|
|
1362
|
+
}
|
|
1363
|
+
function roundToTwoDecimals(num) {
|
|
1364
|
+
return Math.round(num * 100) / 100;
|
|
1365
|
+
}
|
|
1366
|
+
function arrayKeys(array) {
|
|
1367
|
+
return objectKeys(array).map(Number);
|
|
1368
|
+
}
|
|
1369
|
+
function arrayLast(array) {
|
|
1370
|
+
return array[arrayLastIndex(array)];
|
|
1371
|
+
}
|
|
1372
|
+
function arrayLastIndex(array) {
|
|
1373
|
+
return Math.max(0, array.length - 1);
|
|
1374
|
+
}
|
|
1375
|
+
function arrayIsLastIndex(array, index) {
|
|
1376
|
+
return index === arrayLastIndex(array);
|
|
1377
|
+
}
|
|
1378
|
+
function arrayFromNumber(n, startAt = 0) {
|
|
1379
|
+
return Array.from(Array(n), (_, i) => startAt + i);
|
|
1380
|
+
}
|
|
1381
|
+
function objectKeys(object) {
|
|
1382
|
+
return Object.keys(object);
|
|
1383
|
+
}
|
|
1384
|
+
function objectsMergeDeep(objectA, objectB) {
|
|
1385
|
+
return [objectA, objectB].reduce((mergedObjects, currentObject) => {
|
|
1386
|
+
objectKeys(currentObject).forEach(key => {
|
|
1387
|
+
const valueA = mergedObjects[key];
|
|
1388
|
+
const valueB = currentObject[key];
|
|
1389
|
+
const areObjects = isObject(valueA) && isObject(valueB);
|
|
1390
|
+
mergedObjects[key] = areObjects ? objectsMergeDeep(valueA, valueB) : valueB;
|
|
1391
|
+
});
|
|
1392
|
+
return mergedObjects;
|
|
1393
|
+
}, {});
|
|
1394
|
+
}
|
|
1395
|
+
function isMouseEvent(evt, ownerWindow) {
|
|
1396
|
+
return typeof ownerWindow.MouseEvent !== 'undefined' && evt instanceof ownerWindow.MouseEvent;
|
|
1397
|
+
}
|
|
1398
|
+
function Alignment(align, viewSize) {
|
|
1399
|
+
const predefined = {
|
|
1400
|
+
start,
|
|
1401
|
+
center,
|
|
1402
|
+
end
|
|
1403
|
+
};
|
|
1404
|
+
function start() {
|
|
1405
|
+
return 0;
|
|
1406
|
+
}
|
|
1407
|
+
function center(n) {
|
|
1408
|
+
return end(n) / 2;
|
|
1409
|
+
}
|
|
1410
|
+
function end(n) {
|
|
1411
|
+
return viewSize - n;
|
|
1412
|
+
}
|
|
1413
|
+
function measure(n, index) {
|
|
1414
|
+
if (isString(align)) return predefined[align](n);
|
|
1415
|
+
return align(viewSize, n, index);
|
|
1416
|
+
}
|
|
1417
|
+
const self = {
|
|
1418
|
+
measure
|
|
1419
|
+
};
|
|
1420
|
+
return self;
|
|
1421
|
+
}
|
|
1422
|
+
function EventStore() {
|
|
1423
|
+
let listeners = [];
|
|
1424
|
+
function add(node, type, handler, options = {
|
|
1425
|
+
passive: true
|
|
1426
|
+
}) {
|
|
1427
|
+
let removeListener;
|
|
1428
|
+
if ('addEventListener' in node) {
|
|
1429
|
+
node.addEventListener(type, handler, options);
|
|
1430
|
+
removeListener = () => node.removeEventListener(type, handler, options);
|
|
1431
|
+
} else {
|
|
1432
|
+
const legacyMediaQueryList = node;
|
|
1433
|
+
legacyMediaQueryList.addListener(handler);
|
|
1434
|
+
removeListener = () => legacyMediaQueryList.removeListener(handler);
|
|
1435
|
+
}
|
|
1436
|
+
listeners.push(removeListener);
|
|
1437
|
+
return self;
|
|
1438
|
+
}
|
|
1439
|
+
function clear() {
|
|
1440
|
+
listeners = listeners.filter(remove => remove());
|
|
1441
|
+
}
|
|
1442
|
+
const self = {
|
|
1443
|
+
add,
|
|
1444
|
+
clear
|
|
1445
|
+
};
|
|
1446
|
+
return self;
|
|
1447
|
+
}
|
|
1448
|
+
function Animations(ownerDocument, ownerWindow, update, render) {
|
|
1449
|
+
const documentVisibleHandler = EventStore();
|
|
1450
|
+
const fixedTimeStep = 1000 / 60;
|
|
1451
|
+
let lastTimeStamp = null;
|
|
1452
|
+
let accumulatedTime = 0;
|
|
1453
|
+
let animationId = 0;
|
|
1454
|
+
function init() {
|
|
1455
|
+
documentVisibleHandler.add(ownerDocument, 'visibilitychange', () => {
|
|
1456
|
+
if (ownerDocument.hidden) reset();
|
|
1457
|
+
});
|
|
1458
|
+
}
|
|
1459
|
+
function destroy() {
|
|
1460
|
+
stop();
|
|
1461
|
+
documentVisibleHandler.clear();
|
|
1462
|
+
}
|
|
1463
|
+
function animate(timeStamp) {
|
|
1464
|
+
if (!animationId) return;
|
|
1465
|
+
if (!lastTimeStamp) {
|
|
1466
|
+
lastTimeStamp = timeStamp;
|
|
1467
|
+
update();
|
|
1468
|
+
update();
|
|
1469
|
+
}
|
|
1470
|
+
const timeElapsed = timeStamp - lastTimeStamp;
|
|
1471
|
+
lastTimeStamp = timeStamp;
|
|
1472
|
+
accumulatedTime += timeElapsed;
|
|
1473
|
+
while (accumulatedTime >= fixedTimeStep) {
|
|
1474
|
+
update();
|
|
1475
|
+
accumulatedTime -= fixedTimeStep;
|
|
1476
|
+
}
|
|
1477
|
+
const alpha = accumulatedTime / fixedTimeStep;
|
|
1478
|
+
render(alpha);
|
|
1479
|
+
if (animationId) {
|
|
1480
|
+
animationId = ownerWindow.requestAnimationFrame(animate);
|
|
1481
|
+
}
|
|
1482
|
+
}
|
|
1483
|
+
function start() {
|
|
1484
|
+
if (animationId) return;
|
|
1485
|
+
animationId = ownerWindow.requestAnimationFrame(animate);
|
|
1486
|
+
}
|
|
1487
|
+
function stop() {
|
|
1488
|
+
ownerWindow.cancelAnimationFrame(animationId);
|
|
1489
|
+
lastTimeStamp = null;
|
|
1490
|
+
accumulatedTime = 0;
|
|
1491
|
+
animationId = 0;
|
|
1492
|
+
}
|
|
1493
|
+
function reset() {
|
|
1494
|
+
lastTimeStamp = null;
|
|
1495
|
+
accumulatedTime = 0;
|
|
1496
|
+
}
|
|
1497
|
+
const self = {
|
|
1498
|
+
init,
|
|
1499
|
+
destroy,
|
|
1500
|
+
start,
|
|
1501
|
+
stop,
|
|
1502
|
+
update,
|
|
1503
|
+
render
|
|
1504
|
+
};
|
|
1505
|
+
return self;
|
|
1506
|
+
}
|
|
1507
|
+
function Axis(axis, contentDirection) {
|
|
1508
|
+
const isRightToLeft = contentDirection === 'rtl';
|
|
1509
|
+
const isVertical = axis === 'y';
|
|
1510
|
+
const scroll = isVertical ? 'y' : 'x';
|
|
1511
|
+
const cross = isVertical ? 'x' : 'y';
|
|
1512
|
+
const sign = !isVertical && isRightToLeft ? -1 : 1;
|
|
1513
|
+
const startEdge = getStartEdge();
|
|
1514
|
+
const endEdge = getEndEdge();
|
|
1515
|
+
function measureSize(nodeRect) {
|
|
1516
|
+
const {
|
|
1517
|
+
height,
|
|
1518
|
+
width
|
|
1519
|
+
} = nodeRect;
|
|
1520
|
+
return isVertical ? height : width;
|
|
1521
|
+
}
|
|
1522
|
+
function getStartEdge() {
|
|
1523
|
+
if (isVertical) return 'top';
|
|
1524
|
+
return isRightToLeft ? 'right' : 'left';
|
|
1525
|
+
}
|
|
1526
|
+
function getEndEdge() {
|
|
1527
|
+
if (isVertical) return 'bottom';
|
|
1528
|
+
return isRightToLeft ? 'left' : 'right';
|
|
1529
|
+
}
|
|
1530
|
+
function direction(n) {
|
|
1531
|
+
return n * sign;
|
|
1532
|
+
}
|
|
1533
|
+
const self = {
|
|
1534
|
+
scroll,
|
|
1535
|
+
cross,
|
|
1536
|
+
startEdge,
|
|
1537
|
+
endEdge,
|
|
1538
|
+
measureSize,
|
|
1539
|
+
direction
|
|
1540
|
+
};
|
|
1541
|
+
return self;
|
|
1542
|
+
}
|
|
1543
|
+
function Limit(min = 0, max = 0) {
|
|
1544
|
+
const length = mathAbs(min - max);
|
|
1545
|
+
function reachedMin(n) {
|
|
1546
|
+
return n < min;
|
|
1547
|
+
}
|
|
1548
|
+
function reachedMax(n) {
|
|
1549
|
+
return n > max;
|
|
1550
|
+
}
|
|
1551
|
+
function reachedAny(n) {
|
|
1552
|
+
return reachedMin(n) || reachedMax(n);
|
|
1553
|
+
}
|
|
1554
|
+
function constrain(n) {
|
|
1555
|
+
if (!reachedAny(n)) return n;
|
|
1556
|
+
return reachedMin(n) ? min : max;
|
|
1557
|
+
}
|
|
1558
|
+
function removeOffset(n) {
|
|
1559
|
+
if (!length) return n;
|
|
1560
|
+
return n - length * Math.ceil((n - max) / length);
|
|
1561
|
+
}
|
|
1562
|
+
const self = {
|
|
1563
|
+
length,
|
|
1564
|
+
max,
|
|
1565
|
+
min,
|
|
1566
|
+
constrain,
|
|
1567
|
+
reachedAny,
|
|
1568
|
+
reachedMax,
|
|
1569
|
+
reachedMin,
|
|
1570
|
+
removeOffset
|
|
1571
|
+
};
|
|
1572
|
+
return self;
|
|
1573
|
+
}
|
|
1574
|
+
function Counter(max, start, loop) {
|
|
1575
|
+
const {
|
|
1576
|
+
constrain
|
|
1577
|
+
} = Limit(0, max);
|
|
1578
|
+
const loopEnd = max + 1;
|
|
1579
|
+
let counter = withinLimit(start);
|
|
1580
|
+
function withinLimit(n) {
|
|
1581
|
+
return !loop ? constrain(n) : mathAbs((loopEnd + n) % loopEnd);
|
|
1582
|
+
}
|
|
1583
|
+
function get() {
|
|
1584
|
+
return counter;
|
|
1585
|
+
}
|
|
1586
|
+
function set(n) {
|
|
1587
|
+
counter = withinLimit(n);
|
|
1588
|
+
return self;
|
|
1589
|
+
}
|
|
1590
|
+
function add(n) {
|
|
1591
|
+
return clone().set(get() + n);
|
|
1592
|
+
}
|
|
1593
|
+
function clone() {
|
|
1594
|
+
return Counter(max, get(), loop);
|
|
1595
|
+
}
|
|
1596
|
+
const self = {
|
|
1597
|
+
get,
|
|
1598
|
+
set,
|
|
1599
|
+
add,
|
|
1600
|
+
clone
|
|
1601
|
+
};
|
|
1602
|
+
return self;
|
|
1603
|
+
}
|
|
1604
|
+
function DragHandler(axis, rootNode, ownerDocument, ownerWindow, target, dragTracker, location, animation, scrollTo, scrollBody, scrollTarget, index, eventHandler, percentOfView, dragFree, dragThreshold, skipSnaps, baseFriction, watchDrag) {
|
|
1605
|
+
const {
|
|
1606
|
+
cross: crossAxis,
|
|
1607
|
+
direction
|
|
1608
|
+
} = axis;
|
|
1609
|
+
const focusNodes = ['INPUT', 'SELECT', 'TEXTAREA'];
|
|
1610
|
+
const nonPassiveEvent = {
|
|
1611
|
+
passive: false
|
|
1612
|
+
};
|
|
1613
|
+
const initEvents = EventStore();
|
|
1614
|
+
const dragEvents = EventStore();
|
|
1615
|
+
const goToNextThreshold = Limit(50, 225).constrain(percentOfView.measure(20));
|
|
1616
|
+
const snapForceBoost = {
|
|
1617
|
+
mouse: 300,
|
|
1618
|
+
touch: 400
|
|
1619
|
+
};
|
|
1620
|
+
const freeForceBoost = {
|
|
1621
|
+
mouse: 500,
|
|
1622
|
+
touch: 600
|
|
1623
|
+
};
|
|
1624
|
+
const baseSpeed = dragFree ? 43 : 25;
|
|
1625
|
+
let isMoving = false;
|
|
1626
|
+
let startScroll = 0;
|
|
1627
|
+
let startCross = 0;
|
|
1628
|
+
let pointerIsDown = false;
|
|
1629
|
+
let preventScroll = false;
|
|
1630
|
+
let preventClick = false;
|
|
1631
|
+
let isMouse = false;
|
|
1632
|
+
function init(emblaApi) {
|
|
1633
|
+
if (!watchDrag) return;
|
|
1634
|
+
function downIfAllowed(evt) {
|
|
1635
|
+
if (isBoolean(watchDrag) || watchDrag(emblaApi, evt)) down(evt);
|
|
1636
|
+
}
|
|
1637
|
+
const node = rootNode;
|
|
1638
|
+
initEvents.add(node, 'dragstart', evt => evt.preventDefault(), nonPassiveEvent).add(node, 'touchmove', () => undefined, nonPassiveEvent).add(node, 'touchend', () => undefined).add(node, 'touchstart', downIfAllowed).add(node, 'mousedown', downIfAllowed).add(node, 'touchcancel', up).add(node, 'contextmenu', up).add(node, 'click', click, true);
|
|
1639
|
+
}
|
|
1640
|
+
function destroy() {
|
|
1641
|
+
initEvents.clear();
|
|
1642
|
+
dragEvents.clear();
|
|
1643
|
+
}
|
|
1644
|
+
function addDragEvents() {
|
|
1645
|
+
const node = isMouse ? ownerDocument : rootNode;
|
|
1646
|
+
dragEvents.add(node, 'touchmove', move, nonPassiveEvent).add(node, 'touchend', up).add(node, 'mousemove', move, nonPassiveEvent).add(node, 'mouseup', up);
|
|
1647
|
+
}
|
|
1648
|
+
function isFocusNode(node) {
|
|
1649
|
+
const nodeName = node.nodeName || '';
|
|
1650
|
+
return focusNodes.includes(nodeName);
|
|
1651
|
+
}
|
|
1652
|
+
function forceBoost() {
|
|
1653
|
+
const boost = dragFree ? freeForceBoost : snapForceBoost;
|
|
1654
|
+
const type = isMouse ? 'mouse' : 'touch';
|
|
1655
|
+
return boost[type];
|
|
1656
|
+
}
|
|
1657
|
+
function allowedForce(force, targetChanged) {
|
|
1658
|
+
const next = index.add(mathSign(force) * -1);
|
|
1659
|
+
const baseForce = scrollTarget.byDistance(force, !dragFree).distance;
|
|
1660
|
+
if (dragFree || mathAbs(force) < goToNextThreshold) return baseForce;
|
|
1661
|
+
if (skipSnaps && targetChanged) return baseForce * 0.5;
|
|
1662
|
+
return scrollTarget.byIndex(next.get(), 0).distance;
|
|
1663
|
+
}
|
|
1664
|
+
function down(evt) {
|
|
1665
|
+
const isMouseEvt = isMouseEvent(evt, ownerWindow);
|
|
1666
|
+
isMouse = isMouseEvt;
|
|
1667
|
+
preventClick = dragFree && isMouseEvt && !evt.buttons && isMoving;
|
|
1668
|
+
isMoving = deltaAbs(target.get(), location.get()) >= 2;
|
|
1669
|
+
if (isMouseEvt && evt.button !== 0) return;
|
|
1670
|
+
if (isFocusNode(evt.target)) return;
|
|
1671
|
+
pointerIsDown = true;
|
|
1672
|
+
dragTracker.pointerDown(evt);
|
|
1673
|
+
scrollBody.useFriction(0).useDuration(0);
|
|
1674
|
+
target.set(location);
|
|
1675
|
+
addDragEvents();
|
|
1676
|
+
startScroll = dragTracker.readPoint(evt);
|
|
1677
|
+
startCross = dragTracker.readPoint(evt, crossAxis);
|
|
1678
|
+
eventHandler.emit('pointerDown');
|
|
1679
|
+
}
|
|
1680
|
+
function move(evt) {
|
|
1681
|
+
const isTouchEvt = !isMouseEvent(evt, ownerWindow);
|
|
1682
|
+
if (isTouchEvt && evt.touches.length >= 2) return up(evt);
|
|
1683
|
+
const lastScroll = dragTracker.readPoint(evt);
|
|
1684
|
+
const lastCross = dragTracker.readPoint(evt, crossAxis);
|
|
1685
|
+
const diffScroll = deltaAbs(lastScroll, startScroll);
|
|
1686
|
+
const diffCross = deltaAbs(lastCross, startCross);
|
|
1687
|
+
if (!preventScroll && !isMouse) {
|
|
1688
|
+
if (!evt.cancelable) return up(evt);
|
|
1689
|
+
preventScroll = diffScroll > diffCross;
|
|
1690
|
+
if (!preventScroll) return up(evt);
|
|
1691
|
+
}
|
|
1692
|
+
const diff = dragTracker.pointerMove(evt);
|
|
1693
|
+
if (diffScroll > dragThreshold) preventClick = true;
|
|
1694
|
+
scrollBody.useFriction(0.3).useDuration(0.75);
|
|
1695
|
+
animation.start();
|
|
1696
|
+
target.add(direction(diff));
|
|
1697
|
+
evt.preventDefault();
|
|
1698
|
+
}
|
|
1699
|
+
function up(evt) {
|
|
1700
|
+
const currentLocation = scrollTarget.byDistance(0, false);
|
|
1701
|
+
const targetChanged = currentLocation.index !== index.get();
|
|
1702
|
+
const rawForce = dragTracker.pointerUp(evt) * forceBoost();
|
|
1703
|
+
const force = allowedForce(direction(rawForce), targetChanged);
|
|
1704
|
+
const forceFactor = factorAbs(rawForce, force);
|
|
1705
|
+
const speed = baseSpeed - 10 * forceFactor;
|
|
1706
|
+
const friction = baseFriction + forceFactor / 50;
|
|
1707
|
+
preventScroll = false;
|
|
1708
|
+
pointerIsDown = false;
|
|
1709
|
+
dragEvents.clear();
|
|
1710
|
+
scrollBody.useDuration(speed).useFriction(friction);
|
|
1711
|
+
scrollTo.distance(force, !dragFree);
|
|
1712
|
+
isMouse = false;
|
|
1713
|
+
eventHandler.emit('pointerUp');
|
|
1714
|
+
}
|
|
1715
|
+
function click(evt) {
|
|
1716
|
+
if (preventClick) {
|
|
1717
|
+
evt.stopPropagation();
|
|
1718
|
+
evt.preventDefault();
|
|
1719
|
+
preventClick = false;
|
|
1720
|
+
}
|
|
1721
|
+
}
|
|
1722
|
+
function pointerDown() {
|
|
1723
|
+
return pointerIsDown;
|
|
1724
|
+
}
|
|
1725
|
+
const self = {
|
|
1726
|
+
init,
|
|
1727
|
+
destroy,
|
|
1728
|
+
pointerDown
|
|
1729
|
+
};
|
|
1730
|
+
return self;
|
|
1731
|
+
}
|
|
1732
|
+
function DragTracker(axis, ownerWindow) {
|
|
1733
|
+
const logInterval = 170;
|
|
1734
|
+
let startEvent;
|
|
1735
|
+
let lastEvent;
|
|
1736
|
+
function readTime(evt) {
|
|
1737
|
+
return evt.timeStamp;
|
|
1738
|
+
}
|
|
1739
|
+
function readPoint(evt, evtAxis) {
|
|
1740
|
+
const property = evtAxis || axis.scroll;
|
|
1741
|
+
const coord = `client${property === 'x' ? 'X' : 'Y'}`;
|
|
1742
|
+
return (isMouseEvent(evt, ownerWindow) ? evt : evt.touches[0])[coord];
|
|
1743
|
+
}
|
|
1744
|
+
function pointerDown(evt) {
|
|
1745
|
+
startEvent = evt;
|
|
1746
|
+
lastEvent = evt;
|
|
1747
|
+
return readPoint(evt);
|
|
1748
|
+
}
|
|
1749
|
+
function pointerMove(evt) {
|
|
1750
|
+
const diff = readPoint(evt) - readPoint(lastEvent);
|
|
1751
|
+
const expired = readTime(evt) - readTime(startEvent) > logInterval;
|
|
1752
|
+
lastEvent = evt;
|
|
1753
|
+
if (expired) startEvent = evt;
|
|
1754
|
+
return diff;
|
|
1755
|
+
}
|
|
1756
|
+
function pointerUp(evt) {
|
|
1757
|
+
if (!startEvent || !lastEvent) return 0;
|
|
1758
|
+
const diffDrag = readPoint(lastEvent) - readPoint(startEvent);
|
|
1759
|
+
const diffTime = readTime(evt) - readTime(startEvent);
|
|
1760
|
+
const expired = readTime(evt) - readTime(lastEvent) > logInterval;
|
|
1761
|
+
const force = diffDrag / diffTime;
|
|
1762
|
+
const isFlick = diffTime && !expired && mathAbs(force) > 0.1;
|
|
1763
|
+
return isFlick ? force : 0;
|
|
1764
|
+
}
|
|
1765
|
+
const self = {
|
|
1766
|
+
pointerDown,
|
|
1767
|
+
pointerMove,
|
|
1768
|
+
pointerUp,
|
|
1769
|
+
readPoint
|
|
1770
|
+
};
|
|
1771
|
+
return self;
|
|
1772
|
+
}
|
|
1773
|
+
function NodeRects() {
|
|
1774
|
+
function measure(node) {
|
|
1775
|
+
const {
|
|
1776
|
+
offsetTop,
|
|
1777
|
+
offsetLeft,
|
|
1778
|
+
offsetWidth,
|
|
1779
|
+
offsetHeight
|
|
1780
|
+
} = node;
|
|
1781
|
+
const offset = {
|
|
1782
|
+
top: offsetTop,
|
|
1783
|
+
right: offsetLeft + offsetWidth,
|
|
1784
|
+
bottom: offsetTop + offsetHeight,
|
|
1785
|
+
left: offsetLeft,
|
|
1786
|
+
width: offsetWidth,
|
|
1787
|
+
height: offsetHeight
|
|
1788
|
+
};
|
|
1789
|
+
return offset;
|
|
1790
|
+
}
|
|
1791
|
+
const self = {
|
|
1792
|
+
measure
|
|
1793
|
+
};
|
|
1794
|
+
return self;
|
|
1795
|
+
}
|
|
1796
|
+
function PercentOfView(viewSize) {
|
|
1797
|
+
function measure(n) {
|
|
1798
|
+
return viewSize * (n / 100);
|
|
1799
|
+
}
|
|
1800
|
+
const self = {
|
|
1801
|
+
measure
|
|
1802
|
+
};
|
|
1803
|
+
return self;
|
|
1804
|
+
}
|
|
1805
|
+
function ResizeHandler(container, eventHandler, ownerWindow, slides, axis, watchResize, nodeRects) {
|
|
1806
|
+
const observeNodes = [container].concat(slides);
|
|
1807
|
+
let resizeObserver;
|
|
1808
|
+
let containerSize;
|
|
1809
|
+
let slideSizes = [];
|
|
1810
|
+
let destroyed = false;
|
|
1811
|
+
function readSize(node) {
|
|
1812
|
+
return axis.measureSize(nodeRects.measure(node));
|
|
1813
|
+
}
|
|
1814
|
+
function init(emblaApi) {
|
|
1815
|
+
if (!watchResize) return;
|
|
1816
|
+
containerSize = readSize(container);
|
|
1817
|
+
slideSizes = slides.map(readSize);
|
|
1818
|
+
function defaultCallback(entries) {
|
|
1819
|
+
for (const entry of entries) {
|
|
1820
|
+
if (destroyed) return;
|
|
1821
|
+
const isContainer = entry.target === container;
|
|
1822
|
+
const slideIndex = slides.indexOf(entry.target);
|
|
1823
|
+
const lastSize = isContainer ? containerSize : slideSizes[slideIndex];
|
|
1824
|
+
const newSize = readSize(isContainer ? container : slides[slideIndex]);
|
|
1825
|
+
const diffSize = mathAbs(newSize - lastSize);
|
|
1826
|
+
if (diffSize >= 0.5) {
|
|
1827
|
+
emblaApi.reInit();
|
|
1828
|
+
eventHandler.emit('resize');
|
|
1829
|
+
break;
|
|
1830
|
+
}
|
|
1831
|
+
}
|
|
1832
|
+
}
|
|
1833
|
+
resizeObserver = new ResizeObserver(entries => {
|
|
1834
|
+
if (isBoolean(watchResize) || watchResize(emblaApi, entries)) {
|
|
1835
|
+
defaultCallback(entries);
|
|
1836
|
+
}
|
|
1837
|
+
});
|
|
1838
|
+
ownerWindow.requestAnimationFrame(() => {
|
|
1839
|
+
observeNodes.forEach(node => resizeObserver.observe(node));
|
|
1840
|
+
});
|
|
1841
|
+
}
|
|
1842
|
+
function destroy() {
|
|
1843
|
+
destroyed = true;
|
|
1844
|
+
if (resizeObserver) resizeObserver.disconnect();
|
|
1845
|
+
}
|
|
1846
|
+
const self = {
|
|
1847
|
+
init,
|
|
1848
|
+
destroy
|
|
1849
|
+
};
|
|
1850
|
+
return self;
|
|
1851
|
+
}
|
|
1852
|
+
function ScrollBody(location, offsetLocation, previousLocation, target, baseDuration, baseFriction) {
|
|
1853
|
+
let scrollVelocity = 0;
|
|
1854
|
+
let scrollDirection = 0;
|
|
1855
|
+
let scrollDuration = baseDuration;
|
|
1856
|
+
let scrollFriction = baseFriction;
|
|
1857
|
+
let rawLocation = location.get();
|
|
1858
|
+
let rawLocationPrevious = 0;
|
|
1859
|
+
function seek() {
|
|
1860
|
+
const displacement = target.get() - location.get();
|
|
1861
|
+
const isInstant = !scrollDuration;
|
|
1862
|
+
let scrollDistance = 0;
|
|
1863
|
+
if (isInstant) {
|
|
1864
|
+
scrollVelocity = 0;
|
|
1865
|
+
previousLocation.set(target);
|
|
1866
|
+
location.set(target);
|
|
1867
|
+
scrollDistance = displacement;
|
|
1868
|
+
} else {
|
|
1869
|
+
previousLocation.set(location);
|
|
1870
|
+
scrollVelocity += displacement / scrollDuration;
|
|
1871
|
+
scrollVelocity *= scrollFriction;
|
|
1872
|
+
rawLocation += scrollVelocity;
|
|
1873
|
+
location.add(scrollVelocity);
|
|
1874
|
+
scrollDistance = rawLocation - rawLocationPrevious;
|
|
1875
|
+
}
|
|
1876
|
+
scrollDirection = mathSign(scrollDistance);
|
|
1877
|
+
rawLocationPrevious = rawLocation;
|
|
1878
|
+
return self;
|
|
1879
|
+
}
|
|
1880
|
+
function settled() {
|
|
1881
|
+
const diff = target.get() - offsetLocation.get();
|
|
1882
|
+
return mathAbs(diff) < 0.001;
|
|
1883
|
+
}
|
|
1884
|
+
function duration() {
|
|
1885
|
+
return scrollDuration;
|
|
1886
|
+
}
|
|
1887
|
+
function direction() {
|
|
1888
|
+
return scrollDirection;
|
|
1889
|
+
}
|
|
1890
|
+
function velocity() {
|
|
1891
|
+
return scrollVelocity;
|
|
1892
|
+
}
|
|
1893
|
+
function useBaseDuration() {
|
|
1894
|
+
return useDuration(baseDuration);
|
|
1895
|
+
}
|
|
1896
|
+
function useBaseFriction() {
|
|
1897
|
+
return useFriction(baseFriction);
|
|
1898
|
+
}
|
|
1899
|
+
function useDuration(n) {
|
|
1900
|
+
scrollDuration = n;
|
|
1901
|
+
return self;
|
|
1902
|
+
}
|
|
1903
|
+
function useFriction(n) {
|
|
1904
|
+
scrollFriction = n;
|
|
1905
|
+
return self;
|
|
1906
|
+
}
|
|
1907
|
+
const self = {
|
|
1908
|
+
direction,
|
|
1909
|
+
duration,
|
|
1910
|
+
velocity,
|
|
1911
|
+
seek,
|
|
1912
|
+
settled,
|
|
1913
|
+
useBaseFriction,
|
|
1914
|
+
useBaseDuration,
|
|
1915
|
+
useFriction,
|
|
1916
|
+
useDuration
|
|
1917
|
+
};
|
|
1918
|
+
return self;
|
|
1919
|
+
}
|
|
1920
|
+
function ScrollBounds(limit, location, target, scrollBody, percentOfView) {
|
|
1921
|
+
const pullBackThreshold = percentOfView.measure(10);
|
|
1922
|
+
const edgeOffsetTolerance = percentOfView.measure(50);
|
|
1923
|
+
const frictionLimit = Limit(0.1, 0.99);
|
|
1924
|
+
let disabled = false;
|
|
1925
|
+
function shouldConstrain() {
|
|
1926
|
+
if (disabled) return false;
|
|
1927
|
+
if (!limit.reachedAny(target.get())) return false;
|
|
1928
|
+
if (!limit.reachedAny(location.get())) return false;
|
|
1929
|
+
return true;
|
|
1930
|
+
}
|
|
1931
|
+
function constrain(pointerDown) {
|
|
1932
|
+
if (!shouldConstrain()) return;
|
|
1933
|
+
const edge = limit.reachedMin(location.get()) ? 'min' : 'max';
|
|
1934
|
+
const diffToEdge = mathAbs(limit[edge] - location.get());
|
|
1935
|
+
const diffToTarget = target.get() - location.get();
|
|
1936
|
+
const friction = frictionLimit.constrain(diffToEdge / edgeOffsetTolerance);
|
|
1937
|
+
target.subtract(diffToTarget * friction);
|
|
1938
|
+
if (!pointerDown && mathAbs(diffToTarget) < pullBackThreshold) {
|
|
1939
|
+
target.set(limit.constrain(target.get()));
|
|
1940
|
+
scrollBody.useDuration(25).useBaseFriction();
|
|
1941
|
+
}
|
|
1942
|
+
}
|
|
1943
|
+
function toggleActive(active) {
|
|
1944
|
+
disabled = !active;
|
|
1945
|
+
}
|
|
1946
|
+
const self = {
|
|
1947
|
+
shouldConstrain,
|
|
1948
|
+
constrain,
|
|
1949
|
+
toggleActive
|
|
1950
|
+
};
|
|
1951
|
+
return self;
|
|
1952
|
+
}
|
|
1953
|
+
function ScrollContain(viewSize, contentSize, snapsAligned, containScroll, pixelTolerance) {
|
|
1954
|
+
const scrollBounds = Limit(-contentSize + viewSize, 0);
|
|
1955
|
+
const snapsBounded = measureBounded();
|
|
1956
|
+
const scrollContainLimit = findScrollContainLimit();
|
|
1957
|
+
const snapsContained = measureContained();
|
|
1958
|
+
function usePixelTolerance(bound, snap) {
|
|
1959
|
+
return deltaAbs(bound, snap) <= 1;
|
|
1960
|
+
}
|
|
1961
|
+
function findScrollContainLimit() {
|
|
1962
|
+
const startSnap = snapsBounded[0];
|
|
1963
|
+
const endSnap = arrayLast(snapsBounded);
|
|
1964
|
+
const min = snapsBounded.lastIndexOf(startSnap);
|
|
1965
|
+
const max = snapsBounded.indexOf(endSnap) + 1;
|
|
1966
|
+
return Limit(min, max);
|
|
1967
|
+
}
|
|
1968
|
+
function measureBounded() {
|
|
1969
|
+
return snapsAligned.map((snapAligned, index) => {
|
|
1970
|
+
const {
|
|
1971
|
+
min,
|
|
1972
|
+
max
|
|
1973
|
+
} = scrollBounds;
|
|
1974
|
+
const snap = scrollBounds.constrain(snapAligned);
|
|
1975
|
+
const isFirst = !index;
|
|
1976
|
+
const isLast = arrayIsLastIndex(snapsAligned, index);
|
|
1977
|
+
if (isFirst) return max;
|
|
1978
|
+
if (isLast) return min;
|
|
1979
|
+
if (usePixelTolerance(min, snap)) return min;
|
|
1980
|
+
if (usePixelTolerance(max, snap)) return max;
|
|
1981
|
+
return snap;
|
|
1982
|
+
}).map(scrollBound => parseFloat(scrollBound.toFixed(3)));
|
|
1983
|
+
}
|
|
1984
|
+
function measureContained() {
|
|
1985
|
+
if (contentSize <= viewSize + pixelTolerance) return [scrollBounds.max];
|
|
1986
|
+
if (containScroll === 'keepSnaps') return snapsBounded;
|
|
1987
|
+
const {
|
|
1988
|
+
min,
|
|
1989
|
+
max
|
|
1990
|
+
} = scrollContainLimit;
|
|
1991
|
+
return snapsBounded.slice(min, max);
|
|
1992
|
+
}
|
|
1993
|
+
const self = {
|
|
1994
|
+
snapsContained,
|
|
1995
|
+
scrollContainLimit
|
|
1996
|
+
};
|
|
1997
|
+
return self;
|
|
1998
|
+
}
|
|
1999
|
+
function ScrollLimit(contentSize, scrollSnaps, loop) {
|
|
2000
|
+
const max = scrollSnaps[0];
|
|
2001
|
+
const min = loop ? max - contentSize : arrayLast(scrollSnaps);
|
|
2002
|
+
const limit = Limit(min, max);
|
|
2003
|
+
const self = {
|
|
2004
|
+
limit
|
|
2005
|
+
};
|
|
2006
|
+
return self;
|
|
2007
|
+
}
|
|
2008
|
+
function ScrollLooper(contentSize, limit, location, vectors) {
|
|
2009
|
+
const jointSafety = 0.1;
|
|
2010
|
+
const min = limit.min + jointSafety;
|
|
2011
|
+
const max = limit.max + jointSafety;
|
|
2012
|
+
const {
|
|
2013
|
+
reachedMin,
|
|
2014
|
+
reachedMax
|
|
2015
|
+
} = Limit(min, max);
|
|
2016
|
+
function shouldLoop(direction) {
|
|
2017
|
+
if (direction === 1) return reachedMax(location.get());
|
|
2018
|
+
if (direction === -1) return reachedMin(location.get());
|
|
2019
|
+
return false;
|
|
2020
|
+
}
|
|
2021
|
+
function loop(direction) {
|
|
2022
|
+
if (!shouldLoop(direction)) return;
|
|
2023
|
+
const loopDistance = contentSize * (direction * -1);
|
|
2024
|
+
vectors.forEach(v => v.add(loopDistance));
|
|
2025
|
+
}
|
|
2026
|
+
const self = {
|
|
2027
|
+
loop
|
|
2028
|
+
};
|
|
2029
|
+
return self;
|
|
2030
|
+
}
|
|
2031
|
+
function ScrollProgress(limit) {
|
|
2032
|
+
const {
|
|
2033
|
+
max,
|
|
2034
|
+
length
|
|
2035
|
+
} = limit;
|
|
2036
|
+
function get(n) {
|
|
2037
|
+
const currentLocation = n - max;
|
|
2038
|
+
return length ? currentLocation / -length : 0;
|
|
2039
|
+
}
|
|
2040
|
+
const self = {
|
|
2041
|
+
get
|
|
2042
|
+
};
|
|
2043
|
+
return self;
|
|
2044
|
+
}
|
|
2045
|
+
function ScrollSnaps(axis, alignment, containerRect, slideRects, slidesToScroll) {
|
|
2046
|
+
const {
|
|
2047
|
+
startEdge,
|
|
2048
|
+
endEdge
|
|
2049
|
+
} = axis;
|
|
2050
|
+
const {
|
|
2051
|
+
groupSlides
|
|
2052
|
+
} = slidesToScroll;
|
|
2053
|
+
const alignments = measureSizes().map(alignment.measure);
|
|
2054
|
+
const snaps = measureUnaligned();
|
|
2055
|
+
const snapsAligned = measureAligned();
|
|
2056
|
+
function measureSizes() {
|
|
2057
|
+
return groupSlides(slideRects).map(rects => arrayLast(rects)[endEdge] - rects[0][startEdge]).map(mathAbs);
|
|
2058
|
+
}
|
|
2059
|
+
function measureUnaligned() {
|
|
2060
|
+
return slideRects.map(rect => containerRect[startEdge] - rect[startEdge]).map(snap => -mathAbs(snap));
|
|
2061
|
+
}
|
|
2062
|
+
function measureAligned() {
|
|
2063
|
+
return groupSlides(snaps).map(g => g[0]).map((snap, index) => snap + alignments[index]);
|
|
2064
|
+
}
|
|
2065
|
+
const self = {
|
|
2066
|
+
snaps,
|
|
2067
|
+
snapsAligned
|
|
2068
|
+
};
|
|
2069
|
+
return self;
|
|
2070
|
+
}
|
|
2071
|
+
function SlideRegistry(containSnaps, containScroll, scrollSnaps, scrollContainLimit, slidesToScroll, slideIndexes) {
|
|
2072
|
+
const {
|
|
2073
|
+
groupSlides
|
|
2074
|
+
} = slidesToScroll;
|
|
2075
|
+
const {
|
|
2076
|
+
min,
|
|
2077
|
+
max
|
|
2078
|
+
} = scrollContainLimit;
|
|
2079
|
+
const slideRegistry = createSlideRegistry();
|
|
2080
|
+
function createSlideRegistry() {
|
|
2081
|
+
const groupedSlideIndexes = groupSlides(slideIndexes);
|
|
2082
|
+
const doNotContain = !containSnaps || containScroll === 'keepSnaps';
|
|
2083
|
+
if (scrollSnaps.length === 1) return [slideIndexes];
|
|
2084
|
+
if (doNotContain) return groupedSlideIndexes;
|
|
2085
|
+
return groupedSlideIndexes.slice(min, max).map((group, index, groups) => {
|
|
2086
|
+
const isFirst = !index;
|
|
2087
|
+
const isLast = arrayIsLastIndex(groups, index);
|
|
2088
|
+
if (isFirst) {
|
|
2089
|
+
const range = arrayLast(groups[0]) + 1;
|
|
2090
|
+
return arrayFromNumber(range);
|
|
2091
|
+
}
|
|
2092
|
+
if (isLast) {
|
|
2093
|
+
const range = arrayLastIndex(slideIndexes) - arrayLast(groups)[0] + 1;
|
|
2094
|
+
return arrayFromNumber(range, arrayLast(groups)[0]);
|
|
2095
|
+
}
|
|
2096
|
+
return group;
|
|
2097
|
+
});
|
|
2098
|
+
}
|
|
2099
|
+
const self = {
|
|
2100
|
+
slideRegistry
|
|
2101
|
+
};
|
|
2102
|
+
return self;
|
|
2103
|
+
}
|
|
2104
|
+
function ScrollTarget(loop, scrollSnaps, contentSize, limit, targetVector) {
|
|
2105
|
+
const {
|
|
2106
|
+
reachedAny,
|
|
2107
|
+
removeOffset,
|
|
2108
|
+
constrain
|
|
2109
|
+
} = limit;
|
|
2110
|
+
function minDistance(distances) {
|
|
2111
|
+
return distances.concat().sort((a, b) => mathAbs(a) - mathAbs(b))[0];
|
|
2112
|
+
}
|
|
2113
|
+
function findTargetSnap(target) {
|
|
2114
|
+
const distance = loop ? removeOffset(target) : constrain(target);
|
|
2115
|
+
const ascDiffsToSnaps = scrollSnaps.map((snap, index) => ({
|
|
2116
|
+
diff: shortcut(snap - distance, 0),
|
|
2117
|
+
index
|
|
2118
|
+
})).sort((d1, d2) => mathAbs(d1.diff) - mathAbs(d2.diff));
|
|
2119
|
+
const {
|
|
2120
|
+
index
|
|
2121
|
+
} = ascDiffsToSnaps[0];
|
|
2122
|
+
return {
|
|
2123
|
+
index,
|
|
2124
|
+
distance
|
|
2125
|
+
};
|
|
2126
|
+
}
|
|
2127
|
+
function shortcut(target, direction) {
|
|
2128
|
+
const targets = [target, target + contentSize, target - contentSize];
|
|
2129
|
+
if (!loop) return target;
|
|
2130
|
+
if (!direction) return minDistance(targets);
|
|
2131
|
+
const matchingTargets = targets.filter(t => mathSign(t) === direction);
|
|
2132
|
+
if (matchingTargets.length) return minDistance(matchingTargets);
|
|
2133
|
+
return arrayLast(targets) - contentSize;
|
|
2134
|
+
}
|
|
2135
|
+
function byIndex(index, direction) {
|
|
2136
|
+
const diffToSnap = scrollSnaps[index] - targetVector.get();
|
|
2137
|
+
const distance = shortcut(diffToSnap, direction);
|
|
2138
|
+
return {
|
|
2139
|
+
index,
|
|
2140
|
+
distance
|
|
2141
|
+
};
|
|
2142
|
+
}
|
|
2143
|
+
function byDistance(distance, snap) {
|
|
2144
|
+
const target = targetVector.get() + distance;
|
|
2145
|
+
const {
|
|
2146
|
+
index,
|
|
2147
|
+
distance: targetSnapDistance
|
|
2148
|
+
} = findTargetSnap(target);
|
|
2149
|
+
const reachedBound = !loop && reachedAny(target);
|
|
2150
|
+
if (!snap || reachedBound) return {
|
|
2151
|
+
index,
|
|
2152
|
+
distance
|
|
2153
|
+
};
|
|
2154
|
+
const diffToSnap = scrollSnaps[index] - targetSnapDistance;
|
|
2155
|
+
const snapDistance = distance + shortcut(diffToSnap, 0);
|
|
2156
|
+
return {
|
|
2157
|
+
index,
|
|
2158
|
+
distance: snapDistance
|
|
2159
|
+
};
|
|
2160
|
+
}
|
|
2161
|
+
const self = {
|
|
2162
|
+
byDistance,
|
|
2163
|
+
byIndex,
|
|
2164
|
+
shortcut
|
|
2165
|
+
};
|
|
2166
|
+
return self;
|
|
2167
|
+
}
|
|
2168
|
+
function ScrollTo(animation, indexCurrent, indexPrevious, scrollBody, scrollTarget, targetVector, eventHandler) {
|
|
2169
|
+
function scrollTo(target) {
|
|
2170
|
+
const distanceDiff = target.distance;
|
|
2171
|
+
const indexDiff = target.index !== indexCurrent.get();
|
|
2172
|
+
targetVector.add(distanceDiff);
|
|
2173
|
+
if (distanceDiff) {
|
|
2174
|
+
if (scrollBody.duration()) {
|
|
2175
|
+
animation.start();
|
|
2176
|
+
} else {
|
|
2177
|
+
animation.update();
|
|
2178
|
+
animation.render(1);
|
|
2179
|
+
animation.update();
|
|
2180
|
+
}
|
|
2181
|
+
}
|
|
2182
|
+
if (indexDiff) {
|
|
2183
|
+
indexPrevious.set(indexCurrent.get());
|
|
2184
|
+
indexCurrent.set(target.index);
|
|
2185
|
+
eventHandler.emit('select');
|
|
2186
|
+
}
|
|
2187
|
+
}
|
|
2188
|
+
function distance(n, snap) {
|
|
2189
|
+
const target = scrollTarget.byDistance(n, snap);
|
|
2190
|
+
scrollTo(target);
|
|
2191
|
+
}
|
|
2192
|
+
function index(n, direction) {
|
|
2193
|
+
const targetIndex = indexCurrent.clone().set(n);
|
|
2194
|
+
const target = scrollTarget.byIndex(targetIndex.get(), direction);
|
|
2195
|
+
scrollTo(target);
|
|
2196
|
+
}
|
|
2197
|
+
const self = {
|
|
2198
|
+
distance,
|
|
2199
|
+
index
|
|
2200
|
+
};
|
|
2201
|
+
return self;
|
|
2202
|
+
}
|
|
2203
|
+
function SlideFocus(root, slides, slideRegistry, scrollTo, scrollBody, eventStore, eventHandler, watchFocus) {
|
|
2204
|
+
const focusListenerOptions = {
|
|
2205
|
+
passive: true,
|
|
2206
|
+
capture: true
|
|
2207
|
+
};
|
|
2208
|
+
let lastTabPressTime = 0;
|
|
2209
|
+
function init(emblaApi) {
|
|
2210
|
+
if (!watchFocus) return;
|
|
2211
|
+
function defaultCallback(index) {
|
|
2212
|
+
const nowTime = new Date().getTime();
|
|
2213
|
+
const diffTime = nowTime - lastTabPressTime;
|
|
2214
|
+
if (diffTime > 10) return;
|
|
2215
|
+
eventHandler.emit('slideFocusStart');
|
|
2216
|
+
root.scrollLeft = 0;
|
|
2217
|
+
const group = slideRegistry.findIndex(group => group.includes(index));
|
|
2218
|
+
if (!isNumber$1(group)) return;
|
|
2219
|
+
scrollBody.useDuration(0);
|
|
2220
|
+
scrollTo.index(group, 0);
|
|
2221
|
+
eventHandler.emit('slideFocus');
|
|
2222
|
+
}
|
|
2223
|
+
eventStore.add(document, 'keydown', registerTabPress, false);
|
|
2224
|
+
slides.forEach((slide, slideIndex) => {
|
|
2225
|
+
eventStore.add(slide, 'focus', evt => {
|
|
2226
|
+
if (isBoolean(watchFocus) || watchFocus(emblaApi, evt)) {
|
|
2227
|
+
defaultCallback(slideIndex);
|
|
2228
|
+
}
|
|
2229
|
+
}, focusListenerOptions);
|
|
2230
|
+
});
|
|
2231
|
+
}
|
|
2232
|
+
function registerTabPress(event) {
|
|
2233
|
+
if (event.code === 'Tab') lastTabPressTime = new Date().getTime();
|
|
2234
|
+
}
|
|
2235
|
+
const self = {
|
|
2236
|
+
init
|
|
2237
|
+
};
|
|
2238
|
+
return self;
|
|
2239
|
+
}
|
|
2240
|
+
function Vector1D(initialValue) {
|
|
2241
|
+
let value = initialValue;
|
|
2242
|
+
function get() {
|
|
2243
|
+
return value;
|
|
2244
|
+
}
|
|
2245
|
+
function set(n) {
|
|
2246
|
+
value = normalizeInput(n);
|
|
2247
|
+
}
|
|
2248
|
+
function add(n) {
|
|
2249
|
+
value += normalizeInput(n);
|
|
2250
|
+
}
|
|
2251
|
+
function subtract(n) {
|
|
2252
|
+
value -= normalizeInput(n);
|
|
2253
|
+
}
|
|
2254
|
+
function normalizeInput(n) {
|
|
2255
|
+
return isNumber$1(n) ? n : n.get();
|
|
2256
|
+
}
|
|
2257
|
+
const self = {
|
|
2258
|
+
get,
|
|
2259
|
+
set,
|
|
2260
|
+
add,
|
|
2261
|
+
subtract
|
|
2262
|
+
};
|
|
2263
|
+
return self;
|
|
2264
|
+
}
|
|
2265
|
+
function Translate(axis, container) {
|
|
2266
|
+
const translate = axis.scroll === 'x' ? x : y;
|
|
2267
|
+
const containerStyle = container.style;
|
|
2268
|
+
let previousTarget = null;
|
|
2269
|
+
let disabled = false;
|
|
2270
|
+
function x(n) {
|
|
2271
|
+
return `translate3d(${n}px,0px,0px)`;
|
|
2272
|
+
}
|
|
2273
|
+
function y(n) {
|
|
2274
|
+
return `translate3d(0px,${n}px,0px)`;
|
|
2275
|
+
}
|
|
2276
|
+
function to(target) {
|
|
2277
|
+
if (disabled) return;
|
|
2278
|
+
const newTarget = roundToTwoDecimals(axis.direction(target));
|
|
2279
|
+
if (newTarget === previousTarget) return;
|
|
2280
|
+
containerStyle.transform = translate(newTarget);
|
|
2281
|
+
previousTarget = newTarget;
|
|
2282
|
+
}
|
|
2283
|
+
function toggleActive(active) {
|
|
2284
|
+
disabled = !active;
|
|
2285
|
+
}
|
|
2286
|
+
function clear() {
|
|
2287
|
+
if (disabled) return;
|
|
2288
|
+
containerStyle.transform = '';
|
|
2289
|
+
if (!container.getAttribute('style')) container.removeAttribute('style');
|
|
2290
|
+
}
|
|
2291
|
+
const self = {
|
|
2292
|
+
clear,
|
|
2293
|
+
to,
|
|
2294
|
+
toggleActive
|
|
2295
|
+
};
|
|
2296
|
+
return self;
|
|
2297
|
+
}
|
|
2298
|
+
function SlideLooper(axis, viewSize, contentSize, slideSizes, slideSizesWithGaps, snaps, scrollSnaps, location, slides) {
|
|
2299
|
+
const roundingSafety = 0.5;
|
|
2300
|
+
const ascItems = arrayKeys(slideSizesWithGaps);
|
|
2301
|
+
const descItems = arrayKeys(slideSizesWithGaps).reverse();
|
|
2302
|
+
const loopPoints = startPoints().concat(endPoints());
|
|
2303
|
+
function removeSlideSizes(indexes, from) {
|
|
2304
|
+
return indexes.reduce((a, i) => {
|
|
2305
|
+
return a - slideSizesWithGaps[i];
|
|
2306
|
+
}, from);
|
|
2307
|
+
}
|
|
2308
|
+
function slidesInGap(indexes, gap) {
|
|
2309
|
+
return indexes.reduce((a, i) => {
|
|
2310
|
+
const remainingGap = removeSlideSizes(a, gap);
|
|
2311
|
+
return remainingGap > 0 ? a.concat([i]) : a;
|
|
2312
|
+
}, []);
|
|
2313
|
+
}
|
|
2314
|
+
function findSlideBounds(offset) {
|
|
2315
|
+
return snaps.map((snap, index) => ({
|
|
2316
|
+
start: snap - slideSizes[index] + roundingSafety + offset,
|
|
2317
|
+
end: snap + viewSize - roundingSafety + offset
|
|
2318
|
+
}));
|
|
2319
|
+
}
|
|
2320
|
+
function findLoopPoints(indexes, offset, isEndEdge) {
|
|
2321
|
+
const slideBounds = findSlideBounds(offset);
|
|
2322
|
+
return indexes.map(index => {
|
|
2323
|
+
const initial = isEndEdge ? 0 : -contentSize;
|
|
2324
|
+
const altered = isEndEdge ? contentSize : 0;
|
|
2325
|
+
const boundEdge = isEndEdge ? 'end' : 'start';
|
|
2326
|
+
const loopPoint = slideBounds[index][boundEdge];
|
|
2327
|
+
return {
|
|
2328
|
+
index,
|
|
2329
|
+
loopPoint,
|
|
2330
|
+
slideLocation: Vector1D(-1),
|
|
2331
|
+
translate: Translate(axis, slides[index]),
|
|
2332
|
+
target: () => location.get() > loopPoint ? initial : altered
|
|
2333
|
+
};
|
|
2334
|
+
});
|
|
2335
|
+
}
|
|
2336
|
+
function startPoints() {
|
|
2337
|
+
const gap = scrollSnaps[0];
|
|
2338
|
+
const indexes = slidesInGap(descItems, gap);
|
|
2339
|
+
return findLoopPoints(indexes, contentSize, false);
|
|
2340
|
+
}
|
|
2341
|
+
function endPoints() {
|
|
2342
|
+
const gap = viewSize - scrollSnaps[0] - 1;
|
|
2343
|
+
const indexes = slidesInGap(ascItems, gap);
|
|
2344
|
+
return findLoopPoints(indexes, -contentSize, true);
|
|
2345
|
+
}
|
|
2346
|
+
function canLoop() {
|
|
2347
|
+
return loopPoints.every(({
|
|
2348
|
+
index
|
|
2349
|
+
}) => {
|
|
2350
|
+
const otherIndexes = ascItems.filter(i => i !== index);
|
|
2351
|
+
return removeSlideSizes(otherIndexes, viewSize) <= 0.1;
|
|
2352
|
+
});
|
|
2353
|
+
}
|
|
2354
|
+
function loop() {
|
|
2355
|
+
loopPoints.forEach(loopPoint => {
|
|
2356
|
+
const {
|
|
2357
|
+
target,
|
|
2358
|
+
translate,
|
|
2359
|
+
slideLocation
|
|
2360
|
+
} = loopPoint;
|
|
2361
|
+
const shiftLocation = target();
|
|
2362
|
+
if (shiftLocation === slideLocation.get()) return;
|
|
2363
|
+
translate.to(shiftLocation);
|
|
2364
|
+
slideLocation.set(shiftLocation);
|
|
2365
|
+
});
|
|
2366
|
+
}
|
|
2367
|
+
function clear() {
|
|
2368
|
+
loopPoints.forEach(loopPoint => loopPoint.translate.clear());
|
|
2369
|
+
}
|
|
2370
|
+
const self = {
|
|
2371
|
+
canLoop,
|
|
2372
|
+
clear,
|
|
2373
|
+
loop,
|
|
2374
|
+
loopPoints
|
|
2375
|
+
};
|
|
2376
|
+
return self;
|
|
2377
|
+
}
|
|
2378
|
+
function SlidesHandler(container, eventHandler, watchSlides) {
|
|
2379
|
+
let mutationObserver;
|
|
2380
|
+
let destroyed = false;
|
|
2381
|
+
function init(emblaApi) {
|
|
2382
|
+
if (!watchSlides) return;
|
|
2383
|
+
function defaultCallback(mutations) {
|
|
2384
|
+
for (const mutation of mutations) {
|
|
2385
|
+
if (mutation.type === 'childList') {
|
|
2386
|
+
emblaApi.reInit();
|
|
2387
|
+
eventHandler.emit('slidesChanged');
|
|
2388
|
+
break;
|
|
2389
|
+
}
|
|
2390
|
+
}
|
|
2391
|
+
}
|
|
2392
|
+
mutationObserver = new MutationObserver(mutations => {
|
|
2393
|
+
if (destroyed) return;
|
|
2394
|
+
if (isBoolean(watchSlides) || watchSlides(emblaApi, mutations)) {
|
|
2395
|
+
defaultCallback(mutations);
|
|
2396
|
+
}
|
|
2397
|
+
});
|
|
2398
|
+
mutationObserver.observe(container, {
|
|
2399
|
+
childList: true
|
|
2400
|
+
});
|
|
2401
|
+
}
|
|
2402
|
+
function destroy() {
|
|
2403
|
+
if (mutationObserver) mutationObserver.disconnect();
|
|
2404
|
+
destroyed = true;
|
|
2405
|
+
}
|
|
2406
|
+
const self = {
|
|
2407
|
+
init,
|
|
2408
|
+
destroy
|
|
2409
|
+
};
|
|
2410
|
+
return self;
|
|
2411
|
+
}
|
|
2412
|
+
function SlidesInView(container, slides, eventHandler, threshold) {
|
|
2413
|
+
const intersectionEntryMap = {};
|
|
2414
|
+
let inViewCache = null;
|
|
2415
|
+
let notInViewCache = null;
|
|
2416
|
+
let intersectionObserver;
|
|
2417
|
+
let destroyed = false;
|
|
2418
|
+
function init() {
|
|
2419
|
+
intersectionObserver = new IntersectionObserver(entries => {
|
|
2420
|
+
if (destroyed) return;
|
|
2421
|
+
entries.forEach(entry => {
|
|
2422
|
+
const index = slides.indexOf(entry.target);
|
|
2423
|
+
intersectionEntryMap[index] = entry;
|
|
2424
|
+
});
|
|
2425
|
+
inViewCache = null;
|
|
2426
|
+
notInViewCache = null;
|
|
2427
|
+
eventHandler.emit('slidesInView');
|
|
2428
|
+
}, {
|
|
2429
|
+
root: container.parentElement,
|
|
2430
|
+
threshold
|
|
2431
|
+
});
|
|
2432
|
+
slides.forEach(slide => intersectionObserver.observe(slide));
|
|
2433
|
+
}
|
|
2434
|
+
function destroy() {
|
|
2435
|
+
if (intersectionObserver) intersectionObserver.disconnect();
|
|
2436
|
+
destroyed = true;
|
|
2437
|
+
}
|
|
2438
|
+
function createInViewList(inView) {
|
|
2439
|
+
return objectKeys(intersectionEntryMap).reduce((list, slideIndex) => {
|
|
2440
|
+
const index = parseInt(slideIndex);
|
|
2441
|
+
const {
|
|
2442
|
+
isIntersecting
|
|
2443
|
+
} = intersectionEntryMap[index];
|
|
2444
|
+
const inViewMatch = inView && isIntersecting;
|
|
2445
|
+
const notInViewMatch = !inView && !isIntersecting;
|
|
2446
|
+
if (inViewMatch || notInViewMatch) list.push(index);
|
|
2447
|
+
return list;
|
|
2448
|
+
}, []);
|
|
2449
|
+
}
|
|
2450
|
+
function get(inView = true) {
|
|
2451
|
+
if (inView && inViewCache) return inViewCache;
|
|
2452
|
+
if (!inView && notInViewCache) return notInViewCache;
|
|
2453
|
+
const slideIndexes = createInViewList(inView);
|
|
2454
|
+
if (inView) inViewCache = slideIndexes;
|
|
2455
|
+
if (!inView) notInViewCache = slideIndexes;
|
|
2456
|
+
return slideIndexes;
|
|
2457
|
+
}
|
|
2458
|
+
const self = {
|
|
2459
|
+
init,
|
|
2460
|
+
destroy,
|
|
2461
|
+
get
|
|
2462
|
+
};
|
|
2463
|
+
return self;
|
|
2464
|
+
}
|
|
2465
|
+
function SlideSizes(axis, containerRect, slideRects, slides, readEdgeGap, ownerWindow) {
|
|
2466
|
+
const {
|
|
2467
|
+
measureSize,
|
|
2468
|
+
startEdge,
|
|
2469
|
+
endEdge
|
|
2470
|
+
} = axis;
|
|
2471
|
+
const withEdgeGap = slideRects[0] && readEdgeGap;
|
|
2472
|
+
const startGap = measureStartGap();
|
|
2473
|
+
const endGap = measureEndGap();
|
|
2474
|
+
const slideSizes = slideRects.map(measureSize);
|
|
2475
|
+
const slideSizesWithGaps = measureWithGaps();
|
|
2476
|
+
function measureStartGap() {
|
|
2477
|
+
if (!withEdgeGap) return 0;
|
|
2478
|
+
const slideRect = slideRects[0];
|
|
2479
|
+
return mathAbs(containerRect[startEdge] - slideRect[startEdge]);
|
|
2480
|
+
}
|
|
2481
|
+
function measureEndGap() {
|
|
2482
|
+
if (!withEdgeGap) return 0;
|
|
2483
|
+
const style = ownerWindow.getComputedStyle(arrayLast(slides));
|
|
2484
|
+
return parseFloat(style.getPropertyValue(`margin-${endEdge}`));
|
|
2485
|
+
}
|
|
2486
|
+
function measureWithGaps() {
|
|
2487
|
+
return slideRects.map((rect, index, rects) => {
|
|
2488
|
+
const isFirst = !index;
|
|
2489
|
+
const isLast = arrayIsLastIndex(rects, index);
|
|
2490
|
+
if (isFirst) return slideSizes[index] + startGap;
|
|
2491
|
+
if (isLast) return slideSizes[index] + endGap;
|
|
2492
|
+
return rects[index + 1][startEdge] - rect[startEdge];
|
|
2493
|
+
}).map(mathAbs);
|
|
2494
|
+
}
|
|
2495
|
+
const self = {
|
|
2496
|
+
slideSizes,
|
|
2497
|
+
slideSizesWithGaps,
|
|
2498
|
+
startGap,
|
|
2499
|
+
endGap
|
|
2500
|
+
};
|
|
2501
|
+
return self;
|
|
2502
|
+
}
|
|
2503
|
+
function SlidesToScroll(axis, viewSize, slidesToScroll, loop, containerRect, slideRects, startGap, endGap, pixelTolerance) {
|
|
2504
|
+
const {
|
|
2505
|
+
startEdge,
|
|
2506
|
+
endEdge,
|
|
2507
|
+
direction
|
|
2508
|
+
} = axis;
|
|
2509
|
+
const groupByNumber = isNumber$1(slidesToScroll);
|
|
2510
|
+
function byNumber(array, groupSize) {
|
|
2511
|
+
return arrayKeys(array).filter(i => i % groupSize === 0).map(i => array.slice(i, i + groupSize));
|
|
2512
|
+
}
|
|
2513
|
+
function bySize(array) {
|
|
2514
|
+
if (!array.length) return [];
|
|
2515
|
+
return arrayKeys(array).reduce((groups, rectB, index) => {
|
|
2516
|
+
const rectA = arrayLast(groups) || 0;
|
|
2517
|
+
const isFirst = rectA === 0;
|
|
2518
|
+
const isLast = rectB === arrayLastIndex(array);
|
|
2519
|
+
const edgeA = containerRect[startEdge] - slideRects[rectA][startEdge];
|
|
2520
|
+
const edgeB = containerRect[startEdge] - slideRects[rectB][endEdge];
|
|
2521
|
+
const gapA = !loop && isFirst ? direction(startGap) : 0;
|
|
2522
|
+
const gapB = !loop && isLast ? direction(endGap) : 0;
|
|
2523
|
+
const chunkSize = mathAbs(edgeB - gapB - (edgeA + gapA));
|
|
2524
|
+
if (index && chunkSize > viewSize + pixelTolerance) groups.push(rectB);
|
|
2525
|
+
if (isLast) groups.push(array.length);
|
|
2526
|
+
return groups;
|
|
2527
|
+
}, []).map((currentSize, index, groups) => {
|
|
2528
|
+
const previousSize = Math.max(groups[index - 1] || 0);
|
|
2529
|
+
return array.slice(previousSize, currentSize);
|
|
2530
|
+
});
|
|
2531
|
+
}
|
|
2532
|
+
function groupSlides(array) {
|
|
2533
|
+
return groupByNumber ? byNumber(array, slidesToScroll) : bySize(array);
|
|
2534
|
+
}
|
|
2535
|
+
const self = {
|
|
2536
|
+
groupSlides
|
|
2537
|
+
};
|
|
2538
|
+
return self;
|
|
2539
|
+
}
|
|
2540
|
+
function Engine(root, container, slides, ownerDocument, ownerWindow, options, eventHandler) {
|
|
2541
|
+
// Options
|
|
2542
|
+
const {
|
|
2543
|
+
align,
|
|
2544
|
+
axis: scrollAxis,
|
|
2545
|
+
direction,
|
|
2546
|
+
startIndex,
|
|
2547
|
+
loop,
|
|
2548
|
+
duration,
|
|
2549
|
+
dragFree,
|
|
2550
|
+
dragThreshold,
|
|
2551
|
+
inViewThreshold,
|
|
2552
|
+
slidesToScroll: groupSlides,
|
|
2553
|
+
skipSnaps,
|
|
2554
|
+
containScroll,
|
|
2555
|
+
watchResize,
|
|
2556
|
+
watchSlides,
|
|
2557
|
+
watchDrag,
|
|
2558
|
+
watchFocus
|
|
2559
|
+
} = options;
|
|
2560
|
+
// Measurements
|
|
2561
|
+
const pixelTolerance = 2;
|
|
2562
|
+
const nodeRects = NodeRects();
|
|
2563
|
+
const containerRect = nodeRects.measure(container);
|
|
2564
|
+
const slideRects = slides.map(nodeRects.measure);
|
|
2565
|
+
const axis = Axis(scrollAxis, direction);
|
|
2566
|
+
const viewSize = axis.measureSize(containerRect);
|
|
2567
|
+
const percentOfView = PercentOfView(viewSize);
|
|
2568
|
+
const alignment = Alignment(align, viewSize);
|
|
2569
|
+
const containSnaps = !loop && !!containScroll;
|
|
2570
|
+
const readEdgeGap = loop || !!containScroll;
|
|
2571
|
+
const {
|
|
2572
|
+
slideSizes,
|
|
2573
|
+
slideSizesWithGaps,
|
|
2574
|
+
startGap,
|
|
2575
|
+
endGap
|
|
2576
|
+
} = SlideSizes(axis, containerRect, slideRects, slides, readEdgeGap, ownerWindow);
|
|
2577
|
+
const slidesToScroll = SlidesToScroll(axis, viewSize, groupSlides, loop, containerRect, slideRects, startGap, endGap, pixelTolerance);
|
|
2578
|
+
const {
|
|
2579
|
+
snaps,
|
|
2580
|
+
snapsAligned
|
|
2581
|
+
} = ScrollSnaps(axis, alignment, containerRect, slideRects, slidesToScroll);
|
|
2582
|
+
const contentSize = -arrayLast(snaps) + arrayLast(slideSizesWithGaps);
|
|
2583
|
+
const {
|
|
2584
|
+
snapsContained,
|
|
2585
|
+
scrollContainLimit
|
|
2586
|
+
} = ScrollContain(viewSize, contentSize, snapsAligned, containScroll, pixelTolerance);
|
|
2587
|
+
const scrollSnaps = containSnaps ? snapsContained : snapsAligned;
|
|
2588
|
+
const {
|
|
2589
|
+
limit
|
|
2590
|
+
} = ScrollLimit(contentSize, scrollSnaps, loop);
|
|
2591
|
+
// Indexes
|
|
2592
|
+
const index = Counter(arrayLastIndex(scrollSnaps), startIndex, loop);
|
|
2593
|
+
const indexPrevious = index.clone();
|
|
2594
|
+
const slideIndexes = arrayKeys(slides);
|
|
2595
|
+
// Animation
|
|
2596
|
+
const update = ({
|
|
2597
|
+
dragHandler,
|
|
2598
|
+
scrollBody,
|
|
2599
|
+
scrollBounds,
|
|
2600
|
+
options: {
|
|
2601
|
+
loop
|
|
2602
|
+
}
|
|
2603
|
+
}) => {
|
|
2604
|
+
if (!loop) scrollBounds.constrain(dragHandler.pointerDown());
|
|
2605
|
+
scrollBody.seek();
|
|
2606
|
+
};
|
|
2607
|
+
const render = ({
|
|
2608
|
+
scrollBody,
|
|
2609
|
+
translate,
|
|
2610
|
+
location,
|
|
2611
|
+
offsetLocation,
|
|
2612
|
+
previousLocation,
|
|
2613
|
+
scrollLooper,
|
|
2614
|
+
slideLooper,
|
|
2615
|
+
dragHandler,
|
|
2616
|
+
animation,
|
|
2617
|
+
eventHandler,
|
|
2618
|
+
scrollBounds,
|
|
2619
|
+
options: {
|
|
2620
|
+
loop
|
|
2621
|
+
}
|
|
2622
|
+
}, alpha) => {
|
|
2623
|
+
const shouldSettle = scrollBody.settled();
|
|
2624
|
+
const withinBounds = !scrollBounds.shouldConstrain();
|
|
2625
|
+
const hasSettled = loop ? shouldSettle : shouldSettle && withinBounds;
|
|
2626
|
+
const hasSettledAndIdle = hasSettled && !dragHandler.pointerDown();
|
|
2627
|
+
if (hasSettledAndIdle) animation.stop();
|
|
2628
|
+
const interpolatedLocation = location.get() * alpha + previousLocation.get() * (1 - alpha);
|
|
2629
|
+
offsetLocation.set(interpolatedLocation);
|
|
2630
|
+
if (loop) {
|
|
2631
|
+
scrollLooper.loop(scrollBody.direction());
|
|
2632
|
+
slideLooper.loop();
|
|
2633
|
+
}
|
|
2634
|
+
translate.to(offsetLocation.get());
|
|
2635
|
+
if (hasSettledAndIdle) eventHandler.emit('settle');
|
|
2636
|
+
if (!hasSettled) eventHandler.emit('scroll');
|
|
2637
|
+
};
|
|
2638
|
+
const animation = Animations(ownerDocument, ownerWindow, () => update(engine), alpha => render(engine, alpha));
|
|
2639
|
+
// Shared
|
|
2640
|
+
const friction = 0.68;
|
|
2641
|
+
const startLocation = scrollSnaps[index.get()];
|
|
2642
|
+
const location = Vector1D(startLocation);
|
|
2643
|
+
const previousLocation = Vector1D(startLocation);
|
|
2644
|
+
const offsetLocation = Vector1D(startLocation);
|
|
2645
|
+
const target = Vector1D(startLocation);
|
|
2646
|
+
const scrollBody = ScrollBody(location, offsetLocation, previousLocation, target, duration, friction);
|
|
2647
|
+
const scrollTarget = ScrollTarget(loop, scrollSnaps, contentSize, limit, target);
|
|
2648
|
+
const scrollTo = ScrollTo(animation, index, indexPrevious, scrollBody, scrollTarget, target, eventHandler);
|
|
2649
|
+
const scrollProgress = ScrollProgress(limit);
|
|
2650
|
+
const eventStore = EventStore();
|
|
2651
|
+
const slidesInView = SlidesInView(container, slides, eventHandler, inViewThreshold);
|
|
2652
|
+
const {
|
|
2653
|
+
slideRegistry
|
|
2654
|
+
} = SlideRegistry(containSnaps, containScroll, scrollSnaps, scrollContainLimit, slidesToScroll, slideIndexes);
|
|
2655
|
+
const slideFocus = SlideFocus(root, slides, slideRegistry, scrollTo, scrollBody, eventStore, eventHandler, watchFocus);
|
|
2656
|
+
// Engine
|
|
2657
|
+
const engine = {
|
|
2658
|
+
ownerDocument,
|
|
2659
|
+
ownerWindow,
|
|
2660
|
+
eventHandler,
|
|
2661
|
+
containerRect,
|
|
2662
|
+
slideRects,
|
|
2663
|
+
animation,
|
|
2664
|
+
axis,
|
|
2665
|
+
dragHandler: DragHandler(axis, root, ownerDocument, ownerWindow, target, DragTracker(axis, ownerWindow), location, animation, scrollTo, scrollBody, scrollTarget, index, eventHandler, percentOfView, dragFree, dragThreshold, skipSnaps, friction, watchDrag),
|
|
2666
|
+
eventStore,
|
|
2667
|
+
percentOfView,
|
|
2668
|
+
index,
|
|
2669
|
+
indexPrevious,
|
|
2670
|
+
limit,
|
|
2671
|
+
location,
|
|
2672
|
+
offsetLocation,
|
|
2673
|
+
previousLocation,
|
|
2674
|
+
options,
|
|
2675
|
+
resizeHandler: ResizeHandler(container, eventHandler, ownerWindow, slides, axis, watchResize, nodeRects),
|
|
2676
|
+
scrollBody,
|
|
2677
|
+
scrollBounds: ScrollBounds(limit, offsetLocation, target, scrollBody, percentOfView),
|
|
2678
|
+
scrollLooper: ScrollLooper(contentSize, limit, offsetLocation, [location, offsetLocation, previousLocation, target]),
|
|
2679
|
+
scrollProgress,
|
|
2680
|
+
scrollSnapList: scrollSnaps.map(scrollProgress.get),
|
|
2681
|
+
scrollSnaps,
|
|
2682
|
+
scrollTarget,
|
|
2683
|
+
scrollTo,
|
|
2684
|
+
slideLooper: SlideLooper(axis, viewSize, contentSize, slideSizes, slideSizesWithGaps, snaps, scrollSnaps, offsetLocation, slides),
|
|
2685
|
+
slideFocus,
|
|
2686
|
+
slidesHandler: SlidesHandler(container, eventHandler, watchSlides),
|
|
2687
|
+
slidesInView,
|
|
2688
|
+
slideIndexes,
|
|
2689
|
+
slideRegistry,
|
|
2690
|
+
slidesToScroll,
|
|
2691
|
+
target,
|
|
2692
|
+
translate: Translate(axis, container)
|
|
2693
|
+
};
|
|
2694
|
+
return engine;
|
|
2695
|
+
}
|
|
2696
|
+
function EventHandler() {
|
|
2697
|
+
let listeners = {};
|
|
2698
|
+
let api;
|
|
2699
|
+
function init(emblaApi) {
|
|
2700
|
+
api = emblaApi;
|
|
2701
|
+
}
|
|
2702
|
+
function getListeners(evt) {
|
|
2703
|
+
return listeners[evt] || [];
|
|
2704
|
+
}
|
|
2705
|
+
function emit(evt) {
|
|
2706
|
+
getListeners(evt).forEach(e => e(api, evt));
|
|
2707
|
+
return self;
|
|
2708
|
+
}
|
|
2709
|
+
function on(evt, cb) {
|
|
2710
|
+
listeners[evt] = getListeners(evt).concat([cb]);
|
|
2711
|
+
return self;
|
|
2712
|
+
}
|
|
2713
|
+
function off(evt, cb) {
|
|
2714
|
+
listeners[evt] = getListeners(evt).filter(e => e !== cb);
|
|
2715
|
+
return self;
|
|
2716
|
+
}
|
|
2717
|
+
function clear() {
|
|
2718
|
+
listeners = {};
|
|
2719
|
+
}
|
|
2720
|
+
const self = {
|
|
2721
|
+
init,
|
|
2722
|
+
emit,
|
|
2723
|
+
off,
|
|
2724
|
+
on,
|
|
2725
|
+
clear
|
|
2726
|
+
};
|
|
2727
|
+
return self;
|
|
2728
|
+
}
|
|
2729
|
+
const defaultOptions = {
|
|
2730
|
+
align: 'center',
|
|
2731
|
+
axis: 'x',
|
|
2732
|
+
container: null,
|
|
2733
|
+
slides: null,
|
|
2734
|
+
containScroll: 'trimSnaps',
|
|
2735
|
+
direction: 'ltr',
|
|
2736
|
+
slidesToScroll: 1,
|
|
2737
|
+
inViewThreshold: 0,
|
|
2738
|
+
breakpoints: {},
|
|
2739
|
+
dragFree: false,
|
|
2740
|
+
dragThreshold: 10,
|
|
2741
|
+
loop: false,
|
|
2742
|
+
skipSnaps: false,
|
|
2743
|
+
duration: 25,
|
|
2744
|
+
startIndex: 0,
|
|
2745
|
+
active: true,
|
|
2746
|
+
watchDrag: true,
|
|
2747
|
+
watchResize: true,
|
|
2748
|
+
watchSlides: true,
|
|
2749
|
+
watchFocus: true
|
|
2750
|
+
};
|
|
2751
|
+
function OptionsHandler(ownerWindow) {
|
|
2752
|
+
function mergeOptions(optionsA, optionsB) {
|
|
2753
|
+
return objectsMergeDeep(optionsA, optionsB || {});
|
|
2754
|
+
}
|
|
2755
|
+
function optionsAtMedia(options) {
|
|
2756
|
+
const optionsAtMedia = options.breakpoints || {};
|
|
2757
|
+
const matchedMediaOptions = objectKeys(optionsAtMedia).filter(media => ownerWindow.matchMedia(media).matches).map(media => optionsAtMedia[media]).reduce((a, mediaOption) => mergeOptions(a, mediaOption), {});
|
|
2758
|
+
return mergeOptions(options, matchedMediaOptions);
|
|
2759
|
+
}
|
|
2760
|
+
function optionsMediaQueries(optionsList) {
|
|
2761
|
+
return optionsList.map(options => objectKeys(options.breakpoints || {})).reduce((acc, mediaQueries) => acc.concat(mediaQueries), []).map(ownerWindow.matchMedia);
|
|
2762
|
+
}
|
|
2763
|
+
const self = {
|
|
2764
|
+
mergeOptions,
|
|
2765
|
+
optionsAtMedia,
|
|
2766
|
+
optionsMediaQueries
|
|
2767
|
+
};
|
|
2768
|
+
return self;
|
|
2769
|
+
}
|
|
2770
|
+
function PluginsHandler(optionsHandler) {
|
|
2771
|
+
let activePlugins = [];
|
|
2772
|
+
function init(emblaApi, plugins) {
|
|
2773
|
+
activePlugins = plugins.filter(({
|
|
2774
|
+
options
|
|
2775
|
+
}) => optionsHandler.optionsAtMedia(options).active !== false);
|
|
2776
|
+
activePlugins.forEach(plugin => plugin.init(emblaApi, optionsHandler));
|
|
2777
|
+
return plugins.reduce((map, plugin) => Object.assign(map, {
|
|
2778
|
+
[plugin.name]: plugin
|
|
2779
|
+
}), {});
|
|
2780
|
+
}
|
|
2781
|
+
function destroy() {
|
|
2782
|
+
activePlugins = activePlugins.filter(plugin => plugin.destroy());
|
|
2783
|
+
}
|
|
2784
|
+
const self = {
|
|
2785
|
+
init,
|
|
2786
|
+
destroy
|
|
2787
|
+
};
|
|
2788
|
+
return self;
|
|
2789
|
+
}
|
|
2790
|
+
function EmblaCarousel(root, userOptions, userPlugins) {
|
|
2791
|
+
const ownerDocument = root.ownerDocument;
|
|
2792
|
+
const ownerWindow = ownerDocument.defaultView;
|
|
2793
|
+
const optionsHandler = OptionsHandler(ownerWindow);
|
|
2794
|
+
const pluginsHandler = PluginsHandler(optionsHandler);
|
|
2795
|
+
const mediaHandlers = EventStore();
|
|
2796
|
+
const eventHandler = EventHandler();
|
|
2797
|
+
const {
|
|
2798
|
+
mergeOptions,
|
|
2799
|
+
optionsAtMedia,
|
|
2800
|
+
optionsMediaQueries
|
|
2801
|
+
} = optionsHandler;
|
|
2802
|
+
const {
|
|
2803
|
+
on,
|
|
2804
|
+
off,
|
|
2805
|
+
emit
|
|
2806
|
+
} = eventHandler;
|
|
2807
|
+
const reInit = reActivate;
|
|
2808
|
+
let destroyed = false;
|
|
2809
|
+
let engine;
|
|
2810
|
+
let optionsBase = mergeOptions(defaultOptions, EmblaCarousel.globalOptions);
|
|
2811
|
+
let options = mergeOptions(optionsBase);
|
|
2812
|
+
let pluginList = [];
|
|
2813
|
+
let pluginApis;
|
|
2814
|
+
let container;
|
|
2815
|
+
let slides;
|
|
2816
|
+
function storeElements() {
|
|
2817
|
+
const {
|
|
2818
|
+
container: userContainer,
|
|
2819
|
+
slides: userSlides
|
|
2820
|
+
} = options;
|
|
2821
|
+
const customContainer = isString(userContainer) ? root.querySelector(userContainer) : userContainer;
|
|
2822
|
+
container = customContainer || root.children[0];
|
|
2823
|
+
const customSlides = isString(userSlides) ? container.querySelectorAll(userSlides) : userSlides;
|
|
2824
|
+
slides = [].slice.call(customSlides || container.children);
|
|
2825
|
+
}
|
|
2826
|
+
function createEngine(options) {
|
|
2827
|
+
const engine = Engine(root, container, slides, ownerDocument, ownerWindow, options, eventHandler);
|
|
2828
|
+
if (options.loop && !engine.slideLooper.canLoop()) {
|
|
2829
|
+
const optionsWithoutLoop = Object.assign({}, options, {
|
|
2830
|
+
loop: false
|
|
2831
|
+
});
|
|
2832
|
+
return createEngine(optionsWithoutLoop);
|
|
2833
|
+
}
|
|
2834
|
+
return engine;
|
|
2835
|
+
}
|
|
2836
|
+
function activate(withOptions, withPlugins) {
|
|
2837
|
+
if (destroyed) return;
|
|
2838
|
+
optionsBase = mergeOptions(optionsBase, withOptions);
|
|
2839
|
+
options = optionsAtMedia(optionsBase);
|
|
2840
|
+
pluginList = withPlugins || pluginList;
|
|
2841
|
+
storeElements();
|
|
2842
|
+
engine = createEngine(options);
|
|
2843
|
+
optionsMediaQueries([optionsBase, ...pluginList.map(({
|
|
2844
|
+
options
|
|
2845
|
+
}) => options)]).forEach(query => mediaHandlers.add(query, 'change', reActivate));
|
|
2846
|
+
if (!options.active) return;
|
|
2847
|
+
engine.translate.to(engine.location.get());
|
|
2848
|
+
engine.animation.init();
|
|
2849
|
+
engine.slidesInView.init();
|
|
2850
|
+
engine.slideFocus.init(self);
|
|
2851
|
+
engine.eventHandler.init(self);
|
|
2852
|
+
engine.resizeHandler.init(self);
|
|
2853
|
+
engine.slidesHandler.init(self);
|
|
2854
|
+
if (engine.options.loop) engine.slideLooper.loop();
|
|
2855
|
+
if (container.offsetParent && slides.length) engine.dragHandler.init(self);
|
|
2856
|
+
pluginApis = pluginsHandler.init(self, pluginList);
|
|
2857
|
+
}
|
|
2858
|
+
function reActivate(withOptions, withPlugins) {
|
|
2859
|
+
const startIndex = selectedScrollSnap();
|
|
2860
|
+
deActivate();
|
|
2861
|
+
activate(mergeOptions({
|
|
2862
|
+
startIndex
|
|
2863
|
+
}, withOptions), withPlugins);
|
|
2864
|
+
eventHandler.emit('reInit');
|
|
2865
|
+
}
|
|
2866
|
+
function deActivate() {
|
|
2867
|
+
engine.dragHandler.destroy();
|
|
2868
|
+
engine.eventStore.clear();
|
|
2869
|
+
engine.translate.clear();
|
|
2870
|
+
engine.slideLooper.clear();
|
|
2871
|
+
engine.resizeHandler.destroy();
|
|
2872
|
+
engine.slidesHandler.destroy();
|
|
2873
|
+
engine.slidesInView.destroy();
|
|
2874
|
+
engine.animation.destroy();
|
|
2875
|
+
pluginsHandler.destroy();
|
|
2876
|
+
mediaHandlers.clear();
|
|
2877
|
+
}
|
|
2878
|
+
function destroy() {
|
|
2879
|
+
if (destroyed) return;
|
|
2880
|
+
destroyed = true;
|
|
2881
|
+
mediaHandlers.clear();
|
|
2882
|
+
deActivate();
|
|
2883
|
+
eventHandler.emit('destroy');
|
|
2884
|
+
eventHandler.clear();
|
|
2885
|
+
}
|
|
2886
|
+
function scrollTo(index, jump, direction) {
|
|
2887
|
+
if (!options.active || destroyed) return;
|
|
2888
|
+
engine.scrollBody.useBaseFriction().useDuration(jump === true ? 0 : options.duration);
|
|
2889
|
+
engine.scrollTo.index(index, direction || 0);
|
|
2890
|
+
}
|
|
2891
|
+
function scrollNext(jump) {
|
|
2892
|
+
const next = engine.index.add(1).get();
|
|
2893
|
+
scrollTo(next, jump, -1);
|
|
2894
|
+
}
|
|
2895
|
+
function scrollPrev(jump) {
|
|
2896
|
+
const prev = engine.index.add(-1).get();
|
|
2897
|
+
scrollTo(prev, jump, 1);
|
|
2898
|
+
}
|
|
2899
|
+
function canScrollNext() {
|
|
2900
|
+
const next = engine.index.add(1).get();
|
|
2901
|
+
return next !== selectedScrollSnap();
|
|
2902
|
+
}
|
|
2903
|
+
function canScrollPrev() {
|
|
2904
|
+
const prev = engine.index.add(-1).get();
|
|
2905
|
+
return prev !== selectedScrollSnap();
|
|
2906
|
+
}
|
|
2907
|
+
function scrollSnapList() {
|
|
2908
|
+
return engine.scrollSnapList;
|
|
2909
|
+
}
|
|
2910
|
+
function scrollProgress() {
|
|
2911
|
+
return engine.scrollProgress.get(engine.offsetLocation.get());
|
|
2912
|
+
}
|
|
2913
|
+
function selectedScrollSnap() {
|
|
2914
|
+
return engine.index.get();
|
|
2915
|
+
}
|
|
2916
|
+
function previousScrollSnap() {
|
|
2917
|
+
return engine.indexPrevious.get();
|
|
2918
|
+
}
|
|
2919
|
+
function slidesInView() {
|
|
2920
|
+
return engine.slidesInView.get();
|
|
2921
|
+
}
|
|
2922
|
+
function slidesNotInView() {
|
|
2923
|
+
return engine.slidesInView.get(false);
|
|
2924
|
+
}
|
|
2925
|
+
function plugins() {
|
|
2926
|
+
return pluginApis;
|
|
2927
|
+
}
|
|
2928
|
+
function internalEngine() {
|
|
2929
|
+
return engine;
|
|
2930
|
+
}
|
|
2931
|
+
function rootNode() {
|
|
2932
|
+
return root;
|
|
2933
|
+
}
|
|
2934
|
+
function containerNode() {
|
|
2935
|
+
return container;
|
|
2936
|
+
}
|
|
2937
|
+
function slideNodes() {
|
|
2938
|
+
return slides;
|
|
2939
|
+
}
|
|
2940
|
+
const self = {
|
|
2941
|
+
canScrollNext,
|
|
2942
|
+
canScrollPrev,
|
|
2943
|
+
containerNode,
|
|
2944
|
+
internalEngine,
|
|
2945
|
+
destroy,
|
|
2946
|
+
off,
|
|
2947
|
+
on,
|
|
2948
|
+
emit,
|
|
2949
|
+
plugins,
|
|
2950
|
+
previousScrollSnap,
|
|
2951
|
+
reInit,
|
|
2952
|
+
rootNode,
|
|
2953
|
+
scrollNext,
|
|
2954
|
+
scrollPrev,
|
|
2955
|
+
scrollProgress,
|
|
2956
|
+
scrollSnapList,
|
|
2957
|
+
scrollTo,
|
|
2958
|
+
selectedScrollSnap,
|
|
2959
|
+
slideNodes,
|
|
2960
|
+
slidesInView,
|
|
2961
|
+
slidesNotInView
|
|
2962
|
+
};
|
|
2963
|
+
activate(userOptions, userPlugins);
|
|
2964
|
+
setTimeout(() => eventHandler.emit('init'), 0);
|
|
2965
|
+
return self;
|
|
2966
|
+
}
|
|
2967
|
+
EmblaCarousel.globalOptions = undefined;
|
|
2968
|
+
|
|
2969
|
+
function clampNumber(number, min, max) {
|
|
2970
|
+
return Math.min(Math.max(number, min), max);
|
|
2971
|
+
}
|
|
2972
|
+
function isNumber(value) {
|
|
2973
|
+
return typeof value === 'number' && !isNaN(value);
|
|
2974
|
+
}
|
|
2975
|
+
function Fade(userOptions = {}) {
|
|
2976
|
+
const fullOpacity = 1;
|
|
2977
|
+
const noOpacity = 0;
|
|
2978
|
+
const fadeFriction = 0.68;
|
|
2979
|
+
let emblaApi;
|
|
2980
|
+
let opacities = [];
|
|
2981
|
+
let fadeToNextDistance;
|
|
2982
|
+
let distanceFromPointerDown = 0;
|
|
2983
|
+
let fadeVelocity = 0;
|
|
2984
|
+
let progress = 0;
|
|
2985
|
+
let shouldFadePair = false;
|
|
2986
|
+
let defaultSettledBehaviour;
|
|
2987
|
+
let defaultProgressBehaviour;
|
|
2988
|
+
function init(emblaApiInstance) {
|
|
2989
|
+
emblaApi = emblaApiInstance;
|
|
2990
|
+
const selectedSnap = emblaApi.selectedScrollSnap();
|
|
2991
|
+
const {
|
|
2992
|
+
scrollBody,
|
|
2993
|
+
containerRect,
|
|
2994
|
+
axis
|
|
2995
|
+
} = emblaApi.internalEngine();
|
|
2996
|
+
const containerSize = axis.measureSize(containerRect);
|
|
2997
|
+
fadeToNextDistance = clampNumber(containerSize * 0.75, 200, 500);
|
|
2998
|
+
shouldFadePair = false;
|
|
2999
|
+
opacities = emblaApi.scrollSnapList().map((_, index) => index === selectedSnap ? fullOpacity : noOpacity);
|
|
3000
|
+
defaultSettledBehaviour = scrollBody.settled;
|
|
3001
|
+
defaultProgressBehaviour = emblaApi.scrollProgress;
|
|
3002
|
+
scrollBody.settled = settled;
|
|
3003
|
+
emblaApi.scrollProgress = scrollProgress;
|
|
3004
|
+
emblaApi.on('select', select).on('slideFocus', fadeToSelectedSnapInstantly).on('pointerDown', pointerDown).on('pointerUp', pointerUp);
|
|
3005
|
+
disableScroll();
|
|
3006
|
+
fadeToSelectedSnapInstantly();
|
|
3007
|
+
}
|
|
3008
|
+
function destroy() {
|
|
3009
|
+
const {
|
|
3010
|
+
scrollBody
|
|
3011
|
+
} = emblaApi.internalEngine();
|
|
3012
|
+
scrollBody.settled = defaultSettledBehaviour;
|
|
3013
|
+
emblaApi.scrollProgress = defaultProgressBehaviour;
|
|
3014
|
+
emblaApi.off('select', select).off('slideFocus', fadeToSelectedSnapInstantly).off('pointerDown', pointerDown).off('pointerUp', pointerUp);
|
|
3015
|
+
emblaApi.slideNodes().forEach(slideNode => {
|
|
3016
|
+
const slideStyle = slideNode.style;
|
|
3017
|
+
slideStyle.opacity = '';
|
|
3018
|
+
slideStyle.transform = '';
|
|
3019
|
+
slideStyle.pointerEvents = '';
|
|
3020
|
+
if (!slideNode.getAttribute('style')) slideNode.removeAttribute('style');
|
|
3021
|
+
});
|
|
3022
|
+
}
|
|
3023
|
+
function fadeToSelectedSnapInstantly() {
|
|
3024
|
+
const selectedSnap = emblaApi.selectedScrollSnap();
|
|
3025
|
+
setOpacities(selectedSnap, fullOpacity);
|
|
3026
|
+
}
|
|
3027
|
+
function pointerUp() {
|
|
3028
|
+
shouldFadePair = false;
|
|
3029
|
+
}
|
|
3030
|
+
function pointerDown() {
|
|
3031
|
+
shouldFadePair = false;
|
|
3032
|
+
distanceFromPointerDown = 0;
|
|
3033
|
+
fadeVelocity = 0;
|
|
3034
|
+
}
|
|
3035
|
+
function select() {
|
|
3036
|
+
const duration = emblaApi.internalEngine().scrollBody.duration();
|
|
3037
|
+
fadeVelocity = duration ? 0 : fullOpacity;
|
|
3038
|
+
shouldFadePair = true;
|
|
3039
|
+
if (!duration) fadeToSelectedSnapInstantly();
|
|
3040
|
+
}
|
|
3041
|
+
function getSlideTransform(position) {
|
|
3042
|
+
const {
|
|
3043
|
+
axis
|
|
3044
|
+
} = emblaApi.internalEngine();
|
|
3045
|
+
const translateAxis = axis.scroll.toUpperCase();
|
|
3046
|
+
return `translate${translateAxis}(${axis.direction(position)}px)`;
|
|
3047
|
+
}
|
|
3048
|
+
function disableScroll() {
|
|
3049
|
+
const {
|
|
3050
|
+
translate,
|
|
3051
|
+
slideLooper
|
|
3052
|
+
} = emblaApi.internalEngine();
|
|
3053
|
+
translate.clear();
|
|
3054
|
+
translate.toggleActive(false);
|
|
3055
|
+
slideLooper.loopPoints.forEach(({
|
|
3056
|
+
translate
|
|
3057
|
+
}) => {
|
|
3058
|
+
translate.clear();
|
|
3059
|
+
translate.toggleActive(false);
|
|
3060
|
+
});
|
|
3061
|
+
}
|
|
3062
|
+
function lockExcessiveScroll(fadeIndex) {
|
|
3063
|
+
const {
|
|
3064
|
+
scrollSnaps,
|
|
3065
|
+
location,
|
|
3066
|
+
target
|
|
3067
|
+
} = emblaApi.internalEngine();
|
|
3068
|
+
if (!isNumber(fadeIndex) || opacities[fadeIndex] < 0.5) return;
|
|
3069
|
+
location.set(scrollSnaps[fadeIndex]);
|
|
3070
|
+
target.set(location);
|
|
3071
|
+
}
|
|
3072
|
+
function setOpacities(fadeIndex, velocity) {
|
|
3073
|
+
const scrollSnaps = emblaApi.scrollSnapList();
|
|
3074
|
+
scrollSnaps.forEach((_, indexA) => {
|
|
3075
|
+
const absVelocity = Math.abs(velocity);
|
|
3076
|
+
const currentOpacity = opacities[indexA];
|
|
3077
|
+
const isFadeIndex = indexA === fadeIndex;
|
|
3078
|
+
const nextOpacity = isFadeIndex ? currentOpacity + absVelocity : currentOpacity - absVelocity;
|
|
3079
|
+
const clampedOpacity = clampNumber(nextOpacity, noOpacity, fullOpacity);
|
|
3080
|
+
opacities[indexA] = clampedOpacity;
|
|
3081
|
+
const fadePair = isFadeIndex && shouldFadePair;
|
|
3082
|
+
const indexB = emblaApi.previousScrollSnap();
|
|
3083
|
+
if (fadePair) opacities[indexB] = 1 - clampedOpacity;
|
|
3084
|
+
if (isFadeIndex) setProgress(fadeIndex, clampedOpacity);
|
|
3085
|
+
setOpacity(indexA);
|
|
3086
|
+
});
|
|
3087
|
+
}
|
|
3088
|
+
function setOpacity(index) {
|
|
3089
|
+
const slidesInSnap = emblaApi.internalEngine().slideRegistry[index];
|
|
3090
|
+
const {
|
|
3091
|
+
scrollSnaps,
|
|
3092
|
+
containerRect
|
|
3093
|
+
} = emblaApi.internalEngine();
|
|
3094
|
+
const opacity = opacities[index];
|
|
3095
|
+
slidesInSnap.forEach(slideIndex => {
|
|
3096
|
+
const slideStyle = emblaApi.slideNodes()[slideIndex].style;
|
|
3097
|
+
const roundedOpacity = parseFloat(opacity.toFixed(2));
|
|
3098
|
+
const hasOpacity = roundedOpacity > noOpacity;
|
|
3099
|
+
const position = hasOpacity ? scrollSnaps[index] : containerRect.width + 2;
|
|
3100
|
+
const transform = getSlideTransform(position);
|
|
3101
|
+
if (hasOpacity) slideStyle.transform = transform;
|
|
3102
|
+
slideStyle.opacity = roundedOpacity.toString();
|
|
3103
|
+
slideStyle.pointerEvents = opacity > 0.5 ? 'auto' : 'none';
|
|
3104
|
+
if (!hasOpacity) slideStyle.transform = transform;
|
|
3105
|
+
});
|
|
3106
|
+
}
|
|
3107
|
+
function setProgress(fadeIndex, opacity) {
|
|
3108
|
+
const {
|
|
3109
|
+
index,
|
|
3110
|
+
dragHandler,
|
|
3111
|
+
scrollSnaps
|
|
3112
|
+
} = emblaApi.internalEngine();
|
|
3113
|
+
const pointerDown = dragHandler.pointerDown();
|
|
3114
|
+
const snapFraction = 1 / (scrollSnaps.length - 1);
|
|
3115
|
+
let indexA = fadeIndex;
|
|
3116
|
+
let indexB = pointerDown ? emblaApi.selectedScrollSnap() : emblaApi.previousScrollSnap();
|
|
3117
|
+
if (pointerDown && indexA === indexB) {
|
|
3118
|
+
const reverseSign = Math.sign(distanceFromPointerDown) * -1;
|
|
3119
|
+
indexA = indexB;
|
|
3120
|
+
indexB = index.clone().set(indexB).add(reverseSign).get();
|
|
3121
|
+
}
|
|
3122
|
+
const currentPosition = indexB * snapFraction;
|
|
3123
|
+
const diffPosition = (indexA - indexB) * snapFraction;
|
|
3124
|
+
progress = currentPosition + diffPosition * opacity;
|
|
3125
|
+
}
|
|
3126
|
+
function getFadeIndex() {
|
|
3127
|
+
const {
|
|
3128
|
+
dragHandler,
|
|
3129
|
+
index,
|
|
3130
|
+
scrollBody
|
|
3131
|
+
} = emblaApi.internalEngine();
|
|
3132
|
+
const selectedSnap = emblaApi.selectedScrollSnap();
|
|
3133
|
+
if (!dragHandler.pointerDown()) return selectedSnap;
|
|
3134
|
+
const directionSign = Math.sign(scrollBody.velocity());
|
|
3135
|
+
const distanceSign = Math.sign(distanceFromPointerDown);
|
|
3136
|
+
const nextSnap = index.clone().set(selectedSnap).add(directionSign * -1).get();
|
|
3137
|
+
if (!directionSign || !distanceSign) return null;
|
|
3138
|
+
return distanceSign === directionSign ? nextSnap : selectedSnap;
|
|
3139
|
+
}
|
|
3140
|
+
function fade(emblaApi) {
|
|
3141
|
+
const {
|
|
3142
|
+
dragHandler,
|
|
3143
|
+
scrollBody
|
|
3144
|
+
} = emblaApi.internalEngine();
|
|
3145
|
+
const pointerDown = dragHandler.pointerDown();
|
|
3146
|
+
const velocity = scrollBody.velocity();
|
|
3147
|
+
const duration = scrollBody.duration();
|
|
3148
|
+
const fadeIndex = getFadeIndex();
|
|
3149
|
+
const noFadeIndex = !isNumber(fadeIndex);
|
|
3150
|
+
if (pointerDown) {
|
|
3151
|
+
if (!velocity) return;
|
|
3152
|
+
distanceFromPointerDown += velocity;
|
|
3153
|
+
fadeVelocity = Math.abs(velocity / fadeToNextDistance);
|
|
3154
|
+
lockExcessiveScroll(fadeIndex);
|
|
3155
|
+
}
|
|
3156
|
+
if (!pointerDown) {
|
|
3157
|
+
if (!duration || noFadeIndex) return;
|
|
3158
|
+
fadeVelocity += (fullOpacity - opacities[fadeIndex]) / duration;
|
|
3159
|
+
fadeVelocity *= fadeFriction;
|
|
3160
|
+
}
|
|
3161
|
+
if (noFadeIndex) return;
|
|
3162
|
+
setOpacities(fadeIndex, fadeVelocity);
|
|
3163
|
+
}
|
|
3164
|
+
function settled() {
|
|
3165
|
+
const {
|
|
3166
|
+
target,
|
|
3167
|
+
location
|
|
3168
|
+
} = emblaApi.internalEngine();
|
|
3169
|
+
const diffToTarget = target.get() - location.get();
|
|
3170
|
+
const notReachedTarget = Math.abs(diffToTarget) >= 1;
|
|
3171
|
+
const fadeIndex = getFadeIndex();
|
|
3172
|
+
const noFadeIndex = !isNumber(fadeIndex);
|
|
3173
|
+
fade(emblaApi);
|
|
3174
|
+
if (noFadeIndex || notReachedTarget) return false;
|
|
3175
|
+
return opacities[fadeIndex] > 0.999;
|
|
3176
|
+
}
|
|
3177
|
+
function scrollProgress() {
|
|
3178
|
+
return progress;
|
|
3179
|
+
}
|
|
3180
|
+
const self = {
|
|
3181
|
+
name: 'fade',
|
|
3182
|
+
options: userOptions,
|
|
3183
|
+
init,
|
|
3184
|
+
destroy
|
|
3185
|
+
};
|
|
3186
|
+
return self;
|
|
3187
|
+
}
|
|
3188
|
+
Fade.globalOptions = undefined;
|
|
3189
|
+
|
|
3190
|
+
var LsgHeroController = /** @class */function () {
|
|
3191
|
+
function LsgHeroController(viewport, elements, options) {
|
|
3192
|
+
if (elements === void 0) {
|
|
3193
|
+
elements = {};
|
|
3194
|
+
}
|
|
3195
|
+
if (options === void 0) {
|
|
3196
|
+
options = {};
|
|
3197
|
+
}
|
|
3198
|
+
var _this = this;
|
|
3199
|
+
var _a, _b, _c;
|
|
3200
|
+
this.embla = null;
|
|
3201
|
+
this.autoplayTimer = null;
|
|
3202
|
+
this.contentObserver = null;
|
|
3203
|
+
this.scrollPrev = function () {
|
|
3204
|
+
var _a;
|
|
3205
|
+
(_a = _this.embla) === null || _a === void 0 ? void 0 : _a.scrollPrev();
|
|
3206
|
+
if (_this.opts.autoplay) _this.startAutoplay();
|
|
3207
|
+
};
|
|
3208
|
+
this.scrollNext = function () {
|
|
3209
|
+
var _a;
|
|
3210
|
+
(_a = _this.embla) === null || _a === void 0 ? void 0 : _a.scrollNext();
|
|
3211
|
+
if (_this.opts.autoplay) _this.startAutoplay();
|
|
3212
|
+
};
|
|
3213
|
+
this.handleScrollDown = function () {
|
|
3214
|
+
var _a;
|
|
3215
|
+
(_a = _this.els.scrollDownTarget) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
|
|
3216
|
+
behavior: "smooth"
|
|
3217
|
+
});
|
|
3218
|
+
};
|
|
3219
|
+
/** Start the autoplay interval (resets any existing timer). */
|
|
3220
|
+
this.startAutoplay = function () {
|
|
3221
|
+
_this.stopAutoplay();
|
|
3222
|
+
_this.autoplayTimer = setInterval(_this.scrollNext, _this.opts.autoplayInterval);
|
|
3223
|
+
};
|
|
3224
|
+
/** Clear the autoplay interval. */
|
|
3225
|
+
this.stopAutoplay = function () {
|
|
3226
|
+
if (_this.autoplayTimer !== null) {
|
|
3227
|
+
clearInterval(_this.autoplayTimer);
|
|
3228
|
+
_this.autoplayTimer = null;
|
|
3229
|
+
}
|
|
3230
|
+
};
|
|
3231
|
+
this.opts = {
|
|
3232
|
+
transition: (_a = options.transition) !== null && _a !== void 0 ? _a : "slide",
|
|
3233
|
+
autoplay: (_b = options.autoplay) !== null && _b !== void 0 ? _b : true,
|
|
3234
|
+
autoplayInterval: (_c = options.autoplayInterval) !== null && _c !== void 0 ? _c : 5000
|
|
3235
|
+
};
|
|
3236
|
+
this.els = elements;
|
|
3237
|
+
this.mount(viewport);
|
|
3238
|
+
}
|
|
3239
|
+
LsgHeroController.prototype.mount = function (viewport) {
|
|
3240
|
+
var _a, _b, _c;
|
|
3241
|
+
var plugins = this.opts.transition === "fade" ? [Fade()] : [];
|
|
3242
|
+
this.embla = EmblaCarousel(viewport, {
|
|
3243
|
+
loop: true
|
|
3244
|
+
}, plugins);
|
|
3245
|
+
if (this.opts.autoplay) {
|
|
3246
|
+
this.startAutoplay();
|
|
3247
|
+
this.embla.on("pointerDown", this.stopAutoplay);
|
|
3248
|
+
this.embla.on("pointerUp", this.startAutoplay);
|
|
3249
|
+
}
|
|
3250
|
+
(_a = this.els.prevBtn) === null || _a === void 0 ? void 0 : _a.addEventListener("click", this.scrollPrev);
|
|
3251
|
+
(_b = this.els.nextBtn) === null || _b === void 0 ? void 0 : _b.addEventListener("click", this.scrollNext);
|
|
3252
|
+
(_c = this.els.scrollDownBtn) === null || _c === void 0 ? void 0 : _c.addEventListener("click", this.handleScrollDown);
|
|
3253
|
+
// Sync the first slide's content-wrapper height to a CSS custom property
|
|
3254
|
+
// on the section root so the controls column can match it dynamically.
|
|
3255
|
+
var section = viewport.closest("[data-lsg-is='hero']");
|
|
3256
|
+
var contentWrapper = section === null || section === void 0 ? void 0 : section.querySelector(".lsg-hero-card__content-wrapper");
|
|
3257
|
+
if (section && contentWrapper && typeof ResizeObserver !== "undefined") {
|
|
3258
|
+
var setHeight_1 = function (el) {
|
|
3259
|
+
section.style.setProperty("--lsg-hero-content-height", "".concat(el.offsetHeight, "px"));
|
|
3260
|
+
};
|
|
3261
|
+
setHeight_1(contentWrapper);
|
|
3262
|
+
this.contentObserver = new ResizeObserver(function (entries) {
|
|
3263
|
+
setHeight_1(entries[0].target);
|
|
3264
|
+
});
|
|
3265
|
+
this.contentObserver.observe(contentWrapper);
|
|
3266
|
+
}
|
|
3267
|
+
};
|
|
3268
|
+
Object.defineProperty(LsgHeroController.prototype, "emblaApi", {
|
|
3269
|
+
/** Direct access to the underlying Embla instance for advanced usage. */
|
|
3270
|
+
get: function () {
|
|
3271
|
+
return this.embla;
|
|
3272
|
+
},
|
|
3273
|
+
enumerable: false,
|
|
3274
|
+
configurable: true
|
|
3275
|
+
});
|
|
3276
|
+
/** Tear down event listeners, autoplay, and the Embla instance. */
|
|
3277
|
+
LsgHeroController.prototype.destroy = function () {
|
|
3278
|
+
var _a, _b, _c, _d;
|
|
3279
|
+
this.stopAutoplay();
|
|
3280
|
+
(_a = this.contentObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
3281
|
+
this.contentObserver = null;
|
|
3282
|
+
if (this.embla) {
|
|
3283
|
+
this.embla.off("pointerDown", this.stopAutoplay);
|
|
3284
|
+
this.embla.off("pointerUp", this.startAutoplay);
|
|
3285
|
+
this.embla.destroy();
|
|
3286
|
+
this.embla = null;
|
|
3287
|
+
}
|
|
3288
|
+
(_b = this.els.prevBtn) === null || _b === void 0 ? void 0 : _b.removeEventListener("click", this.scrollPrev);
|
|
3289
|
+
(_c = this.els.nextBtn) === null || _c === void 0 ? void 0 : _c.removeEventListener("click", this.scrollNext);
|
|
3290
|
+
(_d = this.els.scrollDownBtn) === null || _d === void 0 ? void 0 : _d.removeEventListener("click", this.handleScrollDown);
|
|
3291
|
+
};
|
|
3292
|
+
return LsgHeroController;
|
|
3293
|
+
}();
|
|
3294
|
+
|
|
3295
|
+
// ─────────────────────────────────────────────────────────────────────────────
|
|
3296
|
+
// LsgHeroCard
|
|
3297
|
+
// ─────────────────────────────────────────────────────────────────────────────
|
|
3298
|
+
var LsgHeroCard = function (_a) {
|
|
3299
|
+
var imageSrc = _a.imageSrc,
|
|
3300
|
+
_b = _a.imageAlt,
|
|
3301
|
+
imageAlt = _b === void 0 ? "" : _b,
|
|
3302
|
+
videoSrc = _a.videoSrc,
|
|
3303
|
+
youtubeId = _a.youtubeId,
|
|
3304
|
+
vimeoId = _a.vimeoId,
|
|
3305
|
+
cardBackground = _a.cardBackground,
|
|
3306
|
+
cardColor = _a.cardColor,
|
|
3307
|
+
children = _a.children,
|
|
3308
|
+
index = _a.index,
|
|
3309
|
+
total = _a.total,
|
|
3310
|
+
_c = _a.className,
|
|
3311
|
+
className = _c === void 0 ? "" : _c;
|
|
3312
|
+
var _d = useState(false),
|
|
3313
|
+
videoReady = _d[0],
|
|
3314
|
+
setVideoReady = _d[1];
|
|
3315
|
+
// Video source priority: YouTube > Vimeo > DAM
|
|
3316
|
+
var hasYoutube = Boolean(youtubeId);
|
|
3317
|
+
var hasVimeo = !hasYoutube && Boolean(vimeoId);
|
|
3318
|
+
var hasDam = !hasYoutube && !hasVimeo && Boolean(videoSrc);
|
|
3319
|
+
// No image/video → the card renders as a solid colour (fill) instead of a
|
|
3320
|
+
// media backdrop; with media, cardBackground tints the content text-box.
|
|
3321
|
+
var hasMedia = Boolean(imageSrc || videoSrc || youtubeId || vimeoId);
|
|
3322
|
+
var youtubeEmbedSrc = youtubeId ? "https://www.youtube.com/embed/".concat(youtubeId, "?autoplay=1&mute=1&loop=1&controls=0&disablekb=1&fs=0&iv_load_policy=3&modestbranding=1&playlist=").concat(youtubeId, "&rel=0") : undefined;
|
|
3323
|
+
var vimeoEmbedSrc = vimeoId ? "https://player.vimeo.com/video/".concat(vimeoId, "?autoplay=1&loop=1&background=1&muted=1") : undefined;
|
|
3324
|
+
var ariaLabel = index !== undefined && total !== undefined ? "Slide ".concat(index + 1, " of ").concat(total) : undefined;
|
|
3325
|
+
var articleClasses = ["lsg-hero-card",
|
|
3326
|
+
// Background: tint the content box when there's media; fill the whole card when there isn't.
|
|
3327
|
+
cardBackground && (hasMedia ? "lsg-hero-card--bg-".concat(cardBackground) : "lsg-hero-card--fill-".concat(cardBackground)), cardColor && "lsg-hero-card--color-".concat(cardColor), className].filter(Boolean).join(" ");
|
|
3328
|
+
return /*#__PURE__*/React.createElement("article", {
|
|
3329
|
+
className: articleClasses,
|
|
3330
|
+
role: "listitem",
|
|
3331
|
+
"aria-label": ariaLabel
|
|
3332
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
3333
|
+
className: "lsg-hero-card__media",
|
|
3334
|
+
"aria-hidden": "true"
|
|
3335
|
+
}, imageSrc &&
|
|
3336
|
+
/*#__PURE__*/
|
|
3337
|
+
// eslint-disable-next-line @next/next/no-img-element
|
|
3338
|
+
React.createElement("img", {
|
|
3339
|
+
className: "lsg-hero-card__image",
|
|
3340
|
+
src: imageSrc,
|
|
3341
|
+
alt: imageAlt,
|
|
3342
|
+
loading: "eager"
|
|
3343
|
+
}), hasDam && /*#__PURE__*/React.createElement("video", {
|
|
3344
|
+
className: "lsg-hero-card__video".concat(videoReady ? " lsg-hero-card__video--ready" : ""),
|
|
3345
|
+
autoPlay: true,
|
|
3346
|
+
muted: true,
|
|
3347
|
+
loop: true,
|
|
3348
|
+
playsInline: true,
|
|
3349
|
+
onCanPlay: function () {
|
|
3350
|
+
return setVideoReady(true);
|
|
3351
|
+
}
|
|
3352
|
+
}, /*#__PURE__*/React.createElement("source", {
|
|
3353
|
+
src: videoSrc
|
|
3354
|
+
})), hasYoutube && /*#__PURE__*/React.createElement("div", {
|
|
3355
|
+
className: "lsg-hero-card__video-embed lsg-hero-card__video-embed--youtube"
|
|
3356
|
+
}, /*#__PURE__*/React.createElement("iframe", {
|
|
3357
|
+
src: youtubeEmbedSrc,
|
|
3358
|
+
title: "Hero background video",
|
|
3359
|
+
allow: "autoplay",
|
|
3360
|
+
"aria-hidden": "true",
|
|
3361
|
+
tabIndex: -1
|
|
3362
|
+
})), hasVimeo && /*#__PURE__*/React.createElement("div", {
|
|
3363
|
+
className: "lsg-hero-card__video-embed lsg-hero-card__video-embed--vimeo"
|
|
3364
|
+
}, /*#__PURE__*/React.createElement("iframe", {
|
|
3365
|
+
src: vimeoEmbedSrc,
|
|
3366
|
+
title: "Hero background video",
|
|
3367
|
+
allow: "autoplay",
|
|
3368
|
+
"aria-hidden": "true",
|
|
3369
|
+
tabIndex: -1
|
|
3370
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
|
3371
|
+
className: "lsg-hero-card__content layout-container--medium"
|
|
3372
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
3373
|
+
className: "lsg-hero-card__content-wrapper"
|
|
3374
|
+
}, children)));
|
|
3375
|
+
};
|
|
3376
|
+
|
|
3377
|
+
// ─────────────────────────────────────────────────────────────────────────────
|
|
3378
|
+
// LsgHero
|
|
3379
|
+
// ─────────────────────────────────────────────────────────────────────────────
|
|
3380
|
+
var LsgHero = function (_a) {
|
|
3381
|
+
var _b = _a.slides,
|
|
3382
|
+
slides = _b === void 0 ? [] : _b,
|
|
3383
|
+
_c = _a.height,
|
|
3384
|
+
height = _c === void 0 ? "full" : _c,
|
|
3385
|
+
_d = _a.showArrows,
|
|
3386
|
+
showArrows = _d === void 0 ? true : _d,
|
|
3387
|
+
_e = _a.transition,
|
|
3388
|
+
transition = _e === void 0 ? "slide" : _e,
|
|
3389
|
+
_f = _a.enableScrollDown,
|
|
3390
|
+
enableScrollDown = _f === void 0 ? false : _f,
|
|
3391
|
+
scrollDownText = _a.scrollDownText,
|
|
3392
|
+
_g = _a.autoplay,
|
|
3393
|
+
autoplay = _g === void 0 ? true : _g,
|
|
3394
|
+
_h = _a.autoplayInterval,
|
|
3395
|
+
autoplayInterval = _h === void 0 ? 5000 : _h,
|
|
3396
|
+
_j = _a.className,
|
|
3397
|
+
className = _j === void 0 ? "" : _j;
|
|
3398
|
+
var isCarousel = slides.length > 1;
|
|
3399
|
+
// ── Refs ──────────────────────────────────────────────────────────────────
|
|
3400
|
+
var sectionRef = useRef(null);
|
|
3401
|
+
var viewportRef = useRef(null);
|
|
3402
|
+
var prevBtnRef = useRef(null);
|
|
3403
|
+
var nextBtnRef = useRef(null);
|
|
3404
|
+
var controllerRef = useRef(null);
|
|
3405
|
+
// ── Controller init (vanilla JS — same logic as AEM clientlib) ────────────
|
|
3406
|
+
useEffect(function () {
|
|
3407
|
+
if (!viewportRef.current || !isCarousel) return;
|
|
3408
|
+
controllerRef.current = new LsgHeroController(viewportRef.current, {
|
|
3409
|
+
prevBtn: showArrows ? prevBtnRef.current : undefined,
|
|
3410
|
+
nextBtn: showArrows ? nextBtnRef.current : undefined
|
|
3411
|
+
}, {
|
|
3412
|
+
transition: transition,
|
|
3413
|
+
autoplay: autoplay,
|
|
3414
|
+
autoplayInterval: autoplayInterval
|
|
3415
|
+
});
|
|
3416
|
+
return function () {
|
|
3417
|
+
var _a;
|
|
3418
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
3419
|
+
controllerRef.current = null;
|
|
3420
|
+
};
|
|
3421
|
+
}, [isCarousel, showArrows, transition, autoplay, autoplayInterval]);
|
|
3422
|
+
// ── Scroll-down ───────────────────────────────────────────────────────────
|
|
3423
|
+
var handleScrollDown = useCallback(function () {
|
|
3424
|
+
var _a;
|
|
3425
|
+
var next = (_a = sectionRef.current) === null || _a === void 0 ? void 0 : _a.nextElementSibling;
|
|
3426
|
+
next === null || next === void 0 ? void 0 : next.scrollIntoView({
|
|
3427
|
+
behavior: "smooth"
|
|
3428
|
+
});
|
|
3429
|
+
}, []);
|
|
3430
|
+
// ── Class names ───────────────────────────────────────────────────────────
|
|
3431
|
+
var sectionClasses = ["lsg-hero", "lsg-hero--".concat(height), "lsg-hero--".concat(transition), className].filter(Boolean).join(" ");
|
|
3432
|
+
// ── Render ────────────────────────────────────────────────────────────────
|
|
3433
|
+
return /*#__PURE__*/React.createElement("section", {
|
|
3434
|
+
ref: sectionRef,
|
|
3435
|
+
className: sectionClasses,
|
|
3436
|
+
"data-lsg-is": "hero",
|
|
3437
|
+
"data-lsg-carousel": String(isCarousel),
|
|
3438
|
+
"data-lsg-transition": transition,
|
|
3439
|
+
"data-lsg-arrows": String(showArrows)
|
|
3440
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
3441
|
+
className: "lsg-hero__viewport",
|
|
3442
|
+
ref: viewportRef
|
|
3443
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
3444
|
+
className: "lsg-hero__slides",
|
|
3445
|
+
role: "list"
|
|
3446
|
+
}, slides.map(function (slide, index) {
|
|
3447
|
+
return /*#__PURE__*/React.createElement(LsgHeroCard, _extends({
|
|
3448
|
+
key: index
|
|
3449
|
+
}, slide, {
|
|
3450
|
+
index: index,
|
|
3451
|
+
total: slides.length
|
|
3452
|
+
}));
|
|
3453
|
+
}))), isCarousel && showArrows && /*#__PURE__*/React.createElement("div", {
|
|
3454
|
+
className: "lsg-hero__controls-wrap"
|
|
3455
|
+
}, /*#__PURE__*/React.createElement("nav", {
|
|
3456
|
+
className: "lsg-hero__controls",
|
|
3457
|
+
"aria-label": "Hero navigation"
|
|
3458
|
+
}, /*#__PURE__*/React.createElement("button", {
|
|
3459
|
+
ref: prevBtnRef,
|
|
3460
|
+
className: "lsg-hero__prev",
|
|
3461
|
+
type: "button",
|
|
3462
|
+
"aria-label": "Previous slide"
|
|
3463
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
3464
|
+
className: "lsg-hero__arrow-icon",
|
|
3465
|
+
"aria-hidden": "true"
|
|
3466
|
+
})), /*#__PURE__*/React.createElement("button", {
|
|
3467
|
+
ref: nextBtnRef,
|
|
3468
|
+
className: "lsg-hero__next",
|
|
3469
|
+
type: "button",
|
|
3470
|
+
"aria-label": "Next slide"
|
|
3471
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
3472
|
+
className: "lsg-hero__arrow-icon",
|
|
3473
|
+
"aria-hidden": "true"
|
|
3474
|
+
})))), enableScrollDown && /*#__PURE__*/React.createElement("div", {
|
|
3475
|
+
className: "lsg-hero__scroll-down"
|
|
3476
|
+
}, /*#__PURE__*/React.createElement("button", {
|
|
3477
|
+
className: "lsg-hero__scroll-down-btn",
|
|
3478
|
+
type: "button",
|
|
3479
|
+
"aria-label": scrollDownText !== null && scrollDownText !== void 0 ? scrollDownText : "Scroll down",
|
|
3480
|
+
onClick: handleScrollDown
|
|
3481
|
+
}, scrollDownText && /*#__PURE__*/React.createElement("span", {
|
|
3482
|
+
className: "lsg-hero__scroll-down-text"
|
|
3483
|
+
}, scrollDownText), /*#__PURE__*/React.createElement("span", {
|
|
3484
|
+
className: "lsg-hero__scroll-down-icon",
|
|
3485
|
+
"aria-hidden": "true"
|
|
3486
|
+
}))));
|
|
3487
|
+
};
|
|
3488
|
+
|
|
1336
3489
|
var LsgFormFieldText = function (_a) {
|
|
1337
3490
|
var _b = _a.id,
|
|
1338
3491
|
id = _b === void 0 ? "field-text" : _b,
|
|
@@ -2075,6 +4228,7 @@ var BASE_COMPONENTS = {
|
|
|
2075
4228
|
LsgQuickLinks: LsgQuickLinks,
|
|
2076
4229
|
LsgSocialMediaIcons: LsgSocialMediaIcons,
|
|
2077
4230
|
LsgFooter: LsgFooter,
|
|
4231
|
+
LsgHero: LsgHero,
|
|
2078
4232
|
LsgFormContainer: LsgFormContainer,
|
|
2079
4233
|
LsgFormFieldText: LsgFormFieldText,
|
|
2080
4234
|
LsgFormFieldEmail: LsgFormFieldEmail,
|
|
@@ -2109,6 +4263,7 @@ function createThemeComponents(themeName) {
|
|
|
2109
4263
|
LsgQuickLinks: createThemeComponent(themeName, "quick-links", BASE_COMPONENTS.LsgQuickLinks),
|
|
2110
4264
|
LsgSocialMediaIcons: createThemeComponent(themeName, "social-media-icons", BASE_COMPONENTS.LsgSocialMediaIcons),
|
|
2111
4265
|
LsgFooter: createThemeComponent(themeName, "footer", BASE_COMPONENTS.LsgFooter),
|
|
4266
|
+
LsgHero: createThemeComponent(themeName, "hero", BASE_COMPONENTS.LsgHero),
|
|
2112
4267
|
LsgFormContainer: createThemeComponent(themeName, "form-container", BASE_COMPONENTS.LsgFormContainer),
|
|
2113
4268
|
LsgFormFieldText: createThemeComponent(themeName, "form-field-text", BASE_COMPONENTS.LsgFormFieldText),
|
|
2114
4269
|
LsgFormFieldEmail: createThemeComponent(themeName, "form-field-email", BASE_COMPONENTS.LsgFormFieldEmail),
|
|
@@ -2134,7 +4289,8 @@ var Theme1LsgButton = theme1Components.LsgButton,
|
|
|
2134
4289
|
Theme1LsgHeader = theme1Components.LsgHeader,
|
|
2135
4290
|
Theme1LsgQuickLinks = theme1Components.LsgQuickLinks,
|
|
2136
4291
|
Theme1LsgSocialMediaIcons = theme1Components.LsgSocialMediaIcons,
|
|
2137
|
-
Theme1LsgFooter = theme1Components.LsgFooter
|
|
4292
|
+
Theme1LsgFooter = theme1Components.LsgFooter,
|
|
4293
|
+
Theme1LsgHero = theme1Components.LsgHero;
|
|
2138
4294
|
// Form components
|
|
2139
4295
|
theme1Components.LsgFormContainer;
|
|
2140
4296
|
theme1Components.LsgFormFieldText;
|
|
@@ -2159,7 +4315,8 @@ var Theme2LsgButton = theme2Components.LsgButton,
|
|
|
2159
4315
|
Theme2LsgHeader = theme2Components.LsgHeader,
|
|
2160
4316
|
Theme2LsgQuickLinks = theme2Components.LsgQuickLinks,
|
|
2161
4317
|
Theme2LsgSocialMediaIcons = theme2Components.LsgSocialMediaIcons,
|
|
2162
|
-
Theme2LsgFooter = theme2Components.LsgFooter
|
|
4318
|
+
Theme2LsgFooter = theme2Components.LsgFooter,
|
|
4319
|
+
Theme2LsgHero = theme2Components.LsgHero;
|
|
2163
4320
|
// Form components
|
|
2164
4321
|
theme2Components.LsgFormContainer;
|
|
2165
4322
|
theme2Components.LsgFormFieldText;
|
|
@@ -2184,7 +4341,8 @@ var Theme3LsgButton = theme3Components.LsgButton,
|
|
|
2184
4341
|
Theme3LsgHeader = theme3Components.LsgHeader,
|
|
2185
4342
|
Theme3LsgQuickLinks = theme3Components.LsgQuickLinks,
|
|
2186
4343
|
Theme3LsgSocialMediaIcons = theme3Components.LsgSocialMediaIcons,
|
|
2187
|
-
Theme3LsgFooter = theme3Components.LsgFooter
|
|
4344
|
+
Theme3LsgFooter = theme3Components.LsgFooter,
|
|
4345
|
+
Theme3LsgHero = theme3Components.LsgHero;
|
|
2188
4346
|
// Form components
|
|
2189
4347
|
theme3Components.LsgFormContainer;
|
|
2190
4348
|
theme3Components.LsgFormFieldText;
|
|
@@ -2196,5 +4354,5 @@ var Theme3LsgButton = theme3Components.LsgButton,
|
|
|
2196
4354
|
theme3Components.LsgFormFieldConsent;
|
|
2197
4355
|
theme3Components.LsgFormStep;
|
|
2198
4356
|
|
|
2199
|
-
export { LsgBanner, LsgButton, LsgCard, LsgCards, LsgFooter, LsgHeader, LsgLanguageSwitcher, LsgLogo, LsgNavigation, LsgQuickLinks, LsgSearchOverlay, LsgSearchTrigger, LsgSocialMediaIcons, Theme1LsgBanner, Theme1LsgButton, Theme1LsgCard, Theme1LsgCards, Theme1LsgFooter, Theme1LsgHeader, Theme1LsgLanguageSwitcher, Theme1LsgLogo, Theme1LsgNavigation, Theme1LsgQuickLinks, Theme1LsgSearchOverlay, Theme1LsgSearchTrigger, Theme1LsgSocialMediaIcons, Theme2LsgBanner, Theme2LsgButton, Theme2LsgCard, Theme2LsgCards, Theme2LsgFooter, Theme2LsgHeader, Theme2LsgLanguageSwitcher, Theme2LsgLogo, Theme2LsgNavigation, Theme2LsgQuickLinks, Theme2LsgSearchOverlay, Theme2LsgSearchTrigger, Theme2LsgSocialMediaIcons, Theme3LsgBanner, Theme3LsgButton, Theme3LsgCard, Theme3LsgCards, Theme3LsgFooter, Theme3LsgHeader, Theme3LsgLanguageSwitcher, Theme3LsgLogo, Theme3LsgNavigation, Theme3LsgQuickLinks, Theme3LsgSearchOverlay, Theme3LsgSearchTrigger, Theme3LsgSocialMediaIcons, getTelValue, initTelPickers, theme1Components, theme2Components, theme3Components };
|
|
4357
|
+
export { LsgBanner, LsgButton, LsgCard, LsgCards, LsgFooter, LsgHeader, LsgHero, LsgHeroCard, LsgHeroController, LsgLanguageSwitcher, LsgLogo, LsgNavigation, LsgQuickLinks, LsgSearchOverlay, LsgSearchTrigger, LsgSocialMediaIcons, Theme1LsgBanner, Theme1LsgButton, Theme1LsgCard, Theme1LsgCards, Theme1LsgFooter, Theme1LsgHeader, Theme1LsgHero, Theme1LsgLanguageSwitcher, Theme1LsgLogo, Theme1LsgNavigation, Theme1LsgQuickLinks, Theme1LsgSearchOverlay, Theme1LsgSearchTrigger, Theme1LsgSocialMediaIcons, Theme2LsgBanner, Theme2LsgButton, Theme2LsgCard, Theme2LsgCards, Theme2LsgFooter, Theme2LsgHeader, Theme2LsgHero, Theme2LsgLanguageSwitcher, Theme2LsgLogo, Theme2LsgNavigation, Theme2LsgQuickLinks, Theme2LsgSearchOverlay, Theme2LsgSearchTrigger, Theme2LsgSocialMediaIcons, Theme3LsgBanner, Theme3LsgButton, Theme3LsgCard, Theme3LsgCards, Theme3LsgFooter, Theme3LsgHeader, Theme3LsgHero, Theme3LsgLanguageSwitcher, Theme3LsgLogo, Theme3LsgNavigation, Theme3LsgQuickLinks, Theme3LsgSearchOverlay, Theme3LsgSearchTrigger, Theme3LsgSocialMediaIcons, getTelValue, initTelPickers, theme1Components, theme2Components, theme3Components };
|
|
2200
4358
|
//# sourceMappingURL=index.esm.js.map
|