import { jsx as _jsx } from "react/jsx-runtime";
import { useMemo } from "react";
import { cn } from "../../utils/css";
export var CellBarDirection;
(function(CellBarDirection) {
    CellBarDirection[CellBarDirection["LEFT_TO_RIGHT"] = 0] = "LEFT_TO_RIGHT";
    CellBarDirection[CellBarDirection["RIGHT_TO_LEFT"] = 1] = "RIGHT_TO_LEFT";
})(CellBarDirection || (CellBarDirection = {}));
export const CellBar = (props)=>{
    const { direction = 1 } = props;
    const transform = useMemo(()=>{
        const x = Math.max(props.width, 0);
        if (direction === 0) {
            return {
                transform: `translateX(${x}%)`
            };
        }
        return {
            transform: `translateX(-${x}%)`
        };
    }, [
        props.width
    ]);
    return /*#__PURE__*/ _jsx("div", {
        className: cn("orderly-absolute orderly-right-[-100%] orderly-top-0 orderly-h-full orderly-w-full orderly-transition-transform orderly-pointer-events-none", direction === 0 && "orderly-left-[-100%]", props.className),
        style: transform
    });
};

//# sourceMappingURL=cellBar.js.map