@homecode/ui 5.1.14 → 5.1.15

package/dist/esm/src/components/Slider/Slider.js

@@ -9,7 +9,7 @@ const valueToPct = (value, min, max) => {
     const range = max - min;
     return range > 0 ? `${((value - min) / range) * 100}%` : '0%';
 };
-function Slider({ className, label, value, min = 0, max = 100, step, size = 'm', disabled = false, showGhost = false, markers, markerClassName, onMarkerClick, onChange, onInput, ...inputProps }) {
+function Slider({ className, label, value, min = 0, max = 100, step, size = 'm', disabled = false, showGhost = false, markers, markerClassName, onMarkerClick, onChange, onInput, markerTooltipProps = {}, ...inputProps }) {
     const trackWrapRef = useRef(null);
     const [ghostRatio, setGhostRatio] = useState(null);
     const progressPct = valueToPct(value, min, max);
@@ -37,7 +37,7 @@ function Slider({ className, label, value, min = 0, max = 100, step, size = 'm',
                                     if (!disabled)
                                         onMarkerClick?.(marker.value);
                                 } }));
-                            return (jsx("span", { className: S.markerWrap, style: { left: valueToPct(marker.value, min, max) }, children: marker.label ? (jsx(Tooltip, { content: marker.label, direction: "top", children: markerButton })) : (markerButton) }, marker.key ?? index));
+                            return (jsx("span", { className: S.markerWrap, style: { left: valueToPct(marker.value, min, max) }, children: marker.label ? (jsx(Tooltip, { direction: "bottom", ...markerTooltipProps, content: marker.label, children: markerButton })) : (markerButton) }, marker.key ?? index));
                         }) })) : null] })] }));
 }
 

package/dist/esm/types/src/components/Slider/Slider.d.ts

@@ -1,4 +1,4 @@
 import * as T from './Slider.types';
 export type SliderProps = T.Props;
 export type SliderMarker = T.SliderMarker;
-export declare function Slider({ className, label, value, min, max, step, size, disabled, showGhost, markers, markerClassName, onMarkerClick, onChange, onInput, ...inputProps }: SliderProps): JSX.Element;
+export declare function Slider({ className, label, value, min, max, step, size, disabled, showGhost, markers, markerClassName, onMarkerClick, onChange, onInput, markerTooltipProps, ...inputProps }: SliderProps): JSX.Element;

package/dist/esm/types/src/components/Slider/Slider.types.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode, ChangeEvent, FormEvent, InputHTMLAttributes } from 'react';
 import { Size, ComponentType } from '../../types';
+import { TooltipProps } from 'uilib';
 export type SliderMarker = {
     key?: string;
     value: number;
@@ -16,6 +17,7 @@ export type Props = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'
     label?: ReactNode;
     markers?: SliderMarker[];
     markerClassName?: string;
+    markerTooltipProps?: Partial<TooltipProps>;
     onMarkerClick?: (value: number) => void;
     onChange?: (value: number, e: ChangeEvent<HTMLInputElement> | FormEvent<HTMLInputElement>) => void;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "5.1.14",
+  "version": "5.1.15",
   "description": "React UI components library",
   "scripts": {
     "tests": "jest",