farm-react 1.0.7 → 1.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/styles/style.css +25347 -0
- package/dist/assets/styles/style.css.map +1 -0
- package/dist/cjs/Utils/index.d.ts +4 -0
- package/dist/cjs/Utils/index.js +8 -0
- package/dist/cjs/Utils/index.js.map +1 -0
- package/dist/cjs/components/Accordion.js +7 -6
- package/dist/cjs/components/Accordion.js.map +1 -1
- package/dist/cjs/components/Alert.d.ts +32 -0
- package/dist/cjs/components/Alert.js +50 -0
- package/dist/cjs/components/Alert.js.map +1 -0
- package/dist/cjs/components/Badge.d.ts +22 -0
- package/dist/cjs/components/Badge.js +36 -0
- package/dist/cjs/components/Badge.js.map +1 -0
- package/dist/cjs/components/BrokenPage.d.ts +35 -0
- package/dist/cjs/components/BrokenPage.js +59 -0
- package/dist/cjs/components/BrokenPage.js.map +1 -0
- package/dist/cjs/components/Button.d.ts +29 -2
- package/dist/cjs/components/Button.js +56 -4
- package/dist/cjs/components/Button.js.map +1 -1
- package/dist/cjs/components/Card.d.ts +77 -0
- package/dist/cjs/components/Card.js +77 -0
- package/dist/cjs/components/Card.js.map +1 -0
- package/dist/cjs/components/Checkbox.d.ts +25 -0
- package/dist/cjs/components/Checkbox.js +23 -0
- package/dist/cjs/components/Checkbox.js.map +1 -0
- package/dist/cjs/components/ConfirmPoup.d.ts +21 -0
- package/dist/cjs/components/ConfirmPoup.js +47 -0
- package/dist/cjs/components/ConfirmPoup.js.map +1 -0
- package/dist/cjs/components/Dropdown.d.ts +35 -0
- package/dist/cjs/components/Dropdown.js +54 -0
- package/dist/cjs/components/Dropdown.js.map +1 -0
- package/dist/cjs/components/Label.d.ts +1 -1
- package/dist/cjs/components/Label.js +8 -6
- package/dist/cjs/components/Label.js.map +1 -1
- package/dist/cjs/components/Layout/Footer.js +11 -2
- package/dist/cjs/components/Layout/Footer.js.map +1 -1
- package/dist/cjs/components/Layout/Header.d.ts +2 -1
- package/dist/cjs/components/Layout/Header.js +15 -4
- package/dist/cjs/components/Layout/Header.js.map +1 -1
- package/dist/cjs/components/Layout/Sidebar.d.ts +2 -1
- package/dist/cjs/components/Layout/Sidebar.js +5 -3
- package/dist/cjs/components/Layout/Sidebar.js.map +1 -1
- package/dist/cjs/components/MultiCheckbox.d.ts +39 -0
- package/dist/cjs/components/MultiCheckbox.js +56 -0
- package/dist/cjs/components/MultiCheckbox.js.map +1 -0
- package/dist/cjs/components/MultiRadio.d.ts +30 -0
- package/dist/cjs/components/MultiRadio.js +41 -0
- package/dist/cjs/components/MultiRadio.js.map +1 -0
- package/dist/cjs/components/NumberInput.d.ts +38 -0
- package/dist/cjs/components/NumberInput.js +34 -0
- package/dist/cjs/components/NumberInput.js.map +1 -0
- package/dist/cjs/components/Popover.d.ts +56 -0
- package/dist/cjs/components/Popover.js +34 -0
- package/dist/cjs/components/Popover.js.map +1 -0
- package/dist/cjs/components/Radio.d.ts +24 -0
- package/dist/cjs/components/Radio.js +24 -0
- package/dist/cjs/components/Radio.js.map +1 -0
- package/dist/cjs/components/RadioButtonGroup.d.ts +67 -0
- package/dist/cjs/components/RadioButtonGroup.js +141 -0
- package/dist/cjs/components/RadioButtonGroup.js.map +1 -0
- package/dist/cjs/components/RangeSlider.d.ts +30 -0
- package/dist/cjs/components/RangeSlider.js +48 -0
- package/dist/cjs/components/RangeSlider.js.map +1 -0
- package/dist/cjs/components/RatingDisplay.js +7 -4
- package/dist/cjs/components/RatingDisplay.js.map +1 -1
- package/dist/cjs/components/Search.d.ts +6 -0
- package/dist/cjs/components/Search.js +11 -0
- package/dist/cjs/components/Search.js.map +1 -0
- package/dist/cjs/components/Select.d.ts +41 -0
- package/dist/cjs/components/Select.js +48 -0
- package/dist/cjs/components/Select.js.map +1 -0
- package/dist/cjs/components/SkeletonLoader.d.ts +39 -0
- package/dist/cjs/components/SkeletonLoader.js +76 -0
- package/dist/cjs/components/SkeletonLoader.js.map +1 -0
- package/dist/cjs/components/Slider/SlickSlider.d.ts +74 -0
- package/dist/cjs/components/Slider/SlickSlider.js +211 -0
- package/dist/cjs/components/Slider/SlickSlider.js.map +1 -0
- package/dist/cjs/components/Slider/useCenterMode.d.ts +24 -0
- package/dist/cjs/components/Slider/useCenterMode.js +40 -0
- package/dist/cjs/components/Slider/useCenterMode.js.map +1 -0
- package/dist/cjs/components/Slider/useSlider.d.ts +65 -0
- package/dist/cjs/components/Slider/useSlider.js +158 -0
- package/dist/cjs/components/Slider/useSlider.js.map +1 -0
- package/dist/cjs/components/Slider/useSliderAutoPlay.d.ts +33 -0
- package/dist/cjs/components/Slider/useSliderAutoPlay.js +73 -0
- package/dist/cjs/components/Slider/useSliderAutoPlay.js.map +1 -0
- package/dist/cjs/components/Slider/useSliderBreakpoint.d.ts +23 -0
- package/dist/cjs/components/Slider/useSliderBreakpoint.js +92 -0
- package/dist/cjs/components/Slider/useSliderBreakpoint.js.map +1 -0
- package/dist/cjs/components/Slider/useSliderDimension.d.ts +41 -0
- package/dist/cjs/components/Slider/useSliderDimension.js +92 -0
- package/dist/cjs/components/Slider/useSliderDimension.js.map +1 -0
- package/dist/cjs/components/Slider/useSliderDraggable.d.ts +43 -0
- package/dist/cjs/components/Slider/useSliderDraggable.js +146 -0
- package/dist/cjs/components/Slider/useSliderDraggable.js.map +1 -0
- package/dist/cjs/components/Slider/useSliderNavigation.d.ts +41 -0
- package/dist/cjs/components/Slider/useSliderNavigation.js +136 -0
- package/dist/cjs/components/Slider/useSliderNavigation.js.map +1 -0
- package/dist/cjs/components/Slider/useSliderTransform.d.ts +17 -0
- package/dist/cjs/components/Slider/useSliderTransform.js +71 -0
- package/dist/cjs/components/Slider/useSliderTransform.js.map +1 -0
- package/dist/cjs/components/TextInput.d.ts +35 -4
- package/dist/cjs/components/TextInput.js +97 -11
- package/dist/cjs/components/TextInput.js.map +1 -1
- package/dist/cjs/components/ThreeDotsLoader.d.ts +24 -0
- package/dist/cjs/components/ThreeDotsLoader.js +25 -0
- package/dist/cjs/components/ThreeDotsLoader.js.map +1 -0
- package/dist/cjs/components/Tooltip.d.ts +32 -0
- package/dist/cjs/components/Tooltip.js +35 -0
- package/dist/cjs/components/Tooltip.js.map +1 -0
- package/dist/cjs/constants/app.d.ts +2 -0
- package/dist/cjs/constants/app.js +3 -1
- package/dist/cjs/constants/app.js.map +1 -1
- package/dist/cjs/constants/icons.d.ts +10 -0
- package/dist/cjs/constants/icons.js +14 -0
- package/dist/cjs/constants/icons.js.map +1 -0
- package/dist/cjs/helpers/app.d.ts +39 -2
- package/dist/cjs/helpers/app.js +83 -5
- package/dist/cjs/helpers/app.js.map +1 -1
- package/dist/cjs/helpers/index.d.ts +1 -0
- package/dist/cjs/helpers/index.js +3 -0
- package/dist/cjs/helpers/index.js.map +1 -1
- package/dist/cjs/hooks/index.d.ts +1 -0
- package/dist/cjs/hooks/index.js +4 -0
- package/dist/cjs/hooks/index.js.map +1 -1
- package/dist/cjs/hooks/useLocalStorage.d.ts +7 -0
- package/dist/cjs/hooks/useLocalStorage.js +57 -0
- package/dist/cjs/hooks/useLocalStorage.js.map +1 -0
- package/dist/cjs/index.d.ts +23 -5
- package/dist/cjs/index.js +47 -9
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/strings/en.d.ts +3 -1
- package/dist/cjs/strings/en.js +5 -3
- package/dist/cjs/strings/en.js.map +1 -1
- package/dist/cjs/subComponent/DateRange.js +2 -0
- package/dist/cjs/subComponent/DateRange.js.map +1 -0
- package/dist/cjs/subComponent/ToggleButton.d.ts +9 -0
- package/dist/cjs/subComponent/ToggleButton.js +19 -0
- package/dist/cjs/subComponent/ToggleButton.js.map +1 -0
- package/dist/cjs/subComponent/toggleBtnGroup/ToggleBtn.d.ts +43 -0
- package/dist/cjs/subComponent/toggleBtnGroup/ToggleBtn.js +43 -0
- package/dist/cjs/subComponent/toggleBtnGroup/ToggleBtn.js.map +1 -0
- package/dist/cjs/subComponent/toggleBtnGroup/ToggleBtnGroup.d.ts +43 -0
- package/dist/cjs/subComponent/toggleBtnGroup/ToggleBtnGroup.js +53 -0
- package/dist/cjs/subComponent/toggleBtnGroup/ToggleBtnGroup.js.map +1 -0
- package/dist/esm/Utils/index.d.ts +4 -0
- package/dist/esm/Utils/index.js +5 -0
- package/dist/esm/Utils/index.js.map +1 -0
- package/dist/esm/components/Accordion.js +7 -6
- package/dist/esm/components/Accordion.js.map +1 -1
- package/dist/esm/components/Alert.d.ts +32 -0
- package/dist/esm/components/Alert.js +48 -0
- package/dist/esm/components/Alert.js.map +1 -0
- package/dist/esm/components/Badge.d.ts +22 -0
- package/dist/esm/components/Badge.js +34 -0
- package/dist/esm/components/Badge.js.map +1 -0
- package/dist/esm/components/BrokenPage.d.ts +35 -0
- package/dist/esm/components/BrokenPage.js +57 -0
- package/dist/esm/components/BrokenPage.js.map +1 -0
- package/dist/esm/components/Button.d.ts +29 -2
- package/dist/esm/components/Button.js +56 -3
- package/dist/esm/components/Button.js.map +1 -1
- package/dist/esm/components/Card.d.ts +77 -0
- package/dist/esm/components/Card.js +75 -0
- package/dist/esm/components/Card.js.map +1 -0
- package/dist/esm/components/Checkbox.d.ts +25 -0
- package/dist/esm/components/Checkbox.js +21 -0
- package/dist/esm/components/Checkbox.js.map +1 -0
- package/dist/esm/components/ConfirmPoup.d.ts +21 -0
- package/dist/esm/components/ConfirmPoup.js +45 -0
- package/dist/esm/components/ConfirmPoup.js.map +1 -0
- package/dist/esm/components/Dropdown.d.ts +35 -0
- package/dist/esm/components/Dropdown.js +52 -0
- package/dist/esm/components/Dropdown.js.map +1 -0
- package/dist/esm/components/Label.d.ts +1 -1
- package/dist/esm/components/Label.js +9 -7
- package/dist/esm/components/Label.js.map +1 -1
- package/dist/esm/components/Layout/Footer.js +10 -2
- package/dist/esm/components/Layout/Footer.js.map +1 -1
- package/dist/esm/components/Layout/Header.d.ts +2 -1
- package/dist/esm/components/Layout/Header.js +14 -3
- package/dist/esm/components/Layout/Header.js.map +1 -1
- package/dist/esm/components/Layout/Sidebar.d.ts +2 -1
- package/dist/esm/components/Layout/Sidebar.js +4 -3
- package/dist/esm/components/Layout/Sidebar.js.map +1 -1
- package/dist/esm/components/MultiCheckbox.d.ts +39 -0
- package/dist/esm/components/MultiCheckbox.js +54 -0
- package/dist/esm/components/MultiCheckbox.js.map +1 -0
- package/dist/esm/components/MultiRadio.d.ts +30 -0
- package/dist/esm/components/MultiRadio.js +39 -0
- package/dist/esm/components/MultiRadio.js.map +1 -0
- package/dist/esm/components/NumberInput.d.ts +38 -0
- package/dist/esm/components/NumberInput.js +32 -0
- package/dist/esm/components/NumberInput.js.map +1 -0
- package/dist/esm/components/Popover.d.ts +56 -0
- package/dist/esm/components/Popover.js +32 -0
- package/dist/esm/components/Popover.js.map +1 -0
- package/dist/esm/components/Radio.d.ts +24 -0
- package/dist/esm/components/Radio.js +22 -0
- package/dist/esm/components/Radio.js.map +1 -0
- package/dist/esm/components/RadioButtonGroup.d.ts +67 -0
- package/dist/esm/components/RadioButtonGroup.js +139 -0
- package/dist/esm/components/RadioButtonGroup.js.map +1 -0
- package/dist/esm/components/RangeSlider.d.ts +30 -0
- package/dist/esm/components/RangeSlider.js +46 -0
- package/dist/esm/components/RangeSlider.js.map +1 -0
- package/dist/esm/components/RatingDisplay.js +7 -4
- package/dist/esm/components/RatingDisplay.js.map +1 -1
- package/dist/esm/components/Search.d.ts +6 -0
- package/dist/esm/components/Search.js +8 -0
- package/dist/esm/components/Search.js.map +1 -0
- package/dist/esm/components/Select.d.ts +41 -0
- package/dist/esm/components/Select.js +46 -0
- package/dist/esm/components/Select.js.map +1 -0
- package/dist/esm/components/SkeletonLoader.d.ts +39 -0
- package/dist/esm/components/SkeletonLoader.js +74 -0
- package/dist/esm/components/SkeletonLoader.js.map +1 -0
- package/dist/esm/components/Slider/SlickSlider.d.ts +74 -0
- package/dist/esm/components/Slider/SlickSlider.js +208 -0
- package/dist/esm/components/Slider/SlickSlider.js.map +1 -0
- package/dist/esm/components/Slider/useCenterMode.d.ts +24 -0
- package/dist/esm/components/Slider/useCenterMode.js +38 -0
- package/dist/esm/components/Slider/useCenterMode.js.map +1 -0
- package/dist/esm/components/Slider/useSlider.d.ts +65 -0
- package/dist/esm/components/Slider/useSlider.js +156 -0
- package/dist/esm/components/Slider/useSlider.js.map +1 -0
- package/dist/esm/components/Slider/useSliderAutoPlay.d.ts +33 -0
- package/dist/esm/components/Slider/useSliderAutoPlay.js +71 -0
- package/dist/esm/components/Slider/useSliderAutoPlay.js.map +1 -0
- package/dist/esm/components/Slider/useSliderBreakpoint.d.ts +23 -0
- package/dist/esm/components/Slider/useSliderBreakpoint.js +90 -0
- package/dist/esm/components/Slider/useSliderBreakpoint.js.map +1 -0
- package/dist/esm/components/Slider/useSliderDimension.d.ts +41 -0
- package/dist/esm/components/Slider/useSliderDimension.js +90 -0
- package/dist/esm/components/Slider/useSliderDimension.js.map +1 -0
- package/dist/esm/components/Slider/useSliderDraggable.d.ts +43 -0
- package/dist/esm/components/Slider/useSliderDraggable.js +144 -0
- package/dist/esm/components/Slider/useSliderDraggable.js.map +1 -0
- package/dist/esm/components/Slider/useSliderNavigation.d.ts +41 -0
- package/dist/esm/components/Slider/useSliderNavigation.js +134 -0
- package/dist/esm/components/Slider/useSliderNavigation.js.map +1 -0
- package/dist/esm/components/Slider/useSliderTransform.d.ts +17 -0
- package/dist/esm/components/Slider/useSliderTransform.js +69 -0
- package/dist/esm/components/Slider/useSliderTransform.js.map +1 -0
- package/dist/esm/components/TextInput.d.ts +35 -4
- package/dist/esm/components/TextInput.js +99 -12
- package/dist/esm/components/TextInput.js.map +1 -1
- package/dist/esm/components/ThreeDotsLoader.d.ts +24 -0
- package/dist/esm/components/ThreeDotsLoader.js +23 -0
- package/dist/esm/components/ThreeDotsLoader.js.map +1 -0
- package/dist/esm/components/Tooltip.d.ts +32 -0
- package/dist/esm/components/Tooltip.js +33 -0
- package/dist/esm/components/Tooltip.js.map +1 -0
- package/dist/esm/constants/app.d.ts +2 -0
- package/dist/esm/constants/app.js +2 -0
- package/dist/esm/constants/app.js.map +1 -1
- package/dist/esm/constants/icons.d.ts +10 -0
- package/dist/esm/constants/icons.js +12 -0
- package/dist/esm/constants/icons.js.map +1 -0
- package/dist/esm/helpers/app.d.ts +39 -2
- package/dist/esm/helpers/app.js +73 -3
- package/dist/esm/helpers/app.js.map +1 -1
- package/dist/esm/helpers/index.d.ts +1 -0
- package/dist/esm/helpers/index.js +1 -1
- package/dist/esm/helpers/index.js.map +1 -1
- package/dist/esm/hooks/index.d.ts +1 -0
- package/dist/esm/hooks/index.js +1 -1
- package/dist/esm/hooks/index.js.map +1 -1
- package/dist/esm/hooks/useLocalStorage.d.ts +7 -0
- package/dist/esm/hooks/useLocalStorage.js +54 -0
- package/dist/esm/hooks/useLocalStorage.js.map +1 -0
- package/dist/esm/index.d.ts +23 -5
- package/dist/esm/index.js +23 -5
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/strings/en.d.ts +3 -1
- package/dist/esm/strings/en.js +4 -2
- package/dist/esm/strings/en.js.map +1 -1
- package/dist/esm/subComponent/DateRange.js +2 -0
- package/dist/esm/subComponent/DateRange.js.map +1 -0
- package/dist/esm/subComponent/ToggleButton.d.ts +9 -0
- package/dist/esm/subComponent/ToggleButton.js +17 -0
- package/dist/esm/subComponent/ToggleButton.js.map +1 -0
- package/dist/esm/subComponent/toggleBtnGroup/ToggleBtn.d.ts +43 -0
- package/dist/esm/subComponent/toggleBtnGroup/ToggleBtn.js +41 -0
- package/dist/esm/subComponent/toggleBtnGroup/ToggleBtn.js.map +1 -0
- package/dist/esm/subComponent/toggleBtnGroup/ToggleBtnGroup.d.ts +43 -0
- package/dist/esm/subComponent/toggleBtnGroup/ToggleBtnGroup.js +51 -0
- package/dist/esm/subComponent/toggleBtnGroup/ToggleBtnGroup.js.map +1 -0
- package/dist/package.json +1 -1
- package/package.json +6 -4
- package/dist/cjs/strings/index.js +0 -2
- package/dist/cjs/strings/index.js.map +0 -1
- package/dist/esm/strings/index.js +0 -2
- package/dist/esm/strings/index.js.map +0 -1
- /package/dist/cjs/{strings/index.d.ts → subComponent/DateRange.d.ts} +0 -0
- /package/dist/esm/{strings/index.d.ts → subComponent/DateRange.d.ts} +0 -0
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { type SlickSliderAnimationConfig, type SlickSliderAutoPlayConfig } from './SlickSlider';
|
|
2
|
+
export interface SlickSliderConfig {
|
|
3
|
+
activeSlide?: number;
|
|
4
|
+
animationConfig?: SlickSliderAnimationConfig;
|
|
5
|
+
autoPlayConfig?: SlickSliderAutoPlayConfig;
|
|
6
|
+
breakpoint?: number;
|
|
7
|
+
draggable?: {
|
|
8
|
+
dragThreshold?: number;
|
|
9
|
+
enableDrag?: boolean;
|
|
10
|
+
};
|
|
11
|
+
gap?: number;
|
|
12
|
+
loop?: boolean;
|
|
13
|
+
showCtrlBtns?: boolean;
|
|
14
|
+
showIndicator?: boolean;
|
|
15
|
+
slideToScroll?: number;
|
|
16
|
+
slideToShow?: number;
|
|
17
|
+
}
|
|
18
|
+
export interface UseSliderBreakpointProps {
|
|
19
|
+
breakpoints: SlickSliderConfig[];
|
|
20
|
+
config: SlickSliderConfig;
|
|
21
|
+
}
|
|
22
|
+
declare function useSliderBreakpoint({ breakpoints, config }: UseSliderBreakpointProps): SlickSliderConfig;
|
|
23
|
+
export default useSliderBreakpoint;
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
var tslib_1 = require("tslib");
|
|
4
|
+
/**
|
|
5
|
+
* -----------------------------------------------------------------------------
|
|
6
|
+
* @file useSliderBreakpoint
|
|
7
|
+
* -----------------------------------------------------------------------------
|
|
8
|
+
*
|
|
9
|
+
* @description Utility file - add description here
|
|
10
|
+
*
|
|
11
|
+
* Features:
|
|
12
|
+
* - Add key features here
|
|
13
|
+
*
|
|
14
|
+
* -----------------------------------------------------------------------------
|
|
15
|
+
* Copyright © 2026 BookingKoala. All rights reserved.
|
|
16
|
+
* -----------------------------------------------------------------------------
|
|
17
|
+
*/
|
|
18
|
+
var react_1 = require("react");
|
|
19
|
+
var Utils_1 = require("../../Utils");
|
|
20
|
+
var helpers_1 = require("../../helpers");
|
|
21
|
+
/**
|
|
22
|
+
* Resolves the breakpoint configuration based on current viewport width.
|
|
23
|
+
* This function is used both for initial resolution and on resize.
|
|
24
|
+
*/
|
|
25
|
+
function resolveBreakpointConfig(breakpoints, config) {
|
|
26
|
+
var _a, _b, _c, _d, _e;
|
|
27
|
+
if ((0, helpers_1.isObjectEmpty)(config)) {
|
|
28
|
+
return config;
|
|
29
|
+
}
|
|
30
|
+
var viewportWidth = Utils_1.safeWindow === null || Utils_1.safeWindow === void 0 ? void 0 : Utils_1.safeWindow.innerWidth;
|
|
31
|
+
if (!viewportWidth) {
|
|
32
|
+
return config;
|
|
33
|
+
}
|
|
34
|
+
// Sort breakpoints in ascending order (smallest first).
|
|
35
|
+
// Then match the first breakpoint where viewport width is <= breakpoint.
|
|
36
|
+
// Example: viewport 500 matches 576 (not 1200).
|
|
37
|
+
var sortedBreakpoints = tslib_1.__spreadArray([], breakpoints, true).filter(function (bp) { return bp.breakpoint !== undefined; })
|
|
38
|
+
.sort(function (a, b) { var _a, _b; return ((_a = a.breakpoint) !== null && _a !== void 0 ? _a : 0) - ((_b = b.breakpoint) !== null && _b !== void 0 ? _b : 0); });
|
|
39
|
+
// Find the first breakpoint where viewport width is <= breakpoint
|
|
40
|
+
var matchedBreakpoint = sortedBreakpoints.find(function (bp) { var _a; return viewportWidth <= ((_a = bp.breakpoint) !== null && _a !== void 0 ? _a : 0); });
|
|
41
|
+
// Determine the base active slide:
|
|
42
|
+
// - if the consumer provided activeSlide, use it
|
|
43
|
+
// - otherwise align to slideToShow so the first real slide appears after any leading clones
|
|
44
|
+
var baseActiveSlide = (_b = (_a = config.activeSlide) !== null && _a !== void 0 ? _a : config.slideToShow) !== null && _b !== void 0 ? _b : 0;
|
|
45
|
+
var baseConfig = tslib_1.__assign(tslib_1.__assign({}, config), { activeSlide: baseActiveSlide });
|
|
46
|
+
console.log(baseActiveSlide);
|
|
47
|
+
// Merge base config with breakpoint overrides.
|
|
48
|
+
// If the breakpoint explicitly defines activeSlide, keep that; otherwise 0.
|
|
49
|
+
if (!(0, helpers_1.isObjectNotEmpty)(matchedBreakpoint)) {
|
|
50
|
+
return baseConfig;
|
|
51
|
+
}
|
|
52
|
+
console.log(baseActiveSlide, baseConfig);
|
|
53
|
+
var bp = matchedBreakpoint;
|
|
54
|
+
var resolvedSlideToShow = (_c = bp.slideToShow) !== null && _c !== void 0 ? _c : baseConfig.slideToShow;
|
|
55
|
+
var resolvedActiveSlide = (_e = (_d = bp.activeSlide) !== null && _d !== void 0 ? _d :
|
|
56
|
+
// Align to slideToShow so the first real slide is in view with cloned buffers
|
|
57
|
+
resolvedSlideToShow) !== null && _e !== void 0 ? _e : baseActiveSlide;
|
|
58
|
+
return tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, baseConfig), bp), { activeSlide: resolvedActiveSlide });
|
|
59
|
+
}
|
|
60
|
+
function useSliderBreakpoint(_a) {
|
|
61
|
+
var breakpoints = _a.breakpoints, config = _a.config;
|
|
62
|
+
// Initialize with resolved breakpoint config immediately on mount
|
|
63
|
+
var _b = (0, react_1.useState)(function () {
|
|
64
|
+
return resolveBreakpointConfig(breakpoints, config);
|
|
65
|
+
}), resolvedConfig = _b[0], setResolvedConfig = _b[1];
|
|
66
|
+
(0, react_1.useEffect)(function () {
|
|
67
|
+
if ((0, helpers_1.isObjectEmpty)(config)) {
|
|
68
|
+
setResolvedConfig(config);
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
function updateConfig() {
|
|
72
|
+
var newConfig = resolveBreakpointConfig(breakpoints, config);
|
|
73
|
+
// Avoid unnecessary updates
|
|
74
|
+
console.log(newConfig, 'yurtyertertewr');
|
|
75
|
+
setResolvedConfig(function (prevConfig) {
|
|
76
|
+
if (!(0, helpers_1.deepCompareObjects)(prevConfig, newConfig)) {
|
|
77
|
+
return newConfig;
|
|
78
|
+
}
|
|
79
|
+
return prevConfig;
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
// Update config on mount and resize
|
|
83
|
+
updateConfig();
|
|
84
|
+
Utils_1.safeWindow === null || Utils_1.safeWindow === void 0 ? void 0 : Utils_1.safeWindow.addEventListener('resize', updateConfig);
|
|
85
|
+
return function () {
|
|
86
|
+
Utils_1.safeWindow === null || Utils_1.safeWindow === void 0 ? void 0 : Utils_1.safeWindow.removeEventListener('resize', updateConfig);
|
|
87
|
+
};
|
|
88
|
+
}, [config, breakpoints]);
|
|
89
|
+
return resolvedConfig;
|
|
90
|
+
}
|
|
91
|
+
exports.default = useSliderBreakpoint;
|
|
92
|
+
//# sourceMappingURL=useSliderBreakpoint.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSliderBreakpoint.js","sourceRoot":"","sources":["../../../../src/components/Slider/useSliderBreakpoint.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* -----------------------------------------------------------------------------
|
|
3
|
+
* @file useSliderDimension
|
|
4
|
+
* -----------------------------------------------------------------------------
|
|
5
|
+
*
|
|
6
|
+
* @description React hook responsible for calculating and applying layout-related
|
|
7
|
+
* dimensions for a flex-based slider.
|
|
8
|
+
*
|
|
9
|
+
* This hook dynamically computes:
|
|
10
|
+
* - Slider container width
|
|
11
|
+
* - Slide flex-basis based on the number of visible slides
|
|
12
|
+
* - Gap between slides
|
|
13
|
+
*
|
|
14
|
+
* The calculated values are applied directly to the DOM and stored
|
|
15
|
+
* in shared slider refs for use by other slider utilities.
|
|
16
|
+
*
|
|
17
|
+
* Features:
|
|
18
|
+
* - Responsive slide sizing using container dimensions
|
|
19
|
+
* - Flex-based layout calculation
|
|
20
|
+
* - Centralized dimension updates
|
|
21
|
+
* - Safe DOM access via refs
|
|
22
|
+
*
|
|
23
|
+
* NOTE: this loc update when we have add the custom styling. loc no.:-69
|
|
24
|
+
* -----------------------------------------------------------------------------
|
|
25
|
+
* Copyright © 2025 BookingKoala. All rights reserved.
|
|
26
|
+
* -----------------------------------------------------------------------------
|
|
27
|
+
*/
|
|
28
|
+
import { type RefObject } from 'react';
|
|
29
|
+
import { type SlickSliderRefs } from './useSlider';
|
|
30
|
+
export interface UseSlickSliderDimensionProps {
|
|
31
|
+
gap: number;
|
|
32
|
+
sliderObjRefs: RefObject<SlickSliderRefs>;
|
|
33
|
+
sliderWrapperRef: RefObject<HTMLDivElement | null>;
|
|
34
|
+
slideToShow: number;
|
|
35
|
+
variant: 'horizontal' | 'vertical';
|
|
36
|
+
}
|
|
37
|
+
interface SlickSliderDimensionsReturn {
|
|
38
|
+
calculateDimensions: () => void;
|
|
39
|
+
}
|
|
40
|
+
declare function useSliderDimension({ gap, sliderObjRefs, sliderWrapperRef, slideToShow, variant, }: Readonly<UseSlickSliderDimensionProps>): SlickSliderDimensionsReturn;
|
|
41
|
+
export default useSliderDimension;
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
/**
|
|
4
|
+
* -----------------------------------------------------------------------------
|
|
5
|
+
* @file useSliderDimension
|
|
6
|
+
* -----------------------------------------------------------------------------
|
|
7
|
+
*
|
|
8
|
+
* @description React hook responsible for calculating and applying layout-related
|
|
9
|
+
* dimensions for a flex-based slider.
|
|
10
|
+
*
|
|
11
|
+
* This hook dynamically computes:
|
|
12
|
+
* - Slider container width
|
|
13
|
+
* - Slide flex-basis based on the number of visible slides
|
|
14
|
+
* - Gap between slides
|
|
15
|
+
*
|
|
16
|
+
* The calculated values are applied directly to the DOM and stored
|
|
17
|
+
* in shared slider refs for use by other slider utilities.
|
|
18
|
+
*
|
|
19
|
+
* Features:
|
|
20
|
+
* - Responsive slide sizing using container dimensions
|
|
21
|
+
* - Flex-based layout calculation
|
|
22
|
+
* - Centralized dimension updates
|
|
23
|
+
* - Safe DOM access via refs
|
|
24
|
+
*
|
|
25
|
+
* NOTE: this loc update when we have add the custom styling. loc no.:-69
|
|
26
|
+
* -----------------------------------------------------------------------------
|
|
27
|
+
* Copyright © 2025 BookingKoala. All rights reserved.
|
|
28
|
+
* -----------------------------------------------------------------------------
|
|
29
|
+
*/
|
|
30
|
+
var react_1 = require("react");
|
|
31
|
+
var helpers_1 = require("../../helpers");
|
|
32
|
+
function useSliderDimension(_a) {
|
|
33
|
+
var gap = _a.gap, sliderObjRefs = _a.sliderObjRefs, sliderWrapperRef = _a.sliderWrapperRef, slideToShow = _a.slideToShow, variant = _a.variant;
|
|
34
|
+
/**
|
|
35
|
+
* Calculates and applies slide dimensions based on slider orientation.
|
|
36
|
+
*
|
|
37
|
+
* - Sets the gap between slides.
|
|
38
|
+
* - For vertical sliders:
|
|
39
|
+
* - Calculates slide height including gap.
|
|
40
|
+
* - Sets the container height to show the required number of slides.
|
|
41
|
+
* - Switches layout to column direction.
|
|
42
|
+
* - For horizontal sliders:
|
|
43
|
+
* - Calculates available width after subtracting gaps.
|
|
44
|
+
* - Distributes width equally across visible slides using flex-basis.
|
|
45
|
+
*
|
|
46
|
+
* This function updates both DOM styles and cached dimensions
|
|
47
|
+
* used later for slide translation.
|
|
48
|
+
*/
|
|
49
|
+
var calculateSlideDimensions = (0, react_1.useCallback)(function (_a) {
|
|
50
|
+
var container = _a.container, rect = _a.rect;
|
|
51
|
+
if (!sliderObjRefs.current)
|
|
52
|
+
return;
|
|
53
|
+
container.style.setProperty('gap', "".concat(gap, "px"));
|
|
54
|
+
if (variant === 'vertical') {
|
|
55
|
+
var verticalSlideHight = container.children[0].clientHeight + gap;
|
|
56
|
+
Object.assign(sliderObjRefs.current, {
|
|
57
|
+
containerHeight: verticalSlideHight,
|
|
58
|
+
});
|
|
59
|
+
container.style.setProperty('height', "".concat(verticalSlideHight * slideToShow, "px"));
|
|
60
|
+
container.style.setProperty('flex-direction', 'column');
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
63
|
+
var containerWidth = rect.width;
|
|
64
|
+
var totalGap = gap * (slideToShow - 1);
|
|
65
|
+
var availableWidth = containerWidth - totalGap;
|
|
66
|
+
var slideWidthPx = availableWidth / slideToShow;
|
|
67
|
+
var flexBasisPercent = (slideWidthPx / containerWidth) * 100;
|
|
68
|
+
Object.assign(sliderObjRefs.current, {
|
|
69
|
+
containerWidth: containerWidth + gap,
|
|
70
|
+
});
|
|
71
|
+
Array.from(container.children).forEach(function (element) {
|
|
72
|
+
;
|
|
73
|
+
element.style.setProperty('flex', "0 0 ".concat(flexBasisPercent, "%"));
|
|
74
|
+
});
|
|
75
|
+
}, [gap, slideToShow, sliderObjRefs, variant]);
|
|
76
|
+
/**
|
|
77
|
+
* Calculates and applies slider dimensions based on the current container size.
|
|
78
|
+
* Safely accesses the slider container element, retrieves its bounding rectangle,
|
|
79
|
+
* and triggers the dimension calculation for slides.
|
|
80
|
+
* NOTE: currently for horizontal slider navigation
|
|
81
|
+
*/
|
|
82
|
+
var calculateDimensions = (0, react_1.useCallback)(function () {
|
|
83
|
+
var container = sliderWrapperRef.current;
|
|
84
|
+
if ((0, helpers_1.isNullOrUndefined)(container))
|
|
85
|
+
return;
|
|
86
|
+
var rect = container.getBoundingClientRect();
|
|
87
|
+
calculateSlideDimensions({ container: container, rect: rect });
|
|
88
|
+
}, [sliderWrapperRef, calculateSlideDimensions]);
|
|
89
|
+
return { calculateDimensions: calculateDimensions };
|
|
90
|
+
}
|
|
91
|
+
exports.default = useSliderDimension;
|
|
92
|
+
//# sourceMappingURL=useSliderDimension.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSliderDimension.js","sourceRoot":"","sources":["../../../../src/components/Slider/useSliderDimension.ts"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,+BAAmD;AACnD,yCAAiD;AAoBjD,SAAS,kBAAkB,CAAC,EAMa;QALvC,GAAG,SAAA,EACH,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,WAAW,iBAAA,EACX,OAAO,aAAA;IAEP;;;;;;;;;;;;;;OAcG;IACH,IAAM,wBAAwB,GAAG,IAAA,mBAAW,EAC1C,UAAC,EAAwC;YAAtC,SAAS,eAAA,EAAE,IAAI,UAAA;QAChB,IAAI,CAAC,aAAa,CAAC,OAAO;YAAE,OAAM;QAClC,SAAS,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,EAAE,UAAG,GAAG,OAAI,CAAC,CAAA;QAC9C,IAAI,OAAO,KAAK,UAAU,EAAE,CAAC;YAC3B,IAAM,kBAAkB,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,GAAG,CAAA;YACnE,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,OAAO,EAAE;gBACnC,eAAe,EAAE,kBAAkB;aACpC,CAAC,CAAA;YACF,SAAS,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,EAAE,UAAG,kBAAkB,GAAG,WAAW,OAAI,CAAC,CAAA;YAC9E,SAAS,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAA;YACvD,OAAM;QACR,CAAC;QAEO,IAAO,cAAc,GAAK,IAAI,MAAT,CAAS;QACtC,IAAM,QAAQ,GAAG,GAAG,GAAG,CAAC,WAAW,GAAG,CAAC,CAAC,CAAA;QACxC,IAAM,cAAc,GAAG,cAAc,GAAG,QAAQ,CAAA;QAChD,IAAM,YAAY,GAAG,cAAc,GAAG,WAAW,CAAA;QACjD,IAAM,gBAAgB,GAAG,CAAC,YAAY,GAAG,cAAc,CAAC,GAAG,GAAG,CAAA;QAC9D,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,OAAO,EAAE;YACnC,cAAc,EAAE,cAAc,GAAG,GAAG;SACrC,CAAC,CAAA;QACF,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,UAAC,OAAgB;YACtD,CAAC;YAAC,OAAuB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,EAAE,cAAO,gBAAgB,MAAG,CAAC,CAAA;QACjF,CAAC,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,GAAG,EAAE,WAAW,EAAE,aAAa,EAAE,OAAO,CAAC,CAC3C,CAAA;IAED;;;;;OAKG;IACH,IAAM,mBAAmB,GAAG,IAAA,mBAAW,EAAC;QACtC,IAAM,SAAS,GAAG,gBAAgB,CAAC,OAAO,CAAA;QAC1C,IAAI,IAAA,2BAAiB,EAAC,SAAS,CAAC;YAAE,OAAM;QACxC,IAAM,IAAI,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAA;QAC9C,wBAAwB,CAAC,EAAE,SAAS,EAAE,SAA2B,EAAE,IAAI,MAAA,EAAE,CAAC,CAAA;IAC5E,CAAC,EAAE,CAAC,gBAAgB,EAAE,wBAAwB,CAAC,CAAC,CAAA;IAEhD,OAAO,EAAE,mBAAmB,qBAAA,EAAE,CAAA;AAChC,CAAC;AAED,kBAAe,kBAAkB,CAAA"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* -----------------------------------------------------------------------------
|
|
3
|
+
* @file useSliderDraggable
|
|
4
|
+
* -----------------------------------------------------------------------------
|
|
5
|
+
*
|
|
6
|
+
* @description A custom React hook that enables pointer-based drag interactions
|
|
7
|
+
* for the Slick slider component.
|
|
8
|
+
*
|
|
9
|
+
* Responsibilities:
|
|
10
|
+
* - Attaches pointer event listeners to the slider container
|
|
11
|
+
* - Tracks drag state and movement distance
|
|
12
|
+
* - Applies real-time transforms during dragging
|
|
13
|
+
* - Determines swipe intent using a configurable threshold
|
|
14
|
+
* - Triggers next/previous slide navigation based on drag direction
|
|
15
|
+
* - Safely handles pointer cancellation and cleanup
|
|
16
|
+
*
|
|
17
|
+
* Behavior:
|
|
18
|
+
* - Dragging is enabled only when `draggable.enableDrag` is true
|
|
19
|
+
* - Horizontal movement controls slide navigation
|
|
20
|
+
* - Transitions are suppressed during drag and restored on release
|
|
21
|
+
* - Automatically cleans up listeners on unmount or ref changes
|
|
22
|
+
* -----------------------------------------------------------------------------
|
|
23
|
+
* Copyright © 2026 BookingKoala. All rights reserved.
|
|
24
|
+
* -----------------------------------------------------------------------------
|
|
25
|
+
*/
|
|
26
|
+
import { type RefObject } from 'react';
|
|
27
|
+
import { SlickSliderRefs } from './useSlider';
|
|
28
|
+
export interface UseSliderDraggableProps {
|
|
29
|
+
applyTransform: (val: number, withTransition?: boolean, isRaw?: boolean) => void;
|
|
30
|
+
calculateTranslate: (idx: number) => number;
|
|
31
|
+
draggable?: {
|
|
32
|
+
dragThreshold?: number;
|
|
33
|
+
enableDrag?: boolean;
|
|
34
|
+
};
|
|
35
|
+
handleNextSlide: () => void;
|
|
36
|
+
handlePrevSlide: () => void;
|
|
37
|
+
hasNextBtnDisabled: () => boolean;
|
|
38
|
+
hasPrevBtnDisabled: () => boolean;
|
|
39
|
+
sliderObjRefs: RefObject<SlickSliderRefs>;
|
|
40
|
+
sliderWrapperRef: RefObject<HTMLDivElement | null>;
|
|
41
|
+
}
|
|
42
|
+
declare function useSliderDraggable({ applyTransform, calculateTranslate, draggable, handleNextSlide, handlePrevSlide, hasNextBtnDisabled, hasPrevBtnDisabled, sliderObjRefs, sliderWrapperRef, }: UseSliderDraggableProps): void;
|
|
43
|
+
export default useSliderDraggable;
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
/**
|
|
4
|
+
* -----------------------------------------------------------------------------
|
|
5
|
+
* @file useSliderDraggable
|
|
6
|
+
* -----------------------------------------------------------------------------
|
|
7
|
+
*
|
|
8
|
+
* @description A custom React hook that enables pointer-based drag interactions
|
|
9
|
+
* for the Slick slider component.
|
|
10
|
+
*
|
|
11
|
+
* Responsibilities:
|
|
12
|
+
* - Attaches pointer event listeners to the slider container
|
|
13
|
+
* - Tracks drag state and movement distance
|
|
14
|
+
* - Applies real-time transforms during dragging
|
|
15
|
+
* - Determines swipe intent using a configurable threshold
|
|
16
|
+
* - Triggers next/previous slide navigation based on drag direction
|
|
17
|
+
* - Safely handles pointer cancellation and cleanup
|
|
18
|
+
*
|
|
19
|
+
* Behavior:
|
|
20
|
+
* - Dragging is enabled only when `draggable.enableDrag` is true
|
|
21
|
+
* - Horizontal movement controls slide navigation
|
|
22
|
+
* - Transitions are suppressed during drag and restored on release
|
|
23
|
+
* - Automatically cleans up listeners on unmount or ref changes
|
|
24
|
+
* -----------------------------------------------------------------------------
|
|
25
|
+
* Copyright © 2026 BookingKoala. All rights reserved.
|
|
26
|
+
* -----------------------------------------------------------------------------
|
|
27
|
+
*/
|
|
28
|
+
var react_1 = require("react");
|
|
29
|
+
var helpers_1 = require("../../helpers");
|
|
30
|
+
function useSliderDraggable(_a) {
|
|
31
|
+
var applyTransform = _a.applyTransform, calculateTranslate = _a.calculateTranslate, draggable = _a.draggable, handleNextSlide = _a.handleNextSlide, handlePrevSlide = _a.handlePrevSlide, hasNextBtnDisabled = _a.hasNextBtnDisabled, hasPrevBtnDisabled = _a.hasPrevBtnDisabled, sliderObjRefs = _a.sliderObjRefs, sliderWrapperRef = _a.sliderWrapperRef;
|
|
32
|
+
(0, react_1.useEffect)(function () {
|
|
33
|
+
var _a = (0, helpers_1.destructObj)(draggable), _b = _a.dragThreshold, dragThreshold = _b === void 0 ? 200 : _b, _c = _a.enableDrag, enableDrag = _c === void 0 ? true : _c;
|
|
34
|
+
if (!sliderObjRefs.current)
|
|
35
|
+
return undefined;
|
|
36
|
+
var _d = (0, helpers_1.destructObj)(sliderObjRefs.current), currentIndex = _d.currentIndex, drag = _d.drag;
|
|
37
|
+
var container = sliderWrapperRef.current;
|
|
38
|
+
if (!enableDrag || (0, helpers_1.isNullOrUndefined)(container))
|
|
39
|
+
return undefined;
|
|
40
|
+
/**
|
|
41
|
+
* Handles the pointer down event to initiate a drag interaction.
|
|
42
|
+
* - Captures the pointer to continue receiving move/up events
|
|
43
|
+
* even if the pointer leaves the container
|
|
44
|
+
* - Initializes drag state (start position and reset translate)
|
|
45
|
+
*/
|
|
46
|
+
function handlePointerDown(event) {
|
|
47
|
+
if ((0, helpers_1.isNullOrUndefined)(container))
|
|
48
|
+
return;
|
|
49
|
+
container.setPointerCapture(event.pointerId);
|
|
50
|
+
Object.assign(drag, {
|
|
51
|
+
isDragging: true,
|
|
52
|
+
startX: event.clientX,
|
|
53
|
+
startY: event.clientY,
|
|
54
|
+
translate: 0,
|
|
55
|
+
});
|
|
56
|
+
(0, helpers_1.preventDefault)(event);
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Handles pointer move events during an active drag gesture.
|
|
60
|
+
* - Runs only while dragging is in progress
|
|
61
|
+
* - Calculates horizontal movement delta from the initial pointer position
|
|
62
|
+
* - Updates drag translate value for threshold / direction detection
|
|
63
|
+
* - Applies a real-time transform without transition for smooth dragging
|
|
64
|
+
*/
|
|
65
|
+
function handlePointerMove(event) {
|
|
66
|
+
if ((0, helpers_1.isNullOrUndefined)(container) || !drag.isDragging)
|
|
67
|
+
return;
|
|
68
|
+
var delta = event.clientX - drag.startX;
|
|
69
|
+
var base = calculateTranslate(currentIndex);
|
|
70
|
+
Object.assign(drag, { translate: delta });
|
|
71
|
+
applyTransform(delta + base, false, true);
|
|
72
|
+
(0, helpers_1.preventDefault)(event);
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Handles the pointer up event to finalize a drag interaction.
|
|
76
|
+
* - Releases pointer capture to stop receiving pointer events
|
|
77
|
+
* - Evaluates total drag distance against the configured threshold
|
|
78
|
+
* - Triggers slide navigation based on drag direction and availability
|
|
79
|
+
* - Reverts to the current slide if the drag is insufficient or navigation is disabled
|
|
80
|
+
*/
|
|
81
|
+
function handlePointerUp(event) {
|
|
82
|
+
if ((0, helpers_1.isNullOrUndefined)(container) || !drag.isDragging)
|
|
83
|
+
return;
|
|
84
|
+
container.releasePointerCapture(event.pointerId);
|
|
85
|
+
var translate = drag.translate;
|
|
86
|
+
Object.assign(drag, { isDragging: false });
|
|
87
|
+
if (Math.abs(translate) <= dragThreshold) {
|
|
88
|
+
applyTransform(currentIndex, true);
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
if (translate < 0 && !hasNextBtnDisabled()) {
|
|
92
|
+
handleNextSlide();
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
if (translate > 0 && !hasPrevBtnDisabled()) {
|
|
96
|
+
handlePrevSlide();
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
applyTransform(currentIndex, true);
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* Handles pointer cancel events to safely abort an active drag interaction.
|
|
103
|
+
* - Triggered when the browser cancels the pointer sequence
|
|
104
|
+
* (e.g., touch interruption, context menu, lost capture)
|
|
105
|
+
* - Releases pointer capture to avoid stuck pointer states
|
|
106
|
+
* - Resets dragging state
|
|
107
|
+
* - Smoothly reverts the slider back to the current active slid.
|
|
108
|
+
*/
|
|
109
|
+
function handlePointerCancel(event) {
|
|
110
|
+
if ((0, helpers_1.isNullOrUndefined)(container) || !drag.isDragging)
|
|
111
|
+
return;
|
|
112
|
+
container.releasePointerCapture(event.pointerId);
|
|
113
|
+
Object.assign(drag, { isDragging: false });
|
|
114
|
+
applyTransform(currentIndex, true);
|
|
115
|
+
}
|
|
116
|
+
/**
|
|
117
|
+
* Registers pointer event listeners on the slider container
|
|
118
|
+
* to enable drag-based interactions.
|
|
119
|
+
*
|
|
120
|
+
* Cleanup ensures all listeners are removed when the component
|
|
121
|
+
* unmounts or the container reference changes, preventing
|
|
122
|
+
* memory leaks and duplicate handlers.
|
|
123
|
+
*/
|
|
124
|
+
container.addEventListener('pointerdown', handlePointerDown);
|
|
125
|
+
container.addEventListener('pointermove', handlePointerMove);
|
|
126
|
+
container.addEventListener('pointerup', handlePointerUp);
|
|
127
|
+
container.addEventListener('pointercancel', handlePointerCancel);
|
|
128
|
+
/**
|
|
129
|
+
* Restrict touch gestures to vertical scrolling only (pan-y),allowing smooth page scroll while
|
|
130
|
+
* preventing horizontal touch interference during slider drag interactions.
|
|
131
|
+
*/
|
|
132
|
+
var touchActionAxis = 'pan-y';
|
|
133
|
+
Object.assign(container.style, { touchAction: touchActionAxis });
|
|
134
|
+
return function () {
|
|
135
|
+
if ((0, helpers_1.isNullOrUndefined)(container))
|
|
136
|
+
return;
|
|
137
|
+
container.removeEventListener('pointerdown', handlePointerDown);
|
|
138
|
+
container.removeEventListener('pointermove', handlePointerMove);
|
|
139
|
+
container.removeEventListener('pointerup', handlePointerUp);
|
|
140
|
+
container.removeEventListener('pointercancel', handlePointerCancel);
|
|
141
|
+
Object.assign(container.style, { touchAction: '' });
|
|
142
|
+
};
|
|
143
|
+
}, [sliderObjRefs, handleNextSlide, handlePrevSlide, hasNextBtnDisabled, handlePrevSlide]);
|
|
144
|
+
}
|
|
145
|
+
exports.default = useSliderDraggable;
|
|
146
|
+
//# sourceMappingURL=useSliderDraggable.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSliderDraggable.js","sourceRoot":"","sources":["../../../../src/components/Slider/useSliderDraggable.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* -----------------------------------------------------------------------------
|
|
3
|
+
* @file useSliderNavigation
|
|
4
|
+
* -----------------------------------------------------------------------------
|
|
5
|
+
*
|
|
6
|
+
* @description This hook is responsible for handling all slider navigation logic.
|
|
7
|
+
*
|
|
8
|
+
* Features:
|
|
9
|
+
* - Handles next slide navigation
|
|
10
|
+
* - Handles previous slide navigation
|
|
11
|
+
* - Controls next button disabled state
|
|
12
|
+
* - Controls previous button disabled state
|
|
13
|
+
* - Provides the active indicator index
|
|
14
|
+
* - Calculates the total number of indicators
|
|
15
|
+
*
|
|
16
|
+
* -----------------------------------------------------------------------------
|
|
17
|
+
* Copyright © 2025 BookingKoala. All rights reserved.
|
|
18
|
+
* -----------------------------------------------------------------------------
|
|
19
|
+
*/
|
|
20
|
+
import { type SlickSliderRefs } from './useSlider';
|
|
21
|
+
interface UseSlickSliderNavigationReturn {
|
|
22
|
+
getActiveIndicatorIndex: () => number | undefined;
|
|
23
|
+
getIndicatorCount: () => number | undefined;
|
|
24
|
+
goToSlideIndicator: (indicatorIndex: number) => void;
|
|
25
|
+
handleNextSlide: () => void;
|
|
26
|
+
handlePrevSlide: () => void;
|
|
27
|
+
hasNextBtnDisabled: () => boolean;
|
|
28
|
+
hasPrevBtnDisabled: () => boolean;
|
|
29
|
+
}
|
|
30
|
+
interface UseSlickSliderDimensionsProps {
|
|
31
|
+
activeSlide: number;
|
|
32
|
+
applyTransform: (indexOrTranslate: number, withTransition?: boolean) => void;
|
|
33
|
+
loop: boolean;
|
|
34
|
+
sliderObjRefs: React.RefObject<SlickSliderRefs>;
|
|
35
|
+
sliderWrapperRef: React.RefObject<HTMLDivElement | null>;
|
|
36
|
+
slideToScroll: number;
|
|
37
|
+
slideToShow: number;
|
|
38
|
+
speed?: number;
|
|
39
|
+
}
|
|
40
|
+
declare function useSliderNavigation({ activeSlide, applyTransform, loop, sliderObjRefs, slideToScroll, slideToShow, speed, }: UseSlickSliderDimensionsProps): UseSlickSliderNavigationReturn;
|
|
41
|
+
export default useSliderNavigation;
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* -----------------------------------------------------------------------------
|
|
4
|
+
* @file useSliderNavigation
|
|
5
|
+
* -----------------------------------------------------------------------------
|
|
6
|
+
*
|
|
7
|
+
* @description This hook is responsible for handling all slider navigation logic.
|
|
8
|
+
*
|
|
9
|
+
* Features:
|
|
10
|
+
* - Handles next slide navigation
|
|
11
|
+
* - Handles previous slide navigation
|
|
12
|
+
* - Controls next button disabled state
|
|
13
|
+
* - Controls previous button disabled state
|
|
14
|
+
* - Provides the active indicator index
|
|
15
|
+
* - Calculates the total number of indicators
|
|
16
|
+
*
|
|
17
|
+
* -----------------------------------------------------------------------------
|
|
18
|
+
* Copyright © 2025 BookingKoala. All rights reserved.
|
|
19
|
+
* -----------------------------------------------------------------------------
|
|
20
|
+
*/
|
|
21
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
22
|
+
var react_1 = require("react");
|
|
23
|
+
// this string used for the navigate with throttle
|
|
24
|
+
var ctrlBtnString = 'ctrlBtn';
|
|
25
|
+
function useSliderNavigation(_a) {
|
|
26
|
+
var activeSlide = _a.activeSlide, applyTransform = _a.applyTransform, loop = _a.loop, sliderObjRefs = _a.sliderObjRefs, slideToScroll = _a.slideToScroll, slideToShow = _a.slideToShow, _b = _a.speed, speed = _b === void 0 ? 500 : _b;
|
|
27
|
+
// State
|
|
28
|
+
var _c = (0, react_1.useState)(activeSlide), currentSlideIndex = _c[0], setCurrentSlideIndex = _c[1];
|
|
29
|
+
/**
|
|
30
|
+
* Calculates the currently active indicator index based on slide position.
|
|
31
|
+
*/
|
|
32
|
+
var getActiveIndicatorIndex = (0, react_1.useCallback)(function () { return Math.floor(currentSlideIndex / slideToShow); }, [currentSlideIndex, slideToShow]);
|
|
33
|
+
/**
|
|
34
|
+
* Computes the total number of indicators required for the slider.
|
|
35
|
+
*/
|
|
36
|
+
var getIndicatorCount = (0, react_1.useCallback)(function () {
|
|
37
|
+
if (!sliderObjRefs.current)
|
|
38
|
+
return undefined;
|
|
39
|
+
var totalSlides = sliderObjRefs.current.totalSlides;
|
|
40
|
+
return Math.max(1, Math.ceil(totalSlides / slideToShow));
|
|
41
|
+
}, [sliderObjRefs, slideToShow]);
|
|
42
|
+
/**
|
|
43
|
+
* Moves the slider to a given slide index.
|
|
44
|
+
* - Stops execution if a slide animation is already running and the action
|
|
45
|
+
* was triggered by next/prev buttons (prevents rapid clicks).
|
|
46
|
+
* - Updates internal state and refs to point to the target slide.
|
|
47
|
+
* - Applies a smooth transition to move the slider.
|
|
48
|
+
* - If looping is disabled:
|
|
49
|
+
* - Finishes after the animation and exits.
|
|
50
|
+
*
|
|
51
|
+
* - If looping is enabled (infinite slider):
|
|
52
|
+
* - Waits for the animation to finish.
|
|
53
|
+
* - Adjusts the slide index so it stays within valid bounds.
|
|
54
|
+
* - Instantly moves the slider (without animation) to the corrected position.
|
|
55
|
+
* - Updates internal state and refs.
|
|
56
|
+
*
|
|
57
|
+
* This logic creates a smooth infinite scrolling effect.
|
|
58
|
+
*/
|
|
59
|
+
var gotoSlideItem = (0, react_1.useCallback)(function (targetIndex, type) {
|
|
60
|
+
if (!sliderObjRefs.current)
|
|
61
|
+
return;
|
|
62
|
+
var _a = sliderObjRefs.current, isTransitionComplete = _a.isTransitionComplete, totalSlides = _a.totalSlides;
|
|
63
|
+
if (isTransitionComplete && type === 'ctrlBtn')
|
|
64
|
+
return;
|
|
65
|
+
Object.assign(sliderObjRefs.current, { currentIndex: targetIndex, isTransitionComplete: true });
|
|
66
|
+
setCurrentSlideIndex(targetIndex);
|
|
67
|
+
applyTransform(targetIndex, true);
|
|
68
|
+
if (!loop) {
|
|
69
|
+
Object.assign(sliderObjRefs.current, { isTransitionComplete: false });
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
setTimeout(function () {
|
|
73
|
+
if (!sliderObjRefs.current)
|
|
74
|
+
return;
|
|
75
|
+
var currentIndex = sliderObjRefs.current.currentIndex;
|
|
76
|
+
var loopedIndex = ((currentIndex % totalSlides) + totalSlides) % totalSlides;
|
|
77
|
+
var finalIndex = Math.min(loopedIndex, totalSlides);
|
|
78
|
+
applyTransform(finalIndex, false);
|
|
79
|
+
Object.assign(sliderObjRefs.current, { currentIndex: finalIndex, isTransitionComplete: false });
|
|
80
|
+
setCurrentSlideIndex(finalIndex);
|
|
81
|
+
}, speed);
|
|
82
|
+
}, [sliderObjRefs, setCurrentSlideIndex, applyTransform, loop, speed]);
|
|
83
|
+
/** Navigates to a slide based on indicator (dot) index. */
|
|
84
|
+
var goToSlideIndicator = (0, react_1.useCallback)(function (indicatorIndex) {
|
|
85
|
+
var targetSlideIndex = indicatorIndex * slideToShow;
|
|
86
|
+
gotoSlideItem(targetSlideIndex);
|
|
87
|
+
}, [slideToShow, gotoSlideItem]);
|
|
88
|
+
/** Function responsible for handling the next slide. */
|
|
89
|
+
var handleNextSlide = (0, react_1.useCallback)(function () {
|
|
90
|
+
if (!sliderObjRefs.current)
|
|
91
|
+
return;
|
|
92
|
+
var currentIdx = sliderObjRefs.current.currentIndex;
|
|
93
|
+
var nextIndex = currentIdx + slideToScroll;
|
|
94
|
+
gotoSlideItem(nextIndex, ctrlBtnString);
|
|
95
|
+
}, [gotoSlideItem, sliderObjRefs, slideToScroll]);
|
|
96
|
+
/** Function responsible for handling the prev slide. */
|
|
97
|
+
var handlePrevSlide = (0, react_1.useCallback)(function () {
|
|
98
|
+
if (!sliderObjRefs.current)
|
|
99
|
+
return;
|
|
100
|
+
var currentIdx = sliderObjRefs.current.currentIndex;
|
|
101
|
+
var prevIndex = currentIdx - slideToScroll;
|
|
102
|
+
gotoSlideItem(prevIndex, ctrlBtnString);
|
|
103
|
+
}, [gotoSlideItem, sliderObjRefs, slideToScroll]);
|
|
104
|
+
/**
|
|
105
|
+
* function determines whether the slider can navigate to the next set of slides.
|
|
106
|
+
* Always returns true when looping is enabled.
|
|
107
|
+
*/
|
|
108
|
+
var hasNextBtnDisabled = (0, react_1.useCallback)(function () {
|
|
109
|
+
if (!sliderObjRefs.current)
|
|
110
|
+
return true;
|
|
111
|
+
var totalSlides = sliderObjRefs.current.totalSlides;
|
|
112
|
+
if (loop)
|
|
113
|
+
return false;
|
|
114
|
+
return currentSlideIndex > totalSlides - slideToShow;
|
|
115
|
+
}, [currentSlideIndex, slideToShow, sliderObjRefs, loop]);
|
|
116
|
+
/**
|
|
117
|
+
* function determines whether the slider can navigate to the previous set of slides.
|
|
118
|
+
* Always returns true when looping is enabled.
|
|
119
|
+
*/
|
|
120
|
+
var hasPrevBtnDisabled = (0, react_1.useCallback)(function () {
|
|
121
|
+
if (loop)
|
|
122
|
+
return false;
|
|
123
|
+
return currentSlideIndex <= 0;
|
|
124
|
+
}, [currentSlideIndex, loop]);
|
|
125
|
+
return {
|
|
126
|
+
getActiveIndicatorIndex: getActiveIndicatorIndex,
|
|
127
|
+
getIndicatorCount: getIndicatorCount,
|
|
128
|
+
goToSlideIndicator: goToSlideIndicator,
|
|
129
|
+
handleNextSlide: handleNextSlide,
|
|
130
|
+
handlePrevSlide: handlePrevSlide,
|
|
131
|
+
hasNextBtnDisabled: hasNextBtnDisabled,
|
|
132
|
+
hasPrevBtnDisabled: hasPrevBtnDisabled,
|
|
133
|
+
};
|
|
134
|
+
}
|
|
135
|
+
exports.default = useSliderNavigation;
|
|
136
|
+
//# sourceMappingURL=useSliderNavigation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSliderNavigation.js","sourceRoot":"","sources":["../../../../src/components/Slider/useSliderNavigation.ts"],"names":[],"mappings":"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"}
|