@itwin/itwinui-react
Version:
A react component library for iTwinUI
59 lines (58 loc) • 2.05 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', {
value: true,
});
Object.defineProperty(exports, 'CarouselSlide', {
enumerable: true,
get: function () {
return CarouselSlide;
},
});
const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
const _react = /*#__PURE__*/ _interop_require_wildcard._(require('react'));
const _classnames = /*#__PURE__*/ _interop_require_default._(
require('classnames'),
);
const _index = require('../../utils/index.js');
const _CarouselContext = require('./CarouselContext.js');
const CarouselSlide = _react.forwardRef((props, ref) => {
let { index, className, children, ...rest } = props;
let context = _react.useContext(_CarouselContext.CarouselContext);
if (!context || null == index)
throw new Error('CarouselSlide must be used within Carousel');
let { isManuallyUpdating, currentIndex, setCurrentIndex } = context;
let updateActiveIndexOnScroll = _react.useCallback(() => {
if (!isManuallyUpdating.current) setCurrentIndex(index);
}, [index, isManuallyUpdating, setCurrentIndex]);
let intersectionRef = (0, _index.useIntersection)(
updateActiveIndexOnScroll,
{
threshold: 0.5,
},
false,
);
let refs = (0, _index.useMergedRefs)(intersectionRef, ref);
return _react.createElement(
_index.Box,
{
className: (0, _classnames.default)(
'iui-carousel-slider-item',
className,
),
role: 'tabpanel',
'aria-roledescription': 'slide',
tabIndex: index === currentIndex ? 0 : void 0,
ref: refs,
inert: index !== currentIndex ? 'true' : void 0,
...rest,
onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, (event) => {
if ('ArrowLeft' === event.key || 'ArrowRight' === event.key)
event.preventDefault();
}),
},
children,
);
});
if ('development' === process.env.NODE_ENV)
CarouselSlide.displayName = 'Carousel.Slide';