Skip to main content

Migrate RangeSlider from Polaris React

RangeSlider has no Polaris web component migration. Keep the existing component during an incremental migration or replace it with a native input whose type is range and apply app-owned styling.

Preserve the visible label, accessible name, minimum, maximum, step, current value, disabled state, and input/change timing. Test Arrow keys, Page Up and Page Down, Home and End, touch input, zoom, and high-contrast modes. If the old call site accepts two values, use two explicitly labelled native range inputs or redesign the control; don't imply that one input preserves a dual-thumb range.


Anchor to Remove Polaris ReactRemove Polaris React

After every range workflow uses a tested native or custom control, remove RangeSlider, value-shape adapters, and styling helpers used only by Polaris React. Remove @shopify/polaris only after no other route in scope imports it.


Was this page helpful?