@seeqdev/qomponents 0.0.125 → 0.0.126
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/Alert/Alert.js +1 -1
- package/dist/Alert/Alert.js.map +1 -1
- package/dist/Carousel/Carousel.d.ts +9 -0
- package/dist/Carousel/Carousel.js +17 -12
- package/dist/Carousel/Carousel.js.map +1 -1
- package/dist/Carousel/Carousel.stories.d.ts +5 -0
- package/dist/Carousel/Carousel.stories.js +48 -48
- package/dist/Carousel/Carousel.stories.js.map +1 -1
- package/dist/Carousel/Carousel.test.d.ts +1 -0
- package/dist/Carousel/Carousel.test.js +1 -1
- package/dist/Carousel/Carousel.test.js.map +1 -1
- package/dist/Carousel/Carousel.types.d.ts +23 -0
- package/dist/Carousel/index.d.ts +1 -0
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/Alert/Alert.js
CHANGED
|
@@ -29,6 +29,6 @@ export const Alert = ({ children, dismissible = true, onClose, show = true, vari
|
|
|
29
29
|
}
|
|
30
30
|
return (React.createElement("div", { "data-testid": testId, id: id, className: appliedClasses },
|
|
31
31
|
children,
|
|
32
|
-
dismissible && (React.createElement(Icon, { icon: "fc-delete", type: variant.match(/danger|warning/) ? 'color' : 'theme', color: variant.match(/danger|warning/) ? 'inherit' : undefined, extraClassNames: `tw-self-end tw-text-[11px] tw-cursor-pointer tw-absolute tw-right-[10px] tw-top-[10px] ${variant.match(/danger|warning|gray/) ? 'tw-text-sq-text-color dark:tw-text-sq-
|
|
32
|
+
dismissible && (React.createElement(Icon, { icon: "fc-delete", type: variant.match(/danger|warning/) ? 'color' : 'theme', color: variant.match(/danger|warning/) ? 'inherit' : undefined, extraClassNames: `tw-self-end tw-text-[11px] tw-cursor-pointer tw-absolute tw-right-[10px] tw-top-[10px] ${variant.match(/danger|warning|gray/) ? 'tw-text-sq-text-color dark:tw-text-sq-text-color' : ''}`, testId: `${testId}-close-btn`, onClick: onClose, ...tooltipProps }))));
|
|
33
33
|
};
|
|
34
34
|
//# sourceMappingURL=Alert.js.map
|
package/dist/Alert/Alert.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,IAAI,MAAM,SAAS,CAAC;AAI3B,MAAM,WAAW,GACf,yGAAyG;IACzG,6FAA6F,CAAC;AAEhG,MAAM,SAAS,GAAG,4DAA4D,CAAC;AAC/E,MAAM,UAAU,GAAG,8CAA8C,CAAC;AAElE,MAAM,YAAY,GAAG,2BAA2B,CAAC;AAEjD,MAAM,kBAAkB,GAAG,yBAAyB,CAAC;AAErD;;GAEG;AACH,MAAM,CAAC,MAAM,KAAK,GAAwC,CAAC,EACzD,QAAQ,EACR,WAAW,GAAG,IAAI,EAClB,OAAO,EACP,IAAI,GAAG,IAAI,EACX,OAAO,EACP,MAAM,GAAG,UAAU,EACnB,EAAE,EACF,eAAe,EACf,GAAG,YAAY,EAChB,EAAE,EAAE;IACH,MAAM,YAAY,GAA0C;QAC1D,KAAK,EAAE,GAAG,UAAU,IAAI,SAAS,EAAE;QACnC,MAAM,EAAE,6CAA6C;QACrD,OAAO,EAAE,iDAAiD;QAC1D,IAAI,EAAE,sGAAsG;KAC7G,CAAC;IACF,MAAM,kBAAkB,GAA0C;QAChE,KAAK,EAAE,kBAAkB;QACzB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,gBAAgB;QACzB,IAAI,EAAE,2BAA2B;KAClC,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,YAAY,CAAC,OAAO,CAAC,IAAI,eAAe,IAAI,kBAAkB,CAAC,OAAO,CAAC,EAAE,CAAC;IAEnH,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,gCAAO,CAAC;KAChB;IACD,OAAO,CACL,4CAAkB,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,cAAc;QACxD,QAAQ;QACR,WAAW,IAAI,CACd,oBAAC,IAAI,IACH,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACzD,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAC9D,eAAe,EAAE,0FACf,OAAO,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,IAAI,MAAM,SAAS,CAAC;AAI3B,MAAM,WAAW,GACf,yGAAyG;IACzG,6FAA6F,CAAC;AAEhG,MAAM,SAAS,GAAG,4DAA4D,CAAC;AAC/E,MAAM,UAAU,GAAG,8CAA8C,CAAC;AAElE,MAAM,YAAY,GAAG,2BAA2B,CAAC;AAEjD,MAAM,kBAAkB,GAAG,yBAAyB,CAAC;AAErD;;GAEG;AACH,MAAM,CAAC,MAAM,KAAK,GAAwC,CAAC,EACzD,QAAQ,EACR,WAAW,GAAG,IAAI,EAClB,OAAO,EACP,IAAI,GAAG,IAAI,EACX,OAAO,EACP,MAAM,GAAG,UAAU,EACnB,EAAE,EACF,eAAe,EACf,GAAG,YAAY,EAChB,EAAE,EAAE;IACH,MAAM,YAAY,GAA0C;QAC1D,KAAK,EAAE,GAAG,UAAU,IAAI,SAAS,EAAE;QACnC,MAAM,EAAE,6CAA6C;QACrD,OAAO,EAAE,iDAAiD;QAC1D,IAAI,EAAE,sGAAsG;KAC7G,CAAC;IACF,MAAM,kBAAkB,GAA0C;QAChE,KAAK,EAAE,kBAAkB;QACzB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,gBAAgB;QACzB,IAAI,EAAE,2BAA2B;KAClC,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,YAAY,CAAC,OAAO,CAAC,IAAI,eAAe,IAAI,kBAAkB,CAAC,OAAO,CAAC,EAAE,CAAC;IAEnH,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,gCAAO,CAAC;KAChB;IACD,OAAO,CACL,4CAAkB,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,cAAc;QACxD,QAAQ;QACR,WAAW,IAAI,CACd,oBAAC,IAAI,IACH,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACzD,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAC9D,eAAe,EAAE,0FACf,OAAO,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,kDAAkD,CAAC,CAAC,CAAC,EAC9F,EAAE,EACF,MAAM,EAAE,GAAG,MAAM,YAAY,EAC7B,OAAO,EAAE,OAAO,KACZ,YAAY,GAChB,CACH,CACG,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { CarouselProps } from './Carousel.types';
|
|
3
|
+
/**
|
|
4
|
+
* Carousel:
|
|
5
|
+
* - Easily create a carousel with custom slides.
|
|
6
|
+
* - Supports automatic sliding, navigation arrows, and slide indicators.
|
|
7
|
+
*/
|
|
8
|
+
declare const Carousel: React.FunctionComponent<CarouselProps>;
|
|
9
|
+
export default Carousel;
|
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
import React, { useEffect, useState } from 'react';
|
|
2
2
|
import { animated, useTransition } from '@react-spring/web';
|
|
3
3
|
import Button from '../Button/Button';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
/**
|
|
5
|
+
* Carousel:
|
|
6
|
+
* - Easily create a carousel with custom slides.
|
|
7
|
+
* - Supports automatic sliding, navigation arrows, and slide indicators.
|
|
8
|
+
*/
|
|
9
|
+
const Carousel = ({ testId = 'carousel-id', activeIndex = 0, extraClassNames = '', onSlide = () => { }, autoSlide, showIndicators = true, continuous = true, interval = 4000, prevIcon = 'fc-arrow-dropdown tw-rotate-90', nextIcon = 'fc-arrow-dropdown -tw-rotate-90', showArrows = true, iconExtraClassNames = '', carouselItems = [], }) => {
|
|
10
|
+
const [currentIndex, setCurrentIndex] = useState(activeIndex);
|
|
7
11
|
const changeSlide = (nextIndex) => {
|
|
8
|
-
|
|
9
|
-
|
|
12
|
+
const newIndex = nextIndex % carouselItems.length;
|
|
13
|
+
setCurrentIndex(newIndex);
|
|
14
|
+
onSlide(newIndex, newIndex > currentIndex ? 'right' : 'left');
|
|
10
15
|
};
|
|
11
16
|
useEffect(() => {
|
|
12
17
|
if (autoSlide) {
|
|
13
18
|
const currentInterval = setInterval(() => {
|
|
14
|
-
if (
|
|
19
|
+
if (continuous) {
|
|
15
20
|
setCurrentIndex((prevCurrentIndex) => {
|
|
16
21
|
onSlide((prevCurrentIndex + 1) % carouselItems.length, (prevCurrentIndex + 1) % carouselItems.length > prevCurrentIndex ? 'right' : 'left');
|
|
17
22
|
return (prevCurrentIndex + 1) % carouselItems.length;
|
|
@@ -26,13 +31,13 @@ const Carousel = (props) => {
|
|
|
26
31
|
}, interval);
|
|
27
32
|
return () => clearInterval(currentInterval);
|
|
28
33
|
}
|
|
29
|
-
}, []);
|
|
34
|
+
}, [autoSlide]);
|
|
30
35
|
useEffect(() => {
|
|
31
36
|
if (activeIndex && activeIndex !== currentIndex) {
|
|
32
37
|
setCurrentIndex(activeIndex);
|
|
33
38
|
}
|
|
34
39
|
}, [activeIndex]);
|
|
35
|
-
const transitions = useTransition(currentIndex, {
|
|
40
|
+
const transitions = useTransition([currentIndex], {
|
|
36
41
|
keys: null,
|
|
37
42
|
exitBeforeEnter: true,
|
|
38
43
|
from: { transform: 'translate3d(100%,0,0)' },
|
|
@@ -40,22 +45,22 @@ const Carousel = (props) => {
|
|
|
40
45
|
leave: { transform: 'translate3d(0%,0,0)' },
|
|
41
46
|
});
|
|
42
47
|
const onBackClick = () => {
|
|
43
|
-
if (currentIndex === 0 && !
|
|
48
|
+
if (currentIndex === 0 && !continuous) {
|
|
44
49
|
return;
|
|
45
50
|
}
|
|
46
51
|
changeSlide((currentIndex - 1) % carouselItems.length);
|
|
47
52
|
};
|
|
48
53
|
const onForwardClick = () => {
|
|
49
|
-
if (currentIndex === carouselItems.length - 1 && !
|
|
54
|
+
if (currentIndex === carouselItems.length - 1 && !continuous) {
|
|
50
55
|
return;
|
|
51
56
|
}
|
|
52
57
|
changeSlide((currentIndex + 1) % carouselItems.length);
|
|
53
58
|
};
|
|
54
59
|
return (React.createElement("div", { "data-testid": testId, className: `tw-flex tw-flex-col tw-items-center tw-justify-center tw-w-full ${extraClassNames}` },
|
|
55
60
|
React.createElement("div", { className: "tw-flex tw-items-center tw-w-full tw-h-max tw-gap-1" },
|
|
56
|
-
showArrows && (React.createElement(Button, { icon: prevIcon, size: "lg", variant: "no-border", testId: "carousel-prev", extraClassNames: `${currentIndex === 0 && !
|
|
61
|
+
showArrows && (React.createElement(Button, { icon: prevIcon, size: "lg", variant: "no-border", testId: "carousel-prev", extraClassNames: `${currentIndex === 0 && !continuous ? 'tw-invisible' : ''} ${iconExtraClassNames} tw-animate-fadeIn`, onClick: onBackClick })),
|
|
57
62
|
transitions((style, i) => (React.createElement(animated.div, { "data-testid": `${testId}-${currentIndex}`, style: style }, carouselItems[currentIndex]))),
|
|
58
|
-
showArrows && (React.createElement(Button, { icon: nextIcon, testId: "carousel-next", size: "lg", variant: "no-border", extraClassNames: `${currentIndex === carouselItems.length - 1 && !
|
|
63
|
+
showArrows && (React.createElement(Button, { icon: nextIcon, testId: "carousel-next", size: "lg", variant: "no-border", extraClassNames: `${currentIndex === carouselItems.length - 1 && !continuous ? 'tw-invisible' : ''} ${iconExtraClassNames} tw-animate-fadeIn`, onClick: onForwardClick }))),
|
|
59
64
|
showIndicators && (React.createElement("div", { className: "tw-flex tw-gap-1 tw-mt-2" }, carouselItems.map((_, i) => (React.createElement("div", { key: i, className: `tw-w-2 tw-h-2 tw-rounded-full tw-cursor-pointer ${i === currentIndex ? 'tw-bg-sq-color-dark' : 'tw-bg-sq-darkish-gray'}`, onClick: () => changeSlide(i) })))))));
|
|
60
65
|
};
|
|
61
66
|
export default Carousel;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../src/Carousel/Carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAU,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAEtC,MAAM,QAAQ,GAA2C,CAAC,
|
|
1
|
+
{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../src/Carousel/Carousel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -15,88 +15,88 @@ export const AllCarousels = () => {
|
|
|
15
15
|
React.createElement("div", { className: "tw-p-4" },
|
|
16
16
|
React.createElement("p", null, "Controlled"),
|
|
17
17
|
React.createElement(Carousel, { carouselItems: [
|
|
18
|
-
renderChild('
|
|
19
|
-
renderChild('Second
|
|
20
|
-
renderChild('
|
|
18
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
19
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
20
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
21
21
|
], activeIndex: value, onSlide: (index) => setValue(index) })),
|
|
22
22
|
React.createElement("div", { className: "tw-p-4" },
|
|
23
23
|
React.createElement("p", null, "Uncontrolled"),
|
|
24
24
|
React.createElement(Carousel, { carouselItems: [
|
|
25
|
-
renderChild('
|
|
26
|
-
renderChild('Second
|
|
27
|
-
renderChild('
|
|
28
|
-
], autoSlide: true,
|
|
25
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
26
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
27
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
28
|
+
], autoSlide: true, continuous: true, showArrows: false })),
|
|
29
29
|
React.createElement("div", { className: "tw-p-4" },
|
|
30
30
|
React.createElement("p", null, "Custom side buttons"),
|
|
31
31
|
React.createElement(Carousel, { carouselItems: [
|
|
32
|
-
renderChild('
|
|
33
|
-
renderChild('Second
|
|
34
|
-
renderChild('
|
|
32
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
33
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
34
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
35
35
|
], activeIndex: value, onSlide: (index) => setValue(index), nextIcon: "fc-more", prevIcon: "fc-y-axis" })),
|
|
36
36
|
React.createElement("div", { className: "tw-p-4" },
|
|
37
|
-
React.createElement("p", null, "
|
|
37
|
+
React.createElement("p", null, "Continuous"),
|
|
38
38
|
React.createElement(Carousel, { carouselItems: [
|
|
39
|
-
renderChild('
|
|
40
|
-
renderChild('Second
|
|
41
|
-
renderChild('
|
|
42
|
-
], activeIndex: value, onSlide: (index) => setValue(index),
|
|
39
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
40
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
41
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
42
|
+
], activeIndex: value, onSlide: (index) => setValue(index), continuous: true })),
|
|
43
43
|
React.createElement("div", { className: "tw-p-4" },
|
|
44
|
-
React.createElement("p", null, "Non
|
|
44
|
+
React.createElement("p", null, "Non continuous"),
|
|
45
45
|
React.createElement(Carousel, { carouselItems: [
|
|
46
|
-
renderChild('
|
|
47
|
-
renderChild('Second
|
|
48
|
-
renderChild('
|
|
49
|
-
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true,
|
|
46
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
47
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
48
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
49
|
+
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true, continuous: false })),
|
|
50
50
|
React.createElement("div", { className: "tw-p-4" },
|
|
51
51
|
React.createElement("p", null, "Without indicators"),
|
|
52
52
|
React.createElement(Carousel, { carouselItems: [
|
|
53
|
-
renderChild('
|
|
54
|
-
renderChild('Second
|
|
55
|
-
renderChild('
|
|
56
|
-
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true,
|
|
53
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
54
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
55
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
56
|
+
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true, continuous: true, showIndicators: false }))),
|
|
57
57
|
React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" },
|
|
58
58
|
React.createElement("div", { className: "tw-p-4" },
|
|
59
59
|
React.createElement("p", null, "Controlled"),
|
|
60
60
|
React.createElement(Carousel, { carouselItems: [
|
|
61
|
-
renderChild('
|
|
62
|
-
renderChild('Second
|
|
63
|
-
renderChild('
|
|
61
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
62
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
63
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
64
64
|
], activeIndex: value, onSlide: (index) => setValue(index) })),
|
|
65
65
|
React.createElement("div", { className: "tw-p-4" },
|
|
66
66
|
React.createElement("p", null, "Uncontrolled"),
|
|
67
67
|
React.createElement(Carousel, { carouselItems: [
|
|
68
|
-
renderChild('
|
|
69
|
-
renderChild('Second
|
|
70
|
-
renderChild('
|
|
71
|
-
], autoSlide: true,
|
|
68
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
69
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
70
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
71
|
+
], autoSlide: true, continuous: true, showArrows: false })),
|
|
72
72
|
React.createElement("div", { className: "tw-p-4" },
|
|
73
73
|
React.createElement("p", null, "Custom side buttons"),
|
|
74
74
|
React.createElement(Carousel, { carouselItems: [
|
|
75
|
-
renderChild('
|
|
76
|
-
renderChild('Second
|
|
77
|
-
renderChild('
|
|
75
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
76
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
77
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
78
78
|
], activeIndex: value, onSlide: (index) => setValue(index), nextIcon: "fc-more", prevIcon: "fc-y-axis" })),
|
|
79
79
|
React.createElement("div", { className: "tw-p-4" },
|
|
80
|
-
React.createElement("p", null, "
|
|
80
|
+
React.createElement("p", null, "Continuous"),
|
|
81
81
|
React.createElement(Carousel, { carouselItems: [
|
|
82
|
-
renderChild('
|
|
83
|
-
renderChild('Second
|
|
84
|
-
renderChild('
|
|
85
|
-
], activeIndex: value, onSlide: (index) => setValue(index),
|
|
82
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
83
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
84
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
85
|
+
], activeIndex: value, onSlide: (index) => setValue(index), continuous: true })),
|
|
86
86
|
React.createElement("div", { className: "tw-p-4" },
|
|
87
|
-
React.createElement("p", null, "Non
|
|
87
|
+
React.createElement("p", null, "Non continuous"),
|
|
88
88
|
React.createElement(Carousel, { carouselItems: [
|
|
89
|
-
renderChild('
|
|
90
|
-
renderChild('Second
|
|
91
|
-
renderChild('
|
|
92
|
-
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true,
|
|
89
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
90
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
91
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
92
|
+
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true, continuous: false })),
|
|
93
93
|
React.createElement("div", { className: "tw-p-4" },
|
|
94
94
|
React.createElement("p", null, "Without indicators"),
|
|
95
95
|
React.createElement(Carousel, { carouselItems: [
|
|
96
|
-
renderChild('
|
|
97
|
-
renderChild('Second
|
|
98
|
-
renderChild('
|
|
99
|
-
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true,
|
|
96
|
+
renderChild('First of her name, the Queen to be, long may she reign', 'tw-bg-yellow-500'),
|
|
97
|
+
renderChild('Second of her home, but her love conquers all', 'tw-bg-green-500'),
|
|
98
|
+
renderChild('Third is a wonder, the embodiment of hope and faith', 'tw-bg-gray-500'),
|
|
99
|
+
], activeIndex: value, onSlide: (index) => setValue(index), showArrows: true, continuous: true, showIndicators: false })))));
|
|
100
100
|
return (React.createElement("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4" },
|
|
101
101
|
React.createElement(QTip, null),
|
|
102
102
|
React.createElement("div", { className: "color_topic" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.stories.js","sourceRoot":"","sources":["../../src/Carousel/Carousel.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,eAAe;IACb,KAAK,EAAE,UAAU;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAE5C,MAAM,WAAW,GAAG,CAAC,IAAY,EAAE,UAAkB,EAAE,EAAE,CAAC,CACxD,6BAAK,SAAS,EAAE,kEAAkE,GAAG,UAAU;QAC7F,2BAAG,SAAS,EAAC,0CAA0C,IAAE,IAAI,CAAK;QAClE,oBAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,WAAW,GAAG,CAC1C,CACP,CAAC;IAEF,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC;QACE,6BAAK,SAAS,EAAC,OAAO;YACpB,6BAAK,SAAS,EAAC,QAAQ;gBACrB,4CAAiB;gBACjB,oBAAC,QAAQ,IACP,aAAa,EAAE;wBACb,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"Carousel.stories.js","sourceRoot":"","sources":["../../src/Carousel/Carousel.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -26,7 +26,7 @@ describe('Carousel Component', () => {
|
|
|
26
26
|
expect(mockOnSlide).toHaveBeenCalledWith(0, 'left');
|
|
27
27
|
});
|
|
28
28
|
it('does not move past the last slide', () => {
|
|
29
|
-
render(React.createElement(Carousel, { testId: "carousel", carouselItems: carouselItems, activeIndex: 2 }));
|
|
29
|
+
render(React.createElement(Carousel, { testId: "carousel", carouselItems: carouselItems, activeIndex: 2, continuous: false }));
|
|
30
30
|
const nextButton = screen.queryByTestId('carousel-next');
|
|
31
31
|
expect(nextButton).toHaveClass('tw-invisible');
|
|
32
32
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.test.js","sourceRoot":"","sources":["../../src/Carousel/Carousel.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;IAClC,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;IAC9B,MAAM,aAAa,GAAG,CAAC,6BAAK,GAAG,EAAC,GAAG,cAAc,EAAE,6BAAK,GAAG,EAAC,GAAG,cAAc,EAAE,6BAAK,GAAG,EAAC,GAAG,cAAc,CAAC,CAAC;IAE3G,EAAE,CAAC,mBAAmB,EAAE,GAAG,EAAE;QAC3B,MAAM,CAAC,oBAAC,QAAQ,IAAC,MAAM,EAAC,UAAU,EAAC,aAAa,EAAE,aAAa,GAAI,CAAC,CAAC;QACrE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC7D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,GAAG,EAAE;QACzC,MAAM,CAAC,oBAAC,QAAQ,IAAC,MAAM,EAAC,UAAU,EAAC,aAAa,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC,GAAI,CAAC,CAAC;QACrF,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC1D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,GAAG,EAAE;QACnD,MAAM,CAAC,oBAAC,QAAQ,IAAC,MAAM,EAAC,UAAU,EAAC,aAAa,EAAE,aAAa,EAAE,OAAO,EAAE,WAAW,GAAI,CAAC,CAAC;QAC3F,MAAM,UAAU,GAAG,MAAM,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;QACvD,SAAS,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;QAC5B,MAAM,CAAC,WAAW,CAAC,CAAC,oBAAoB,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;IACvD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+CAA+C,EAAE,GAAG,EAAE;QACvD,MAAM,CAAC,oBAAC,QAAQ,IAAC,MAAM,EAAC,UAAU,EAAC,aAAa,EAAE,aAAa,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,GAAI,CAAC,CAAC;QAC3G,MAAM,UAAU,GAAG,MAAM,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;QACvD,SAAS,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;QAC5B,MAAM,CAAC,WAAW,CAAC,CAAC,oBAAoB,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;IACtD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mCAAmC,EAAE,GAAG,EAAE;QAC3C,MAAM,CAAC,oBAAC,QAAQ,IAAC,MAAM,EAAC,UAAU,EAAC,aAAa,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC,GAAI,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Carousel.test.js","sourceRoot":"","sources":["../../src/Carousel/Carousel.test.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Properties for the Carousel component.
|
|
3
|
+
*/
|
|
4
|
+
export interface CarouselProps {
|
|
5
|
+
testId?: string;
|
|
6
|
+
extraClassNames?: string;
|
|
7
|
+
activeIndex?: number;
|
|
8
|
+
/**
|
|
9
|
+
* Callback function that is called when the slide changes.
|
|
10
|
+
* @param nextSlide - The index of the next slide.
|
|
11
|
+
* @param direction - The direction of the slide change, either 'left' or 'right'.
|
|
12
|
+
*/
|
|
13
|
+
onSlide?: (nextSlide: number, direction: 'left' | 'right') => void;
|
|
14
|
+
autoSlide?: boolean;
|
|
15
|
+
interval?: number;
|
|
16
|
+
nextIcon?: string;
|
|
17
|
+
prevIcon?: string;
|
|
18
|
+
iconExtraClassNames?: string;
|
|
19
|
+
showArrows?: boolean;
|
|
20
|
+
showIndicators?: boolean;
|
|
21
|
+
continuous?: boolean;
|
|
22
|
+
carouselItems: React.ReactNode[];
|
|
23
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './Carousel';
|
package/dist/index.esm.js
CHANGED
|
@@ -20671,7 +20671,7 @@ const ProgressIndicator = (props) => {
|
|
|
20671
20671
|
}, 100);
|
|
20672
20672
|
return () => clearTimeout(timeout);
|
|
20673
20673
|
}, [value]);
|
|
20674
|
-
return (React__default.createElement(Indicator, { className: `tw-ease-[cubic-bezier(0.65, 0, 0.35, 1)] tw-w-full tw-h-full tw-duration-[660ms] tw-flex tw-bg-sq-color-dark ${extraClasses}`, ...tooltipData, "data-qtip-text": tooltipProps.tooltip ? tooltipProps.tooltip : `${value}%`, "data-testid": `progress-bar-indicator-${testId ? testId : value}`, key: `${index}-${value}`, style: {
|
|
20674
|
+
return (React__default.createElement(Indicator, { className: `tw-ease-[cubic-bezier(0.65, 0, 0.35, 1)] tw-w-full tw-h-full tw-duration-[660ms] tw-flex tw-bg-sq-color-dark tw-justify-center tw-items-center ${extraClasses}`, ...tooltipData, "data-qtip-text": tooltipProps.tooltip ? tooltipProps.tooltip : `${value}%`, "data-testid": `progress-bar-indicator-${testId ? testId : value}`, key: `${index}-${value}`, style: {
|
|
20675
20675
|
// Background color will default to the theme color if undefined
|
|
20676
20676
|
backgroundColor: color ? color : undefined,
|
|
20677
20677
|
animation: 'width 660ms forwards',
|