@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
27 lines (24 loc) • 1.72 kB
JavaScript
'use client';
import React from 'react';
import { useScrollAreaContext } from '../ScrollArea.context.mjs';
import { ScrollAreaScrollbarAuto } from './ScrollAreaScrollbarAuto.mjs';
import { ScrollAreaScrollbarHover } from './ScrollAreaScrollbarHover.mjs';
import { ScrollAreaScrollbarScroll } from './ScrollAreaScrollbarScroll.mjs';
import { ScrollAreaScrollbarVisible } from './ScrollAreaScrollbarVisible.mjs';
const ScrollAreaScrollbar = React.forwardRef(
(props, forwardedRef) => {
const { forceMount, ...scrollbarProps } = props;
const context = useScrollAreaContext();
const { onScrollbarXEnabledChange, onScrollbarYEnabledChange } = context;
const isHorizontal = props.orientation === "horizontal";
React.useEffect(() => {
isHorizontal ? onScrollbarXEnabledChange(true) : onScrollbarYEnabledChange(true);
return () => {
isHorizontal ? onScrollbarXEnabledChange(false) : onScrollbarYEnabledChange(false);
};
}, [isHorizontal, onScrollbarXEnabledChange, onScrollbarYEnabledChange]);
return context.type === "hover" ? /* @__PURE__ */ React.createElement(ScrollAreaScrollbarHover, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "scroll" ? /* @__PURE__ */ React.createElement(ScrollAreaScrollbarScroll, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "auto" ? /* @__PURE__ */ React.createElement(ScrollAreaScrollbarAuto, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "always" ? /* @__PURE__ */ React.createElement(ScrollAreaScrollbarVisible, { ...scrollbarProps, ref: forwardedRef }) : null;
}
);
export { ScrollAreaScrollbar };
//# sourceMappingURL=ScrollAreaScrollbar.mjs.map