@semcore/carousel 1.6.2 → 2.0.0
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/CHANGELOG.md +18 -0
- package/lib/cjs/Carousel.js +73 -58
- package/lib/cjs/Carousel.js.map +1 -1
- package/lib/cjs/index.d.ts +59 -0
- package/lib/cjs/index.js +2 -19
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/carousel.shadow.css +22 -17
- package/lib/es6/Carousel.js +74 -57
- package/lib/es6/Carousel.js.map +1 -1
- package/lib/es6/index.d.ts +59 -0
- package/lib/es6/index.js +0 -1
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/carousel.shadow.css +22 -17
- package/lib/types/index.d.ts +4 -1
- package/package.json +4 -1
- package/src/Carousel.jsx +24 -8
- package/src/index.d.ts +4 -1
- package/src/index.js +0 -1
- package/src/style/carousel.shadow.css +22 -17
package/lib/es6/Carousel.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
2
3
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
3
4
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
@@ -7,6 +8,8 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
|
|
|
7
8
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
8
9
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
9
10
|
import { sstyled as _sstyled } from "@semcore/core";
|
|
11
|
+
import { assignProps as _assignProps8 } from "@semcore/core";
|
|
12
|
+
import { assignProps as _assignProps7 } from "@semcore/core";
|
|
10
13
|
import { assignProps as _assignProps6 } from "@semcore/core";
|
|
11
14
|
import { assignProps as _assignProps5 } from "@semcore/core";
|
|
12
15
|
import { assignProps as _assignProps4 } from "@semcore/core";
|
|
@@ -14,8 +17,6 @@ import { assignProps as _assignProps3 } from "@semcore/core";
|
|
|
14
17
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
15
18
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
16
19
|
|
|
17
|
-
var _this3 = this;
|
|
18
|
-
|
|
19
20
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
20
21
|
|
|
21
22
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
@@ -35,22 +36,22 @@ var style = (
|
|
|
35
36
|
/*__reshadow_css_start__*/
|
|
36
37
|
_sstyled.insert(
|
|
37
38
|
/*__inner_css_start__*/
|
|
38
|
-
".
|
|
39
|
+
".___SCarousel_wgb1z_gg_{overflow:hidden;outline:none}.___SContainer_wgb1z_gg_{display:flex;transition:transform var(--duration_wik9h6) ease-in-out}.___SItem_wgb1z_gg_{flex:0 0 100%;max-width:100%;box-sizing:border-box;transform:var(--transform_wik9h6);border-radius:6px;overflow:hidden}.___SIndicators_wgb1z_gg_{display:flex;justify-content:center;margin-top:16px}.___SIndicator_wgb1z_gg_{margin:0 6px;cursor:pointer;display:block;width:12px;height:12px;border-radius:6px;background-color:#a9abb6;opacity:.3;-o-object-fit:cover;object-fit:cover;transition:opacity .1s ease-in-out}.___SIndicator_wgb1z_gg_:hover{opacity:.6}.___SIndicator_wgb1z_gg_.__active_wgb1z_gg_{opacity:1}.___SNext_wgb1z_gg_,.___SPrev_wgb1z_gg_{display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.___SPrev_wgb1z_gg_{margin-right:12px}.___SNext_wgb1z_gg_{margin-left:12px}.___SNext_wgb1z_gg_.__disabled_wgb1z_gg_,.___SPrev_wgb1z_gg_.__disabled_wgb1z_gg_{opacity:0.3;cursor:default;pointer-events:none}@media (prefers-reduced-motion){.___SContainer_wgb1z_gg_{transition:none}}"
|
|
39
40
|
/*__inner_css_end__*/
|
|
40
|
-
, "
|
|
41
|
+
, "wik9h6_gg_")
|
|
41
42
|
/*__reshadow_css_end__*/
|
|
42
43
|
, {
|
|
43
|
-
"__SCarousel": "
|
|
44
|
-
"__SContainer": "
|
|
45
|
-
"--duration": "--
|
|
46
|
-
"__SItem": "
|
|
47
|
-
"--transform": "--
|
|
48
|
-
"__SIndicators": "
|
|
49
|
-
"__SIndicator": "
|
|
50
|
-
"_active": "
|
|
51
|
-
"__SNext": "
|
|
52
|
-
"__SPrev": "
|
|
53
|
-
"_disabled": "
|
|
44
|
+
"__SCarousel": "___SCarousel_wgb1z_gg_",
|
|
45
|
+
"__SContainer": "___SContainer_wgb1z_gg_",
|
|
46
|
+
"--duration": "--duration_wik9h6",
|
|
47
|
+
"__SItem": "___SItem_wgb1z_gg_",
|
|
48
|
+
"--transform": "--transform_wik9h6",
|
|
49
|
+
"__SIndicators": "___SIndicators_wgb1z_gg_",
|
|
50
|
+
"__SIndicator": "___SIndicator_wgb1z_gg_",
|
|
51
|
+
"_active": "__active_wgb1z_gg_",
|
|
52
|
+
"__SNext": "___SNext_wgb1z_gg_",
|
|
53
|
+
"__SPrev": "___SPrev_wgb1z_gg_",
|
|
54
|
+
"_disabled": "__disabled_wgb1z_gg_"
|
|
54
55
|
});
|
|
55
56
|
var position = {
|
|
56
57
|
getItemMin: function getItemMin(items) {
|
|
@@ -83,19 +84,19 @@ var MAP_TRANSFORM = {
|
|
|
83
84
|
ArrowRight: 'right'
|
|
84
85
|
};
|
|
85
86
|
|
|
86
|
-
var
|
|
87
|
-
_inherits(
|
|
87
|
+
var CarouselRoot = /*#__PURE__*/function (_Component) {
|
|
88
|
+
_inherits(CarouselRoot, _Component);
|
|
88
89
|
|
|
89
|
-
var _super = _createSuper(
|
|
90
|
+
var _super = _createSuper(CarouselRoot);
|
|
90
91
|
|
|
91
|
-
function
|
|
92
|
+
function CarouselRoot(props) {
|
|
92
93
|
var _this;
|
|
93
94
|
|
|
94
|
-
_classCallCheck(this,
|
|
95
|
+
_classCallCheck(this, CarouselRoot);
|
|
95
96
|
|
|
96
97
|
_this = _super.call(this, props);
|
|
97
98
|
|
|
98
|
-
_defineProperty(_assertThisInitialized(_this), "refContainer",
|
|
99
|
+
_defineProperty(_assertThisInitialized(_this), "refContainer", React.createRef());
|
|
99
100
|
|
|
100
101
|
_defineProperty(_assertThisInitialized(_this), "transform", 0);
|
|
101
102
|
|
|
@@ -377,7 +378,7 @@ var Carousel = /*#__PURE__*/function (_Component) {
|
|
|
377
378
|
return _this;
|
|
378
379
|
}
|
|
379
380
|
|
|
380
|
-
_createClass(
|
|
381
|
+
_createClass(CarouselRoot, [{
|
|
381
382
|
key: "uncontrolledProps",
|
|
382
383
|
value: function uncontrolledProps() {
|
|
383
384
|
return {
|
|
@@ -458,7 +459,8 @@ var Carousel = /*#__PURE__*/function (_Component) {
|
|
|
458
459
|
items: items.map(function (item, key) {
|
|
459
460
|
return {
|
|
460
461
|
active: key === index,
|
|
461
|
-
onClick: _this2.bindHandlerClickIndicator(key)
|
|
462
|
+
onClick: _this2.bindHandlerClickIndicator(key),
|
|
463
|
+
key: key
|
|
462
464
|
};
|
|
463
465
|
})
|
|
464
466
|
};
|
|
@@ -466,56 +468,56 @@ var Carousel = /*#__PURE__*/function (_Component) {
|
|
|
466
468
|
}, {
|
|
467
469
|
key: "render",
|
|
468
470
|
value: function render() {
|
|
469
|
-
var _ref = this
|
|
470
|
-
|
|
471
|
+
var _ref = this.asProps,
|
|
472
|
+
_ref8;
|
|
471
473
|
|
|
472
474
|
var SCarousel = Box;
|
|
473
475
|
var _this$asProps5 = this.asProps,
|
|
474
476
|
styles = _this$asProps5.styles,
|
|
475
477
|
Children = _this$asProps5.Children;
|
|
476
|
-
return
|
|
478
|
+
return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SCarousel, _ref8.cn("SCarousel", _objectSpread({}, _assignProps({
|
|
477
479
|
"onKeyDown": this.handlerKeyDown,
|
|
478
480
|
"tabIndex": 0,
|
|
479
481
|
"onTouchStart": this.handlerTouchStart,
|
|
480
482
|
"onTouchEnd": this.handlerTouchEnd
|
|
481
|
-
}, _ref))), /*#__PURE__*/React.createElement(Children,
|
|
483
|
+
}, _ref))), /*#__PURE__*/React.createElement(Children, _ref8.cn("Children", {})));
|
|
482
484
|
}
|
|
483
485
|
}]);
|
|
484
486
|
|
|
485
|
-
return
|
|
487
|
+
return CarouselRoot;
|
|
486
488
|
}(Component);
|
|
487
489
|
|
|
488
|
-
_defineProperty(
|
|
490
|
+
_defineProperty(CarouselRoot, "displayName", 'Carousel');
|
|
489
491
|
|
|
490
|
-
_defineProperty(
|
|
492
|
+
_defineProperty(CarouselRoot, "defaultProps", {
|
|
491
493
|
defaultIndex: 0,
|
|
492
494
|
duration: 350,
|
|
493
495
|
step: 100,
|
|
494
496
|
bounded: false
|
|
495
497
|
});
|
|
496
498
|
|
|
497
|
-
_defineProperty(
|
|
499
|
+
_defineProperty(CarouselRoot, "style", style);
|
|
498
500
|
|
|
499
501
|
var Container = function Container(props) {
|
|
500
|
-
var _ref2 =
|
|
501
|
-
|
|
502
|
+
var _ref2 = arguments[0],
|
|
503
|
+
_ref9;
|
|
502
504
|
|
|
503
505
|
var SContainer = Box;
|
|
504
506
|
var styles = props.styles,
|
|
505
507
|
duration = props.duration;
|
|
506
|
-
return
|
|
508
|
+
return _ref9 = sstyled(styles), /*#__PURE__*/React.createElement(SContainer, _ref9.cn("SContainer", _objectSpread({}, _assignProps2({
|
|
507
509
|
"use:duration": "".concat(duration, "ms")
|
|
508
510
|
}, _ref2))));
|
|
509
511
|
};
|
|
510
512
|
|
|
511
513
|
var Item = function Item(props) {
|
|
512
|
-
var _ref3 =
|
|
513
|
-
|
|
514
|
+
var _ref3 = arguments[0],
|
|
515
|
+
_ref10;
|
|
514
516
|
|
|
515
517
|
var styles = props.styles,
|
|
516
518
|
$toogleItem = props.$toogleItem;
|
|
517
519
|
var SItem = Box;
|
|
518
|
-
var refItem =
|
|
520
|
+
var refItem = React.createRef();
|
|
519
521
|
useEffect(function () {
|
|
520
522
|
// add item
|
|
521
523
|
$toogleItem({
|
|
@@ -528,25 +530,25 @@ var Item = function Item(props) {
|
|
|
528
530
|
}, true);
|
|
529
531
|
};
|
|
530
532
|
}, []);
|
|
531
|
-
return
|
|
533
|
+
return _ref10 = sstyled(styles), /*#__PURE__*/React.createElement(SItem, _ref10.cn("SItem", _objectSpread({}, _assignProps3({
|
|
532
534
|
"ref": refItem
|
|
533
535
|
}, _ref3))));
|
|
534
536
|
};
|
|
535
537
|
|
|
536
538
|
var Prev = function Prev(props) {
|
|
537
|
-
var _ref4 =
|
|
538
|
-
|
|
539
|
+
var _ref4 = arguments[0],
|
|
540
|
+
_ref11;
|
|
539
541
|
|
|
540
542
|
var styles = props.styles;
|
|
541
543
|
var SPrev = Box;
|
|
542
|
-
return
|
|
544
|
+
return _ref11 = sstyled(styles), /*#__PURE__*/React.createElement(SPrev, _ref11.cn("SPrev", _objectSpread({}, _assignProps4({}, _ref4))));
|
|
543
545
|
};
|
|
544
546
|
|
|
545
547
|
Prev.defaultProps = function () {
|
|
546
548
|
return {
|
|
547
549
|
children: /*#__PURE__*/React.createElement(ChevronLeft, {
|
|
548
550
|
interactive: true,
|
|
549
|
-
color: "
|
|
551
|
+
color: "gray-300",
|
|
550
552
|
"aria-hidden": true,
|
|
551
553
|
role: "button"
|
|
552
554
|
}),
|
|
@@ -555,19 +557,19 @@ Prev.defaultProps = function () {
|
|
|
555
557
|
};
|
|
556
558
|
|
|
557
559
|
var Next = function Next(props) {
|
|
558
|
-
var _ref5 =
|
|
559
|
-
|
|
560
|
+
var _ref5 = arguments[0],
|
|
561
|
+
_ref12;
|
|
560
562
|
|
|
561
563
|
var styles = props.styles;
|
|
562
564
|
var SNext = Box;
|
|
563
|
-
return
|
|
565
|
+
return _ref12 = sstyled(styles), /*#__PURE__*/React.createElement(SNext, _ref12.cn("SNext", _objectSpread({}, _assignProps5({}, _ref5))));
|
|
564
566
|
};
|
|
565
567
|
|
|
566
568
|
Next.defaultProps = function () {
|
|
567
569
|
return {
|
|
568
570
|
children: /*#__PURE__*/React.createElement(ChevronRight, {
|
|
569
571
|
interactive: true,
|
|
570
|
-
color: "
|
|
572
|
+
color: "gray-300",
|
|
571
573
|
"aria-hidden": true,
|
|
572
574
|
role: "button"
|
|
573
575
|
}),
|
|
@@ -575,30 +577,45 @@ Next.defaultProps = function () {
|
|
|
575
577
|
};
|
|
576
578
|
};
|
|
577
579
|
|
|
578
|
-
var Indicators = function Indicators(
|
|
579
|
-
var _ref6 =
|
|
580
|
-
|
|
580
|
+
var Indicators = function Indicators(_ref16) {
|
|
581
|
+
var _ref6 = arguments[0],
|
|
582
|
+
_ref14;
|
|
581
583
|
|
|
582
|
-
var items =
|
|
583
|
-
styles =
|
|
584
|
-
Children =
|
|
584
|
+
var items = _ref16.items,
|
|
585
|
+
styles = _ref16.styles,
|
|
586
|
+
Children = _ref16.Children;
|
|
585
587
|
var SIndicators = Box;
|
|
586
|
-
var SIndicator = Box;
|
|
587
588
|
|
|
588
589
|
if (Children.origin) {
|
|
589
|
-
|
|
590
|
+
var _ref13;
|
|
591
|
+
|
|
592
|
+
return _ref13 = sstyled(styles), /*#__PURE__*/React.createElement(SIndicators, _ref13.cn("SIndicators", _objectSpread({}, _assignProps6({}, _ref6))), /*#__PURE__*/React.createElement(Children, _ref13.cn("Children", {})));
|
|
590
593
|
}
|
|
591
594
|
|
|
592
|
-
return
|
|
593
|
-
return /*#__PURE__*/React.createElement(
|
|
595
|
+
return _ref14 = sstyled(styles), /*#__PURE__*/React.createElement(SIndicators, _ref14.cn("SIndicators", _objectSpread({}, _assignProps7({}, _ref6))), items.map(function (item, index) {
|
|
596
|
+
return /*#__PURE__*/React.createElement(Carousel.Indicator, _extends({
|
|
597
|
+
key: index
|
|
598
|
+
}, item));
|
|
594
599
|
}));
|
|
595
600
|
};
|
|
596
601
|
|
|
597
|
-
|
|
602
|
+
var Indicator = function Indicator(_ref17) {
|
|
603
|
+
var _ref7 = arguments[0],
|
|
604
|
+
_ref15;
|
|
605
|
+
|
|
606
|
+
var styles = _ref17.styles,
|
|
607
|
+
Children = _ref17.Children;
|
|
608
|
+
var SIndicator = Box;
|
|
609
|
+
return _ref15 = sstyled(styles), /*#__PURE__*/React.createElement(SIndicator, _ref15.cn("SIndicator", _objectSpread({}, _assignProps8({}, _ref7))), /*#__PURE__*/React.createElement(Children, _ref15.cn("Children", {})));
|
|
610
|
+
};
|
|
611
|
+
|
|
612
|
+
var Carousel = createComponent(CarouselRoot, {
|
|
598
613
|
Container: Container,
|
|
599
614
|
Indicators: Indicators,
|
|
615
|
+
Indicator: Indicator,
|
|
600
616
|
Item: Item,
|
|
601
617
|
Prev: Prev,
|
|
602
618
|
Next: Next
|
|
603
619
|
});
|
|
620
|
+
export default Carousel;
|
|
604
621
|
//# sourceMappingURL=Carousel.js.map
|
package/lib/es6/Carousel.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Carousel.jsx"],"names":["React","useEffect","createComponent","Component","sstyled","Root","Box","ChevronRight","ChevronLeft","position","getItemMin","items","indexItem","forEach","item","index","getItemMax","getMin","getMax","MAP_TRANSFORM","ArrowLeft","ArrowRight","Carousel","props","createRef","e","key","preventDefault","controlTransformItem","activeItemIndex","handlers","removeItem","asProps","state","updateItems","filter","element","node","setState","map","transform","slideToValue","indexIndicator","refContainer","current","style","currentIndex","nextIndex","bounded","listIndex","_","ind","tmpArr","minTmpArr","maxTmpArr","length","unshift","pop","shift","push","tmpCurrentIndex","indexOf","left","nextIndexItem","direction","getDirection","i","transformItem","maxIndexIndicator","isControlled","step","nextItemPosition","undefined","positionLeftItem","positionItemMax","positionItemMin","findIndex","transformContainer","value","_touchStartCoord","changedTouches","clientX","touchEndCoord","delta","keyCode","bindHandlerClick","prevProps","duration","ref","$toogleItem","toogleItem","disabled","onClick","onKeyDown","bindHandlerKeydownControl","active","bindHandlerClickIndicator","SCarousel","styles","Children","handlerKeyDown","handlerTouchStart","handlerTouchEnd","defaultIndex","Container","SContainer","Item","SItem","refItem","Prev","SPrev","defaultProps","children","top","Next","SNext","Indicators","SIndicators","SIndicator","origin"],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\n\nimport { Box } from '@semcore/flex-box';\nimport ChevronRight from '@semcore/icon/ChevronRight/l';\nimport ChevronLeft from '@semcore/icon/ChevronLeft/l';\n\nimport style from './style/carousel.shadow.css';\n\nconst position = {\n getItemMin: function (items) {\n let indexItem = 0;\n items.forEach(function (item, index) {\n if (item.position < items[indexItem].position) {\n indexItem = index;\n }\n });\n return indexItem;\n },\n getItemMax: function (items) {\n let indexItem = 0;\n items.forEach(function (item, index) {\n if (item.position > items[indexItem].position) {\n indexItem = index;\n }\n });\n return indexItem;\n },\n getMin: function (items) {\n return items[position.getItemMin(items)].position;\n },\n getMax: function (items) {\n return items[position.getItemMax(items)].position;\n },\n};\n\nconst MAP_TRANSFORM = {\n ArrowLeft: 'left',\n ArrowRight: 'right',\n};\n\nclass Carousel extends Component {\n static displayName = 'Carousel';\n static defaultProps = {\n defaultIndex: 0,\n duration: 350,\n step: 100,\n bounded: false,\n };\n\n static style = style;\n\n refContainer = React.createRef();\n transform = 0;\n positionLeftItem = 0;\n indexIndicator = 0;\n\n constructor(props) {\n super(props);\n this.isControlled = props.index !== undefined;\n this.state = {\n items: [],\n };\n }\n\n uncontrolledProps() {\n return {\n index: null,\n };\n }\n\n componentDidUpdate(prevProps) {\n const { index } = this.asProps;\n if (prevProps.index !== index && this.isControlled) {\n this.slideToValue(prevProps.index, index);\n }\n }\n\n handlerKeyDown = (e) => {\n switch (e.key) {\n case 'ArrowLeft':\n case 'ArrowRight':\n e.preventDefault();\n const { activeItemIndex } = this.controlTransformItem(MAP_TRANSFORM[e.key]);\n this.handlers.index(activeItemIndex);\n }\n };\n\n toogleItem = (item, removeItem = false) => {\n const { index } = this.asProps;\n const { items } = this.state;\n if (removeItem) {\n this.updateItems(items.filter((element) => element.node !== item.node));\n } else {\n this.setState(\n (state) => {\n return {\n items: [...state.items, item].map((element, position) => ({\n ...element,\n position,\n transform: 0,\n })),\n };\n },\n () => {\n if (index !== 0) {\n this.slideToValue(this.indexIndicator, index);\n }\n },\n );\n }\n };\n\n updateItems = (items) => {\n this.setState(() => ({ items }));\n };\n\n transformContainer = (transform) => {\n if (this.refContainer.current) {\n this.refContainer.current.style.transform = `translateX(${transform}%)`;\n }\n };\n\n getDirection = (currentIndex, nextIndex, bounded) => {\n if (bounded) {\n return currentIndex < nextIndex ? 'right' : 'left';\n }\n const { items } = this.state;\n const listIndex = items.map((_, ind) => ind);\n const tmpArr = [...listIndex];\n const minTmpArr = tmpArr[0];\n const maxTmpArr = tmpArr[tmpArr.length - 1];\n\n if (tmpArr.length === 2) {\n return currentIndex < nextIndex ? 'right' : 'left';\n }\n if (currentIndex === minTmpArr) {\n tmpArr.unshift(maxTmpArr);\n tmpArr.pop();\n }\n if (currentIndex === maxTmpArr) {\n tmpArr.shift();\n tmpArr.push(minTmpArr);\n }\n\n const tmpCurrentIndex = tmpArr.indexOf(currentIndex);\n const left = tmpArr.indexOf(nextIndex);\n\n return left - tmpCurrentIndex < 0 ? 'left' : 'right';\n };\n\n slideToValue = (currentIndex, nextIndexItem, bounded) => {\n if (currentIndex === nextIndexItem) return false;\n const direction = this.getDirection(\n currentIndex,\n nextIndexItem,\n bounded || this.asProps.bounded,\n );\n let i = currentIndex;\n while (nextIndexItem !== i) {\n const { activeItemIndex } = this.transformItem(direction);\n i = activeItemIndex;\n }\n };\n\n controlTransformItem = (direction) => {\n const { bounded, index } = this.asProps;\n const { items } = this.state;\n const maxIndexIndicator = items.length - 1;\n\n if (this.isControlled) {\n if (direction === 'right') {\n if (bounded && index === maxIndexIndicator) {\n return { activeItemIndex: maxIndexIndicator };\n }\n return { activeItemIndex: index === maxIndexIndicator ? 0 : index + 1 };\n }\n if (direction === 'left') {\n if (bounded && index === 0) {\n return { activeItemIndex: 0 };\n }\n return { activeItemIndex: index === 0 ? maxIndexIndicator : index - 1 };\n }\n }\n return this.transformItem(direction);\n };\n\n transformItem = (direction) => {\n const { bounded, step } = this.asProps;\n const { items } = this.state;\n const maxIndexIndicator = items.length - 1;\n let nextItemPosition = undefined;\n\n if (direction === 'right') {\n if (bounded && this.positionLeftItem === maxIndexIndicator) {\n return { activeItemIndex: maxIndexIndicator };\n }\n this.positionLeftItem += 1;\n const positionItemMax = position.getMax(items);\n\n if (this.positionLeftItem > positionItemMax) {\n nextItemPosition = position.getItemMin(items);\n items[nextItemPosition].position = positionItemMax + 1;\n items[nextItemPosition].transform += items.length * step;\n this.updateItems([...items]);\n }\n\n this.indexIndicator += 1;\n if (this.indexIndicator > maxIndexIndicator) {\n this.indexIndicator = 0;\n }\n this.transform -= step;\n }\n if (direction === 'left') {\n if (bounded && this.positionLeftItem === 0) {\n return { activeItemIndex: 0 };\n }\n this.positionLeftItem -= 1;\n const positionItemMin = position.getMin(items);\n\n if (this.positionLeftItem < positionItemMin) {\n nextItemPosition = position.getItemMax(items);\n items[nextItemPosition].position = positionItemMin - 1;\n items[nextItemPosition].transform -= items.length * step;\n this.updateItems([...items]);\n }\n\n this.indexIndicator -= 1;\n if (this.indexIndicator < 0) {\n this.indexIndicator = maxIndexIndicator;\n }\n this.transform += step;\n }\n\n const activeItemIndex = items.findIndex((item) => item.position === this.positionLeftItem);\n if (items[activeItemIndex]) {\n items[\n activeItemIndex\n ].node.style.transform = `translateX(${items[activeItemIndex].transform}%)`;\n }\n this.transformContainer(this.transform);\n return { activeItemIndex };\n };\n\n bindHandlerClick = (direction) => {\n return () => {\n const { activeItemIndex } = this.controlTransformItem(direction);\n this.handlers.index(activeItemIndex);\n };\n };\n\n bindHandlerClickIndicator = (value) => {\n return () => {\n !this.isControlled && this.slideToValue(this.indexIndicator, value, true);\n this.handlers.index(value);\n };\n };\n\n handlerTouchStart = (e) => {\n this._touchStartCoord = e.changedTouches[0].clientX;\n };\n\n handlerTouchEnd = (e) => {\n const touchEndCoord = e.changedTouches[0].clientX;\n const delta = touchEndCoord - this._touchStartCoord;\n if (delta > 50) {\n const { activeItemIndex } = this.controlTransformItem('left');\n this.handlers.index(activeItemIndex);\n } else if (delta < -50) {\n const { activeItemIndex } = this.controlTransformItem('right');\n this.handlers.index(activeItemIndex);\n }\n };\n\n getContainerProps() {\n const { duration } = this.asProps;\n\n return {\n ref: this.refContainer,\n duration,\n };\n }\n\n getItemProps() {\n return {\n $toogleItem: this.toogleItem,\n };\n }\n\n bindHandlerKeydownControl = (direction) => (e) => {\n const { keyCode } = e;\n if (keyCode === 13) {\n e.preventDefault();\n this.bindHandlerClick(direction)();\n }\n };\n\n getPrevProps() {\n const { index, bounded } = this.asProps;\n const { items } = this.state;\n let disabled = false;\n if (items.length && bounded) {\n disabled = index === 0;\n }\n return {\n onClick: this.bindHandlerClick('left'),\n onKeyDown: this.bindHandlerKeydownControl('left'),\n disabled,\n };\n }\n\n getNextProps() {\n const { index, bounded } = this.asProps;\n const { items } = this.state;\n let disabled = false;\n if (items.length && bounded) {\n disabled = index === items.length - 1;\n }\n return {\n onClick: this.bindHandlerClick('right'),\n onKeyDown: this.bindHandlerKeydownControl('right'),\n disabled,\n };\n }\n\n getIndicatorsProps() {\n const { items } = this.state;\n const { index } = this.asProps;\n\n return {\n items: items.map((item, key) => ({\n active: key === index,\n onClick: this.bindHandlerClickIndicator(key),\n })),\n };\n }\n\n render() {\n const SCarousel = Root;\n const { styles, Children } = this.asProps;\n\n return sstyled(styles)(\n <SCarousel\n render={Box}\n onKeyDown={this.handlerKeyDown}\n tabIndex={0}\n onTouchStart={this.handlerTouchStart}\n onTouchEnd={this.handlerTouchEnd}\n >\n <Children />\n </SCarousel>,\n );\n }\n}\n\nconst Container = (props) => {\n const SContainer = Root;\n const { styles, duration } = props;\n\n return sstyled(styles)(<SContainer render={Box} use:duration={`${duration}ms`} />);\n};\n\nconst Item = (props) => {\n const { styles, $toogleItem } = props;\n const SItem = Root;\n const refItem = React.createRef();\n useEffect(() => {\n // add item\n $toogleItem({ node: refItem.current });\n return () => {\n // remove item\n $toogleItem({ node: refItem.current }, true);\n };\n }, []);\n\n return sstyled(styles)(<SItem render={Box} ref={refItem} />);\n};\n\nconst Prev = (props) => {\n const { styles } = props;\n const SPrev = Root;\n return sstyled(styles)(<SPrev render={Box} />);\n};\n\nPrev.defaultProps = () => ({\n children: <ChevronLeft interactive color=\"stone\" aria-hidden={true} role=\"button\" />,\n top: 0,\n});\n\nconst Next = (props) => {\n const { styles } = props;\n const SNext = Root;\n return sstyled(styles)(<SNext render={Box} />);\n};\n\nNext.defaultProps = () => ({\n children: <ChevronRight interactive color=\"stone\" aria-hidden={true} role=\"button\" />,\n top: 0,\n});\n\nconst Indicators = ({ items, styles, Children }) => {\n const SIndicators = Root;\n const SIndicator = Box;\n if (Children.origin) {\n return <Children />;\n }\n return sstyled(styles)(\n <SIndicators render={Box}>\n {items.map((item) => (\n <SIndicator {...item} />\n ))}\n </SIndicators>,\n );\n};\n\nexport default createComponent(Carousel, {\n Container,\n Indicators,\n Item,\n Prev,\n Next,\n});\n"],"file":"Carousel.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Carousel.jsx"],"names":["React","useEffect","createComponent","Component","sstyled","Root","Box","ChevronRight","ChevronLeft","position","getItemMin","items","indexItem","forEach","item","index","getItemMax","getMin","getMax","MAP_TRANSFORM","ArrowLeft","ArrowRight","CarouselRoot","props","createRef","e","key","preventDefault","controlTransformItem","activeItemIndex","handlers","removeItem","asProps","state","updateItems","filter","element","node","setState","map","transform","slideToValue","indexIndicator","refContainer","current","style","currentIndex","nextIndex","bounded","listIndex","_","ind","tmpArr","minTmpArr","maxTmpArr","length","unshift","pop","shift","push","tmpCurrentIndex","indexOf","left","nextIndexItem","direction","getDirection","i","transformItem","maxIndexIndicator","isControlled","step","nextItemPosition","undefined","positionLeftItem","positionItemMax","positionItemMin","findIndex","transformContainer","value","_touchStartCoord","changedTouches","clientX","touchEndCoord","delta","keyCode","bindHandlerClick","prevProps","duration","ref","$toogleItem","toogleItem","disabled","onClick","onKeyDown","bindHandlerKeydownControl","active","bindHandlerClickIndicator","SCarousel","styles","Children","handlerKeyDown","handlerTouchStart","handlerTouchEnd","defaultIndex","Container","SContainer","Item","SItem","refItem","Prev","SPrev","defaultProps","children","top","Next","SNext","Indicators","SIndicators","origin","Indicator","SIndicator","Carousel"],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\n\nimport { Box } from '@semcore/flex-box';\nimport ChevronRight from '@semcore/icon/ChevronRight/l';\nimport ChevronLeft from '@semcore/icon/ChevronLeft/l';\n\nimport style from './style/carousel.shadow.css';\n\nconst position = {\n getItemMin: function (items) {\n let indexItem = 0;\n items.forEach(function (item, index) {\n if (item.position < items[indexItem].position) {\n indexItem = index;\n }\n });\n return indexItem;\n },\n getItemMax: function (items) {\n let indexItem = 0;\n items.forEach(function (item, index) {\n if (item.position > items[indexItem].position) {\n indexItem = index;\n }\n });\n return indexItem;\n },\n getMin: function (items) {\n return items[position.getItemMin(items)].position;\n },\n getMax: function (items) {\n return items[position.getItemMax(items)].position;\n },\n};\n\nconst MAP_TRANSFORM = {\n ArrowLeft: 'left',\n ArrowRight: 'right',\n};\n\nclass CarouselRoot extends Component {\n static displayName = 'Carousel';\n static defaultProps = {\n defaultIndex: 0,\n duration: 350,\n step: 100,\n bounded: false,\n };\n\n static style = style;\n\n refContainer = React.createRef();\n transform = 0;\n positionLeftItem = 0;\n indexIndicator = 0;\n\n constructor(props) {\n super(props);\n this.isControlled = props.index !== undefined;\n this.state = {\n items: [],\n };\n }\n\n uncontrolledProps() {\n return {\n index: null,\n };\n }\n\n componentDidUpdate(prevProps) {\n const { index } = this.asProps;\n if (prevProps.index !== index && this.isControlled) {\n this.slideToValue(prevProps.index, index);\n }\n }\n\n handlerKeyDown = (e) => {\n switch (e.key) {\n case 'ArrowLeft':\n case 'ArrowRight':\n e.preventDefault();\n const { activeItemIndex } = this.controlTransformItem(MAP_TRANSFORM[e.key]);\n this.handlers.index(activeItemIndex);\n }\n };\n\n toogleItem = (item, removeItem = false) => {\n const { index } = this.asProps;\n const { items } = this.state;\n if (removeItem) {\n this.updateItems(items.filter((element) => element.node !== item.node));\n } else {\n this.setState(\n (state) => {\n return {\n items: [...state.items, item].map((element, position) => ({\n ...element,\n position,\n transform: 0,\n })),\n };\n },\n () => {\n if (index !== 0) {\n this.slideToValue(this.indexIndicator, index);\n }\n },\n );\n }\n };\n\n updateItems = (items) => {\n this.setState(() => ({ items }));\n };\n\n transformContainer = (transform) => {\n if (this.refContainer.current) {\n this.refContainer.current.style.transform = `translateX(${transform}%)`;\n }\n };\n\n getDirection = (currentIndex, nextIndex, bounded) => {\n if (bounded) {\n return currentIndex < nextIndex ? 'right' : 'left';\n }\n const { items } = this.state;\n const listIndex = items.map((_, ind) => ind);\n const tmpArr = [...listIndex];\n const minTmpArr = tmpArr[0];\n const maxTmpArr = tmpArr[tmpArr.length - 1];\n\n if (tmpArr.length === 2) {\n return currentIndex < nextIndex ? 'right' : 'left';\n }\n if (currentIndex === minTmpArr) {\n tmpArr.unshift(maxTmpArr);\n tmpArr.pop();\n }\n if (currentIndex === maxTmpArr) {\n tmpArr.shift();\n tmpArr.push(minTmpArr);\n }\n\n const tmpCurrentIndex = tmpArr.indexOf(currentIndex);\n const left = tmpArr.indexOf(nextIndex);\n\n return left - tmpCurrentIndex < 0 ? 'left' : 'right';\n };\n\n slideToValue = (currentIndex, nextIndexItem, bounded) => {\n if (currentIndex === nextIndexItem) return false;\n const direction = this.getDirection(\n currentIndex,\n nextIndexItem,\n bounded || this.asProps.bounded,\n );\n let i = currentIndex;\n while (nextIndexItem !== i) {\n const { activeItemIndex } = this.transformItem(direction);\n i = activeItemIndex;\n }\n };\n\n controlTransformItem = (direction) => {\n const { bounded, index } = this.asProps;\n const { items } = this.state;\n const maxIndexIndicator = items.length - 1;\n\n if (this.isControlled) {\n if (direction === 'right') {\n if (bounded && index === maxIndexIndicator) {\n return { activeItemIndex: maxIndexIndicator };\n }\n return { activeItemIndex: index === maxIndexIndicator ? 0 : index + 1 };\n }\n if (direction === 'left') {\n if (bounded && index === 0) {\n return { activeItemIndex: 0 };\n }\n return { activeItemIndex: index === 0 ? maxIndexIndicator : index - 1 };\n }\n }\n return this.transformItem(direction);\n };\n\n transformItem = (direction) => {\n const { bounded, step } = this.asProps;\n const { items } = this.state;\n const maxIndexIndicator = items.length - 1;\n let nextItemPosition = undefined;\n\n if (direction === 'right') {\n if (bounded && this.positionLeftItem === maxIndexIndicator) {\n return { activeItemIndex: maxIndexIndicator };\n }\n this.positionLeftItem += 1;\n const positionItemMax = position.getMax(items);\n\n if (this.positionLeftItem > positionItemMax) {\n nextItemPosition = position.getItemMin(items);\n items[nextItemPosition].position = positionItemMax + 1;\n items[nextItemPosition].transform += items.length * step;\n this.updateItems([...items]);\n }\n\n this.indexIndicator += 1;\n if (this.indexIndicator > maxIndexIndicator) {\n this.indexIndicator = 0;\n }\n this.transform -= step;\n }\n if (direction === 'left') {\n if (bounded && this.positionLeftItem === 0) {\n return { activeItemIndex: 0 };\n }\n this.positionLeftItem -= 1;\n const positionItemMin = position.getMin(items);\n\n if (this.positionLeftItem < positionItemMin) {\n nextItemPosition = position.getItemMax(items);\n items[nextItemPosition].position = positionItemMin - 1;\n items[nextItemPosition].transform -= items.length * step;\n this.updateItems([...items]);\n }\n\n this.indexIndicator -= 1;\n if (this.indexIndicator < 0) {\n this.indexIndicator = maxIndexIndicator;\n }\n this.transform += step;\n }\n\n const activeItemIndex = items.findIndex((item) => item.position === this.positionLeftItem);\n if (items[activeItemIndex]) {\n items[\n activeItemIndex\n ].node.style.transform = `translateX(${items[activeItemIndex].transform}%)`;\n }\n this.transformContainer(this.transform);\n return { activeItemIndex };\n };\n\n bindHandlerClick = (direction) => {\n return () => {\n const { activeItemIndex } = this.controlTransformItem(direction);\n this.handlers.index(activeItemIndex);\n };\n };\n\n bindHandlerClickIndicator = (value) => {\n return () => {\n !this.isControlled && this.slideToValue(this.indexIndicator, value, true);\n this.handlers.index(value);\n };\n };\n\n handlerTouchStart = (e) => {\n this._touchStartCoord = e.changedTouches[0].clientX;\n };\n\n handlerTouchEnd = (e) => {\n const touchEndCoord = e.changedTouches[0].clientX;\n const delta = touchEndCoord - this._touchStartCoord;\n if (delta > 50) {\n const { activeItemIndex } = this.controlTransformItem('left');\n this.handlers.index(activeItemIndex);\n } else if (delta < -50) {\n const { activeItemIndex } = this.controlTransformItem('right');\n this.handlers.index(activeItemIndex);\n }\n };\n\n getContainerProps() {\n const { duration } = this.asProps;\n\n return {\n ref: this.refContainer,\n duration,\n };\n }\n\n getItemProps() {\n return {\n $toogleItem: this.toogleItem,\n };\n }\n\n bindHandlerKeydownControl = (direction) => (e) => {\n const { keyCode } = e;\n if (keyCode === 13) {\n e.preventDefault();\n this.bindHandlerClick(direction)();\n }\n };\n\n getPrevProps() {\n const { index, bounded } = this.asProps;\n const { items } = this.state;\n let disabled = false;\n if (items.length && bounded) {\n disabled = index === 0;\n }\n return {\n onClick: this.bindHandlerClick('left'),\n onKeyDown: this.bindHandlerKeydownControl('left'),\n disabled,\n };\n }\n\n getNextProps() {\n const { index, bounded } = this.asProps;\n const { items } = this.state;\n let disabled = false;\n if (items.length && bounded) {\n disabled = index === items.length - 1;\n }\n return {\n onClick: this.bindHandlerClick('right'),\n onKeyDown: this.bindHandlerKeydownControl('right'),\n disabled,\n };\n }\n\n getIndicatorsProps() {\n const { items } = this.state;\n const { index } = this.asProps;\n\n return {\n items: items.map((item, key) => ({\n active: key === index,\n onClick: this.bindHandlerClickIndicator(key),\n key,\n })),\n };\n }\n\n render() {\n const SCarousel = Root;\n const { styles, Children } = this.asProps;\n\n return sstyled(styles)(\n <SCarousel\n render={Box}\n onKeyDown={this.handlerKeyDown}\n tabIndex={0}\n onTouchStart={this.handlerTouchStart}\n onTouchEnd={this.handlerTouchEnd}\n >\n <Children />\n </SCarousel>,\n );\n }\n}\n\nconst Container = (props) => {\n const SContainer = Root;\n const { styles, duration } = props;\n\n return sstyled(styles)(<SContainer render={Box} use:duration={`${duration}ms`} />);\n};\n\nconst Item = (props) => {\n const { styles, $toogleItem } = props;\n const SItem = Root;\n const refItem = React.createRef();\n useEffect(() => {\n // add item\n $toogleItem({ node: refItem.current });\n return () => {\n // remove item\n $toogleItem({ node: refItem.current }, true);\n };\n }, []);\n\n return sstyled(styles)(<SItem render={Box} ref={refItem} />);\n};\n\nconst Prev = (props) => {\n const { styles } = props;\n const SPrev = Root;\n return sstyled(styles)(<SPrev render={Box} />);\n};\n\nPrev.defaultProps = () => ({\n children: <ChevronLeft interactive color=\"gray-300\" aria-hidden={true} role=\"button\" />,\n top: 0,\n});\n\nconst Next = (props) => {\n const { styles } = props;\n const SNext = Root;\n return sstyled(styles)(<SNext render={Box} />);\n};\n\nNext.defaultProps = () => ({\n children: <ChevronRight interactive color=\"gray-300\" aria-hidden={true} role=\"button\" />,\n top: 0,\n});\n\nconst Indicators = ({ items, styles, Children }) => {\n const SIndicators = Root;\n if (Children.origin) {\n return sstyled(styles)(\n <SIndicators render={Box}>\n <Children />\n </SIndicators>,\n );\n }\n return sstyled(styles)(\n <SIndicators render={Box}>\n {items.map((item, index) => (\n <Carousel.Indicator key={index} {...item} />\n ))}\n </SIndicators>,\n );\n};\n\nconst Indicator = ({ styles, Children }) => {\n const SIndicator = Root;\n return sstyled(styles)(\n <SIndicator render={Box}>\n <Children />\n </SIndicator>,\n );\n};\n\nconst Carousel = createComponent(CarouselRoot, {\n Container,\n Indicators,\n Indicator,\n Item,\n Prev,\n Next,\n});\n\nexport default Carousel;\n"],"file":"Carousel.js"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { PropGetterFn, CProps, ReturnEl } from '@semcore/core';
|
|
3
|
+
import { IBoxProps } from '@semcore/flex-box';
|
|
4
|
+
|
|
5
|
+
type ChildRenderFn<Props> = Props & {
|
|
6
|
+
children?: ({
|
|
7
|
+
items,
|
|
8
|
+
}: {
|
|
9
|
+
items: { active: boolean; onClick: () => void }[];
|
|
10
|
+
}) => React.ReactElement | React.ReactElement[];
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
export interface ICarouselProps {
|
|
14
|
+
/** Index active item */
|
|
15
|
+
index?: number;
|
|
16
|
+
/**
|
|
17
|
+
* Index of the active item selected by default
|
|
18
|
+
* @default 0
|
|
19
|
+
*/
|
|
20
|
+
defaultIndex?: number;
|
|
21
|
+
/** Called when the selection is changed */
|
|
22
|
+
onIndexChange?: (index: number) => void;
|
|
23
|
+
/** Animation duration
|
|
24
|
+
* @default 300 */
|
|
25
|
+
duration?: number;
|
|
26
|
+
/** Disables infinite items change in the carousel
|
|
27
|
+
* @default false */
|
|
28
|
+
bounded?: boolean;
|
|
29
|
+
/** @ignore */
|
|
30
|
+
step?: number;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export interface ICarouselContext {
|
|
34
|
+
getContainerProps: PropGetterFn;
|
|
35
|
+
getItemProps: PropGetterFn;
|
|
36
|
+
getPrevProps: PropGetterFn;
|
|
37
|
+
getNextProps: PropGetterFn;
|
|
38
|
+
getIndicatorsProps: PropGetterFn;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
export interface ICarouselState {
|
|
42
|
+
// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
|
|
43
|
+
items: { transform: number; position: number; node: HTMLDivElement }[];
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
declare const Carousel: (<T>(
|
|
47
|
+
props: CProps<ICarouselProps & T, ICarouselContext, ICarouselState>,
|
|
48
|
+
) => ReturnEl) & {
|
|
49
|
+
Container: <T>(props: IBoxProps & T) => ReturnEl;
|
|
50
|
+
Indicators: <T>(props: ChildRenderFn<IBoxProps & T>) => ReturnEl;
|
|
51
|
+
Indicator: <T>(
|
|
52
|
+
props: ChildRenderFn<IBoxProps & { active: boolean; onClick: () => void } & T>,
|
|
53
|
+
) => ReturnEl;
|
|
54
|
+
Item: <T>(props: IBoxProps & T) => ReturnEl;
|
|
55
|
+
Prev: <T>(props: IBoxProps & T) => ReturnEl;
|
|
56
|
+
Next: <T>(props: IBoxProps & T) => ReturnEl;
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
export default Carousel;
|
package/lib/es6/index.js
CHANGED
package/lib/es6/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,YAAxB
|
|
1
|
+
{"version":3,"sources":["../../src/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,YAAxB","sourcesContent":["export { default } from './Carousel';\n"],"file":"index.js"}
|
|
@@ -15,6 +15,8 @@ SItem {
|
|
|
15
15
|
max-width: 100%;
|
|
16
16
|
box-sizing: border-box;
|
|
17
17
|
transform: var(--transform);
|
|
18
|
+
border-radius: 6px;
|
|
19
|
+
overflow: hidden;
|
|
18
20
|
}
|
|
19
21
|
|
|
20
22
|
SIndicators {
|
|
@@ -24,28 +26,24 @@ SIndicators {
|
|
|
24
26
|
}
|
|
25
27
|
|
|
26
28
|
SIndicator {
|
|
27
|
-
margin: 0
|
|
28
|
-
padding: 0 5px;
|
|
29
|
+
margin: 0 6px;
|
|
29
30
|
cursor: pointer;
|
|
31
|
+
display: block;
|
|
32
|
+
width: 12px;
|
|
33
|
+
height: 12px;
|
|
34
|
+
border-radius: 6px;
|
|
35
|
+
background-color: var(--gray-300);
|
|
36
|
+
opacity: 0.3;
|
|
37
|
+
object-fit: cover;
|
|
38
|
+
transition: ease-in-out opacity 0.1s;
|
|
39
|
+
}
|
|
30
40
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
display: block;
|
|
34
|
-
width: 12px;
|
|
35
|
-
height: 12px;
|
|
36
|
-
border-radius: 50%;
|
|
37
|
-
background-color: color-mod(var(--stone) a(30%));
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
&:hover::before {
|
|
41
|
-
background-color: color-mod(var(--stone) a(60%));
|
|
42
|
-
}
|
|
41
|
+
SIndicator:hover {
|
|
42
|
+
opacity: 0.6;
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
SIndicator[active] {
|
|
46
|
-
|
|
47
|
-
background-color: var(--stone);
|
|
48
|
-
}
|
|
46
|
+
opacity: 1;
|
|
49
47
|
}
|
|
50
48
|
|
|
51
49
|
SPrev,
|
|
@@ -56,6 +54,13 @@ SNext {
|
|
|
56
54
|
cursor: pointer;
|
|
57
55
|
}
|
|
58
56
|
|
|
57
|
+
SPrev {
|
|
58
|
+
margin-right: 12px;
|
|
59
|
+
}
|
|
60
|
+
SNext {
|
|
61
|
+
margin-left: 12px;
|
|
62
|
+
}
|
|
63
|
+
|
|
59
64
|
SPrev[disabled],
|
|
60
65
|
SNext[disabled] {
|
|
61
66
|
opacity: var(--disabled-opacity);
|
package/lib/types/index.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ type ChildRenderFn<Props> = Props & {
|
|
|
7
7
|
items,
|
|
8
8
|
}: {
|
|
9
9
|
items: { active: boolean; onClick: () => void }[];
|
|
10
|
-
}) => React.ReactElement;
|
|
10
|
+
}) => React.ReactElement | React.ReactElement[];
|
|
11
11
|
};
|
|
12
12
|
|
|
13
13
|
export interface ICarouselProps {
|
|
@@ -48,6 +48,9 @@ declare const Carousel: (<T>(
|
|
|
48
48
|
) => ReturnEl) & {
|
|
49
49
|
Container: <T>(props: IBoxProps & T) => ReturnEl;
|
|
50
50
|
Indicators: <T>(props: ChildRenderFn<IBoxProps & T>) => ReturnEl;
|
|
51
|
+
Indicator: <T>(
|
|
52
|
+
props: ChildRenderFn<IBoxProps & { active: boolean; onClick: () => void } & T>,
|
|
53
|
+
) => ReturnEl;
|
|
51
54
|
Item: <T>(props: IBoxProps & T) => ReturnEl;
|
|
52
55
|
Prev: <T>(props: IBoxProps & T) => ReturnEl;
|
|
53
56
|
Next: <T>(props: IBoxProps & T) => ReturnEl;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/carousel",
|
|
3
3
|
"description": "SEMRush Carousel Component",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "2.0.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -28,5 +28,8 @@
|
|
|
28
28
|
"type": "git",
|
|
29
29
|
"url": "https://github.com/semrush/intergalactic.git",
|
|
30
30
|
"directory": "semcore/carousel"
|
|
31
|
+
},
|
|
32
|
+
"devDependencies": {
|
|
33
|
+
"@semcore/jest-preset-ui": "1.0.0"
|
|
31
34
|
}
|
|
32
35
|
}
|