@kit-data-manager/react-search-component
Version:
All-in-one component for rendering an elastic search UI for searching anything. Built-in support for visualizing related items in a graph and resolving unique identifiers.
8 lines • 1.89 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import * as SliderPrimitive from "@radix-ui/react-slider";
import { cn } from "../../lib/utils";
const Slider = React.forwardRef(({ className, ...props }, ref) => (_jsxs(SliderPrimitive.Root, { ref: ref, className: cn("rfs-relative rfs-flex rfs-w-full rfs-touch-none rfs-select-none rfs-items-center", className), ...props, children: [_jsx(SliderPrimitive.Track, { className: "rfs-relative rfs-h-2 rfs-w-full rfs-grow rfs-overflow-hidden rfs-rounded-full rfs-bg-secondary", children: _jsx(SliderPrimitive.Range, { className: "rfs-absolute rfs-h-full rfs-bg-primary" }) }), _jsx(SliderPrimitive.Thumb, { className: "rfs-block rfs-h-5 rfs-w-5 rfs-rounded-full rfs-border-2 rfs-border-primary rfs-bg-background rfs-ring-offset-background rfs-transition-colors focus-visible:rfs-outline-none focus-visible:rfs-ring-2 focus-visible:rfs-ring-ring focus-visible:rfs-ring-offset-2 disabled:rfs-pointer-events-none disabled:rfs-opacity-50", children: _jsx("span", { className: " rfs-pointer-events-none rfs-text-muted-foreground rfs-text-sm -rfs-top-5 -rfs-translate-x-1/2 rfs-left-1/2 rfs-absolute", children: props.value?.[0] }) }), _jsx(SliderPrimitive.Thumb, { className: "rfs-block rfs-h-5 rfs-w-5 rfs-rounded-full rfs-border-2 rfs-border-primary rfs-bg-background rfs-ring-offset-background rfs-transition-colors focus-visible:rfs-outline-none focus-visible:rfs-ring-2 focus-visible:rfs-ring-ring focus-visible:rfs-ring-offset-2 disabled:rfs-pointer-events-none disabled:rfs-opacity-50", children: _jsx("span", { className: "rfs-pointer-events-none rfs-text-muted-foreground rfs-text-sm -rfs-bottom-5 -rfs-translate-x-1/2 rfs-left-1/2 rfs-absolute", children: props.value?.[1] }) })] })));
Slider.displayName = SliderPrimitive.Root.displayName;
export { Slider };
//# sourceMappingURL=slider.js.map