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.
@@ -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
- indicatorType?: 'dot' | 'line' | 'slider';
19
- /** When to show arrows*/
20
- showArrow?: 'always' | 'hover' | 'never';
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) {
@@ -2,3 +2,4 @@ import { Meta } from '@storybook/react';
2
2
  declare const _default: Meta<import("@storybook/react").Args>;
3
3
  export default _default;
4
4
  export declare const Interactive: any;
5
+ export declare const HideIndicator: any;
@@ -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
- indicatorType?: 'dot' | 'line' | 'slider';
19
- /** When to show arrows*/
20
- showArrow?: 'always' | 'hover' | 'never';
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) {
@@ -2,3 +2,4 @@ import { Meta } from '@storybook/react';
2
2
  declare const _default: Meta<import("@storybook/react").Args>;
3
3
  export default _default;
4
4
  export declare const Interactive: any;
5
+ export declare const HideIndicator: any;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "glints-aries",
3
- "version": "4.0.266",
3
+ "version": "4.0.267",
4
4
  "description": "Glints ui-kit for frontend",
5
5
  "main": "./lib/index.js",
6
6
  "module": "./es/index.js",