@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
34 lines (33 loc) • 1.75 kB
JavaScript
"use client";
require("../../../_virtual/_rolldown/runtime.cjs");
const require_ScrollArea_context = require("../ScrollArea.context.cjs");
const require_use_resize_observer = require("../use-resize-observer.cjs");
const require_ScrollAreaScrollbarVisible = require("./ScrollAreaScrollbarVisible.cjs");
let react = require("react");
let _mantine_hooks = require("@mantine/hooks");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.tsx
function ScrollAreaScrollbarAuto(props) {
const context = require_ScrollArea_context.useScrollAreaContext();
const { forceMount, ...scrollbarProps } = props;
const [visible, setVisible] = (0, react.useState)(false);
const isHorizontal = props.orientation === "horizontal";
const handleResize = (0, _mantine_hooks.useDebouncedCallback)(() => {
if (context.viewport) {
const isOverflowX = context.viewport.offsetWidth < context.viewport.scrollWidth;
const isOverflowY = context.viewport.offsetHeight < context.viewport.scrollHeight;
setVisible(isHorizontal ? isOverflowX : isOverflowY);
}
}, 10);
require_use_resize_observer.useResizeObserver(context.viewport, handleResize);
require_use_resize_observer.useResizeObserver(context.content, handleResize);
if (forceMount || visible) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ScrollAreaScrollbarVisible.ScrollAreaScrollbarVisible, {
"data-state": visible ? "visible" : "hidden",
...scrollbarProps
});
return null;
}
ScrollAreaScrollbarAuto.displayName = "@mantine/core/ScrollAreaScrollbarAuto";
//#endregion
exports.ScrollAreaScrollbarAuto = ScrollAreaScrollbarAuto;
//# sourceMappingURL=ScrollAreaScrollbarAuto.cjs.map