@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
47 lines (46 loc) • 1.59 kB
JavaScript
"use client";
import { rem } from "../../../core/utils/units-converters/rem.mjs";
//#region packages/@mantine/core/src/components/Indicator/get-position-variables/get-position-variables.ts
function getPositionVariables(_position = "top-end", offset = 0) {
const variables = {
"--indicator-top": void 0,
"--indicator-bottom": void 0,
"--indicator-left": void 0,
"--indicator-right": void 0,
"--indicator-translate-x": void 0,
"--indicator-translate-y": void 0
};
const offsetX = typeof offset === "number" ? offset : offset.x;
const offsetY = typeof offset === "number" ? offset : offset.y;
const _offsetX = rem(offsetX);
const _offsetY = rem(offsetY);
const [position, placement] = _position.split("-");
if (position === "top") {
variables["--indicator-top"] = _offsetY;
variables["--indicator-translate-y"] = "-50%";
}
if (position === "middle") {
variables["--indicator-top"] = "50%";
variables["--indicator-translate-y"] = "-50%";
}
if (position === "bottom") {
variables["--indicator-bottom"] = _offsetY;
variables["--indicator-translate-y"] = "50%";
}
if (placement === "start") {
variables["--indicator-left"] = _offsetX;
variables["--indicator-translate-x"] = "-50%";
}
if (placement === "center") {
variables["--indicator-left"] = "50%";
variables["--indicator-translate-x"] = "-50%";
}
if (placement === "end") {
variables["--indicator-right"] = _offsetX;
variables["--indicator-translate-x"] = "50%";
}
return variables;
}
//#endregion
export { getPositionVariables };
//# sourceMappingURL=get-position-variables.mjs.map