@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
62 lines (61 loc) • 2.72 kB
JavaScript
"use client";
require("../../_virtual/_rolldown/runtime.cjs");
const require_create_vars_resolver = require("../../core/styles-api/create-vars-resolver/create-vars-resolver.cjs");
const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
const require_use_styles = require("../../core/styles-api/use-styles/use-styles.cjs");
const require_factory = require("../../core/factory/factory.cjs");
const require_Box = require("../../core/Box/Box.cjs");
const require_use_floating_indicator = require("./use-floating-indicator.cjs");
const require_FloatingIndicator_module = require("./FloatingIndicator.module.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/FloatingIndicator/FloatingIndicator.tsx
const varsResolver = require_create_vars_resolver.createVarsResolver((theme, { transitionDuration }, { shouldReduceMotion }) => {
const duration = (theme.respectReducedMotion ? shouldReduceMotion : false) ? "0ms" : typeof transitionDuration === "number" ? `${transitionDuration}ms` : transitionDuration || "150ms";
return { root: { "--transition-duration": duration } };
});
const FloatingIndicator = require_factory.factory((_props) => {
const props = require_use_props.useProps("FloatingIndicator", null, _props);
const { classNames, className, style, styles, unstyled, vars, target, parent, transitionDuration, mod, displayAfterTransitionEnd, onTransitionStart, onTransitionEnd, attributes, ref, ...others } = props;
const getStyles = require_use_styles.useStyles({
name: "FloatingIndicator",
classes: require_FloatingIndicator_module.default,
props,
className,
style,
classNames,
styles,
unstyled,
attributes,
vars,
varsResolver,
stylesCtx: { shouldReduceMotion: (0, _mantine_hooks.useReducedMotion)() }
});
const innerRef = (0, react.useRef)(null);
const { initialized, hidden } = require_use_floating_indicator.useFloatingIndicator({
target,
parent,
ref: innerRef,
displayAfterTransitionEnd,
onTransitionStart,
onTransitionEnd
});
const mergedRef = (0, _mantine_hooks.useMergedRef)(ref, innerRef);
if (!target || !parent) return null;
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Box.Box, {
ref: mergedRef,
mod: [{
initialized,
hidden
}, mod],
...getStyles("root"),
...others
});
});
FloatingIndicator.displayName = "@mantine/core/FloatingIndicator";
FloatingIndicator.classes = require_FloatingIndicator_module.default;
FloatingIndicator.varsResolver = varsResolver;
//#endregion
exports.FloatingIndicator = FloatingIndicator;
//# sourceMappingURL=FloatingIndicator.cjs.map