From 4c0fbf4c9327f6a157936a4677b1b49a95741817 Mon Sep 17 00:00:00 2001 From: Ruben Thoms Date: Tue, 2 Jul 2024 16:17:29 +0200 Subject: [PATCH] fix --- frontend/src/lib/components/Slider/slider.tsx | 25 ++++++++----------- 1 file changed, 10 insertions(+), 15 deletions(-) diff --git a/frontend/src/lib/components/Slider/slider.tsx b/frontend/src/lib/components/Slider/slider.tsx index 123120957..8e596172a 100644 --- a/frontend/src/lib/components/Slider/slider.tsx +++ b/frontend/src/lib/components/Slider/slider.tsx @@ -5,7 +5,7 @@ import { createPortal } from "@lib/utils/createPortal"; import { Point2D } from "@lib/utils/geometry"; import { resolveClassNames } from "@lib/utils/resolveClassNames"; import { convertRemToPixels } from "@lib/utils/screenUnitConversions"; -import { Mark, Slider as SliderUnstyled, SliderProps as SliderUnstyledProps } from "@mui/base"; +import { Slider as SliderUnstyled, SliderProps as SliderUnstyledProps } from "@mui/base"; import { BaseComponent } from "../BaseComponent"; @@ -25,7 +25,6 @@ export const Slider = React.forwardRef((props: SliderProps, ref: React.Forwarded orientation, track, debounceTimeMs, - marks, ...rest } = props; const debounceTimerRef = React.useRef | null>(null); @@ -46,14 +45,6 @@ export const Slider = React.forwardRef((props: SliderProps, ref: React.Forwarded setPrevValue(propsValue); } - let adjustedMarks: boolean | Mark[] | undefined = undefined; - if ( - marks === true || - (Array.isArray(marks) && marks.length > 0 && marks.length < sliderRect.width / 3 - convertRemToPixels(6 / 4)) - ) { - adjustedMarks = marks; - } - React.useEffect(function handleMount() { const divRefCurrent = divRef.current; let pointerPressed = false; @@ -226,7 +217,6 @@ export const Slider = React.forwardRef((props: SliderProps, ref: React.Forwarded onChange={handleValueChanged} value={value} ref={ref} - marks={adjustedMarks} slotProps={{ root: { className: resolveClassNames( @@ -318,13 +308,18 @@ export const Slider = React.forwardRef((props: SliderProps, ref: React.Forwarded "h-2", "-ml-0.5", "-mt-0.5", - "bg-blue-600", - "border-2", "opacity-80", - "border-white", "transform", orientation === "vertical" ? "-translate-y-0" : "", - "z-4" + "z-4", + { + "border-2 bg-blue-600 border-white": + Array.isArray(props.marks) && + props.marks.length < + ((orientation === "vertical" ? sliderRect.height : sliderRect.width) - + convertRemToPixels(6 / 4)) / + 8, + } ), }, }}