@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
61 lines (60 loc) • 2.48 kB
JavaScript
"use client";
require("../../../_virtual/_rolldown/runtime.cjs");
const require_use_props = require("../../../core/MantineProvider/use-props/use-props.cjs");
const require_Box = require("../../../core/Box/Box.cjs");
const require_ScrollArea_context = require("../ScrollArea.context.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/ScrollAreaRoot/ScrollAreaRoot.tsx
const defaultProps = {
scrollHideDelay: 1e3,
type: "hover"
};
function ScrollAreaRoot(_props) {
const { type, scrollHideDelay, scrollbars, getStyles, ref, ...others } = require_use_props.useProps("ScrollAreaRoot", defaultProps, _props);
const [scrollArea, setScrollArea] = (0, react.useState)(null);
const [viewport, setViewport] = (0, react.useState)(null);
const [content, setContent] = (0, react.useState)(null);
const [scrollbarX, setScrollbarX] = (0, react.useState)(null);
const [scrollbarY, setScrollbarY] = (0, react.useState)(null);
const [cornerWidth, setCornerWidth] = (0, react.useState)(0);
const [cornerHeight, setCornerHeight] = (0, react.useState)(0);
const [scrollbarXEnabled, setScrollbarXEnabled] = (0, react.useState)(false);
const [scrollbarYEnabled, setScrollbarYEnabled] = (0, react.useState)(false);
const rootRef = (0, _mantine_hooks.useMergedRef)(ref, (node) => setScrollArea(node));
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ScrollArea_context.ScrollAreaProvider, {
value: {
type,
scrollHideDelay,
scrollArea,
viewport,
onViewportChange: setViewport,
content,
onContentChange: setContent,
scrollbarX,
onScrollbarXChange: setScrollbarX,
scrollbarXEnabled,
onScrollbarXEnabledChange: setScrollbarXEnabled,
scrollbarY,
onScrollbarYChange: setScrollbarY,
scrollbarYEnabled,
onScrollbarYEnabledChange: setScrollbarYEnabled,
onCornerWidthChange: setCornerWidth,
onCornerHeightChange: setCornerHeight,
getStyles
},
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Box.Box, {
...others,
ref: rootRef,
__vars: {
"--sa-corner-width": scrollbars !== "xy" ? "0px" : `${cornerWidth}px`,
"--sa-corner-height": scrollbars !== "xy" ? "0px" : `${cornerHeight}px`
}
})
});
}
ScrollAreaRoot.displayName = "@mantine/core/ScrollAreaRoot";
//#endregion
exports.ScrollAreaRoot = ScrollAreaRoot;
//# sourceMappingURL=ScrollAreaRoot.cjs.map