paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 50 Packages Projects Releases Wiki Activity

Fix review comments

Browse Source 
Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>
This commit is contained in:
AmbrishRamachandiran
2026-03-04 18:28:27 +05:30
parent d32f8282a5
commit cb9b307d44
1 changed files with 42 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/RangeSlider/RangeSlider.tsx
+42 -13
View File
@@ -46,22 +46,47 @@ export const RangeSlider = forwardRef<HTMLDivElement, RangeSliderProps>(
}
}, [label, ariaLabel, ariaLabelledBy]);
useEffect(() => {
const valueArray = props.value ?? props.defaultValue;
if (valueArray && valueArray.length !== 2) {
console.warn(
`RangeSlider requires exactly 2 values [min, max], but received ${valueArray.length} values`,
);
}
}, [props.value, props.defaultValue]);
const minValue = props.minValue ?? 0;
const maxValue = props.maxValue ?? 100;
// Validate and normalize defaultValue to ensure it's always a 2-tuple
const rawDefaultValue = props.defaultValue;
const normalizedDefaultValue: [number, number] =
Array.isArray(rawDefaultValue) &&
rawDefaultValue.length === 2 &&
typeof rawDefaultValue[0] === 'number' &&
typeof rawDefaultValue[1] === 'number'
? [rawDefaultValue[0], rawDefaultValue[1]]
: [minValue, maxValue];
useEffect(() => {
if (
rawDefaultValue &&
(!Array.isArray(rawDefaultValue) ||
rawDefaultValue.length !== 2 ||
typeof rawDefaultValue[0] !== 'number' ||
typeof rawDefaultValue[1] !== 'number')
) {
console.warn(
`RangeSlider requires exactly 2 numeric values [min, max], but received invalid defaultValue. Falling back to [${minValue}, ${maxValue}].`,
);
}
const valueArray = props.value;
if (
valueArray &&
(!Array.isArray(valueArray) ||
valueArray.length !== 2 ||
typeof valueArray[0] !== 'number' ||
typeof valueArray[1] !== 'number')
) {
console.warn(
`RangeSlider requires exactly 2 numeric values [min, max], but received invalid value.`,
);
}
}, [props.value, rawDefaultValue, minValue, maxValue]);
const uncontrolledDefaultValue =
props.value === undefined
? ((props.defaultValue ??
([minValue, maxValue] as [number, number])) as [number, number])
: undefined;
props.value === undefined ? normalizedDefaultValue : undefined;
const { defaultValue: _ignoredDefault, ...propsWithoutDefault } = props;
const { classNames, dataAttributes, style, cleanedProps } = useStyles(
@@ -127,6 +152,10 @@ export const RangeSlider = forwardRef<HTMLDivElement, RangeSliderProps>(
className={clsx(classNames.track, styles[classNames.track])}
>
{({ state }) => {
// Safeguard: ensure we have at least 2 values for range slider
if (state.values.length < 2) {
return null;
}
const start = state.getThumbPercent(0);
const end = state.getThumbPercent(1);
const rangePercent = (end - start) * 100;