glints-aries 4.0.266 → 4.0.267
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/es/@next/Carousel/Carousel.d.ts +5 -4
- package/es/@next/Carousel/Carousel.js +6 -4
- package/es/@next/Carousel/Carousel.stories.d.ts +1 -0
- package/lib/@next/Carousel/Carousel.d.ts +5 -4
- package/lib/@next/Carousel/Carousel.js +6 -4
- package/lib/@next/Carousel/Carousel.stories.d.ts +1 -0
- package/package.json +1 -1
|
@@ -15,10 +15,11 @@ export interface CarouselProps {
|
|
|
15
15
|
/** sets width of Carousel */
|
|
16
16
|
width?: string;
|
|
17
17
|
indicatorPosition?: 'top' | 'bottom' | 'left' | 'right' | 'outer';
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
18
|
+
/** Sets indicator type. Default is line and can be `null` to remove the component */
|
|
19
|
+
indicatorType?: 'dot' | 'line' | 'slider' | null;
|
|
20
|
+
/** Sets whether to show arrows */
|
|
21
|
+
showArrows?: boolean;
|
|
21
22
|
/** When `autoRotate` is `true`, specify milliseconds until next slide shows */
|
|
22
23
|
duration?: number;
|
|
23
24
|
}
|
|
24
|
-
export declare const Carousel: ({ autoRotate, children, aspectRatio, height, width, indicatorPosition, indicatorType, duration, }: CarouselProps) => JSX.Element;
|
|
25
|
+
export declare const Carousel: ({ autoRotate, children, aspectRatio, height, width, indicatorPosition, indicatorType, duration, showArrows, }: CarouselProps) => JSX.Element;
|
|
@@ -14,7 +14,9 @@ export var Carousel = function Carousel(_ref) {
|
|
|
14
14
|
_ref$indicatorType = _ref.indicatorType,
|
|
15
15
|
indicatorType = _ref$indicatorType === void 0 ? 'line' : _ref$indicatorType,
|
|
16
16
|
_ref$duration = _ref.duration,
|
|
17
|
-
duration = _ref$duration === void 0 ? 3000 : _ref$duration
|
|
17
|
+
duration = _ref$duration === void 0 ? 3000 : _ref$duration,
|
|
18
|
+
_ref$showArrows = _ref.showArrows,
|
|
19
|
+
showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows;
|
|
18
20
|
var slideRef = useRef(null);
|
|
19
21
|
var _useState = useState(0),
|
|
20
22
|
activeIndex = _useState[0],
|
|
@@ -61,7 +63,7 @@ export var Carousel = function Carousel(_ref) {
|
|
|
61
63
|
updateActiveIndex(activeIndex + 1);
|
|
62
64
|
}, duration);
|
|
63
65
|
}
|
|
64
|
-
}, [activeIndex, autoRotate, updateActiveIndex]);
|
|
66
|
+
}, [activeIndex, autoRotate, duration, updateActiveIndex]);
|
|
65
67
|
return /*#__PURE__*/React.createElement(CarouselContainer, {
|
|
66
68
|
aspectRatio: aspectRatio ? (aspectRatio == null ? void 0 : aspectRatio.width) + "/" + (aspectRatio == null ? void 0 : aspectRatio.height) : null,
|
|
67
69
|
height: height,
|
|
@@ -75,7 +77,7 @@ export var Carousel = function Carousel(_ref) {
|
|
|
75
77
|
width: width
|
|
76
78
|
}, /*#__PURE__*/React.createElement(ItemsContainer, {
|
|
77
79
|
activeIndex: activeIndex
|
|
78
|
-
}, childrenList)), /*#__PURE__*/React.createElement(ArrowsContainer, {
|
|
80
|
+
}, childrenList)), showArrows && /*#__PURE__*/React.createElement(ArrowsContainer, {
|
|
79
81
|
"data-hidden": hideArrows
|
|
80
82
|
}, /*#__PURE__*/React.createElement(PreviousArrow, {
|
|
81
83
|
onClick: handlePreviousClick
|
|
@@ -87,7 +89,7 @@ export var Carousel = function Carousel(_ref) {
|
|
|
87
89
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
88
90
|
name: "ri-arrow-m-right-line",
|
|
89
91
|
fill: Neutral.B40
|
|
90
|
-
}))), /*#__PURE__*/React.createElement(IndicatorsContainer, {
|
|
92
|
+
}))), !!indicatorType && /*#__PURE__*/React.createElement(IndicatorsContainer, {
|
|
91
93
|
indicatorType: indicatorType,
|
|
92
94
|
indicatorPosition: indicatorPosition
|
|
93
95
|
}, /*#__PURE__*/React.createElement("div", null, Array.from(Array(childrenLength).keys()).map(function (n) {
|
|
@@ -15,10 +15,11 @@ export interface CarouselProps {
|
|
|
15
15
|
/** sets width of Carousel */
|
|
16
16
|
width?: string;
|
|
17
17
|
indicatorPosition?: 'top' | 'bottom' | 'left' | 'right' | 'outer';
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
18
|
+
/** Sets indicator type. Default is line and can be `null` to remove the component */
|
|
19
|
+
indicatorType?: 'dot' | 'line' | 'slider' | null;
|
|
20
|
+
/** Sets whether to show arrows */
|
|
21
|
+
showArrows?: boolean;
|
|
21
22
|
/** When `autoRotate` is `true`, specify milliseconds until next slide shows */
|
|
22
23
|
duration?: number;
|
|
23
24
|
}
|
|
24
|
-
export declare const Carousel: ({ autoRotate, children, aspectRatio, height, width, indicatorPosition, indicatorType, duration, }: CarouselProps) => JSX.Element;
|
|
25
|
+
export declare const Carousel: ({ autoRotate, children, aspectRatio, height, width, indicatorPosition, indicatorType, duration, showArrows, }: CarouselProps) => JSX.Element;
|
|
@@ -20,7 +20,9 @@ var Carousel = function Carousel(_ref) {
|
|
|
20
20
|
_ref$indicatorType = _ref.indicatorType,
|
|
21
21
|
indicatorType = _ref$indicatorType === void 0 ? 'line' : _ref$indicatorType,
|
|
22
22
|
_ref$duration = _ref.duration,
|
|
23
|
-
duration = _ref$duration === void 0 ? 3000 : _ref$duration
|
|
23
|
+
duration = _ref$duration === void 0 ? 3000 : _ref$duration,
|
|
24
|
+
_ref$showArrows = _ref.showArrows,
|
|
25
|
+
showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows;
|
|
24
26
|
var slideRef = (0, _react.useRef)(null);
|
|
25
27
|
var _useState = (0, _react.useState)(0),
|
|
26
28
|
activeIndex = _useState[0],
|
|
@@ -67,7 +69,7 @@ var Carousel = function Carousel(_ref) {
|
|
|
67
69
|
updateActiveIndex(activeIndex + 1);
|
|
68
70
|
}, duration);
|
|
69
71
|
}
|
|
70
|
-
}, [activeIndex, autoRotate, updateActiveIndex]);
|
|
72
|
+
}, [activeIndex, autoRotate, duration, updateActiveIndex]);
|
|
71
73
|
return /*#__PURE__*/_react["default"].createElement(_CarouselStyle.CarouselContainer, {
|
|
72
74
|
aspectRatio: aspectRatio ? (aspectRatio == null ? void 0 : aspectRatio.width) + "/" + (aspectRatio == null ? void 0 : aspectRatio.height) : null,
|
|
73
75
|
height: height,
|
|
@@ -81,7 +83,7 @@ var Carousel = function Carousel(_ref) {
|
|
|
81
83
|
width: width
|
|
82
84
|
}, /*#__PURE__*/_react["default"].createElement(_CarouselStyle.ItemsContainer, {
|
|
83
85
|
activeIndex: activeIndex
|
|
84
|
-
}, childrenList)), /*#__PURE__*/_react["default"].createElement(_CarouselStyle.ArrowsContainer, {
|
|
86
|
+
}, childrenList)), showArrows && /*#__PURE__*/_react["default"].createElement(_CarouselStyle.ArrowsContainer, {
|
|
85
87
|
"data-hidden": hideArrows
|
|
86
88
|
}, /*#__PURE__*/_react["default"].createElement(_CarouselStyle.PreviousArrow, {
|
|
87
89
|
onClick: handlePreviousClick
|
|
@@ -93,7 +95,7 @@ var Carousel = function Carousel(_ref) {
|
|
|
93
95
|
}, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
|
|
94
96
|
name: "ri-arrow-m-right-line",
|
|
95
97
|
fill: _colors.Neutral.B40
|
|
96
|
-
}))), /*#__PURE__*/_react["default"].createElement(_CarouselStyle.IndicatorsContainer, {
|
|
98
|
+
}))), !!indicatorType && /*#__PURE__*/_react["default"].createElement(_CarouselStyle.IndicatorsContainer, {
|
|
97
99
|
indicatorType: indicatorType,
|
|
98
100
|
indicatorPosition: indicatorPosition
|
|
99
101
|
}, /*#__PURE__*/_react["default"].createElement("div", null, Array.from(Array(childrenLength).keys()).map(function (n) {
|