@startupjs-ui/range-input 0.2.3 → 0.3.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.3.0](https://github.com/startupjs/startupjs-ui/compare/v0.2.3...v0.3.0) (2026-05-27)
+
+
+### Features
+
+* [BREAKING] [0.3] improve accessibility props for E2E tests. Support testID everywhere ([#31](https://github.com/startupjs/startupjs-ui/issues/31)) ([882588c](https://github.com/startupjs/startupjs-ui/commit/882588ca37d5e1fd14b5717b5697cf9ed47042e4))
+
+
+
+
+
 ## [0.2.3](https://github.com/startupjs/startupjs-ui/compare/v0.2.2...v0.2.3) (2026-05-15)
 
 

package/README.mdx

@@ -8,6 +8,8 @@ A slider control that lets users select a value (or a range of values) by draggi
 
 The component also supports style overrides for individual parts: `containerStyle`, `trackStyle`, `selectedStyle`, `markerStyle`, `stepStyle`, `stepLabelStyle`, and `stepMarkerStyle`. Use `customLabel` to replace the default marker label component, or `onChangeStart` and `onChangeFinish` to respond to the start and end of a drag gesture.
 
+`testID` is forwarded to the underlying slider. The third-party slider does not currently expose `role` or `aria-*` props without adding an extra wrapper, so tests should use `testID` or surrounding visible text for this component.
+
 ```jsx
 import { RangeInput } from 'startupjs-ui'
 ```

package/index.d.ts

@@ -49,4 +49,9 @@ export interface RangeInputProps {
     onChangeStart?: MultiSliderProps['onValuesChangeStart'];
     /** Handler triggered when sliding ends */
     onChangeFinish?: MultiSliderProps['onValuesChangeFinish'];
+    /** Test identifier forwarded to the underlying slider */
+    testID?: string;
+    /** Whether the slider is disabled */
+    disabled?: boolean;
+    [key: string]: any;
 }

package/index.tsx

@@ -52,6 +52,11 @@ export interface RangeInputProps {
   onChangeStart?: MultiSliderProps['onValuesChangeStart']
   /** Handler triggered when sliding ends */
   onChangeFinish?: MultiSliderProps['onValuesChangeFinish']
+  /** Test identifier forwarded to the underlying slider */
+  testID?: string
+  /** Whether the slider is disabled */
+  disabled?: boolean
+  [key: string]: any
 }
 
 function RangeInput ({
@@ -69,6 +74,8 @@ function RangeInput ({
   onChange,
   onChangeFinish,
   onChangeStart,
+  testID,
+  disabled,
   ...props
 }: RangeInputProps): ReactNode {
   useMemo(() => {
@@ -96,9 +103,11 @@ function RangeInput ({
     MultiSlider.root(
       ...props
       part='root'
+      testID=testID
       customLabel=customLabel
       enableLabel=showLabel
-      enabledTwo=range
+      enabledOne=!disabled
+      enabledTwo=range && !disabled
       min=min
       max=max
       showSteps=showSteps

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs-ui/range-input",
-  "version": "0.2.3",
+  "version": "0.3.0",
   "publishConfig": {
     "access": "public"
   },
@@ -8,15 +8,15 @@
   "types": "index.d.ts",
   "type": "module",
   "dependencies": {
-    "@startupjs-ui/core": "^0.2.0",
-    "@startupjs-ui/div": "^0.2.0",
+    "@startupjs-ui/core": "^0.3.0",
+    "@startupjs-ui/div": "^0.3.0",
     "@startupjs-ui/react-native-multi-slider": "^2.2.2",
-    "@startupjs-ui/span": "^0.2.0"
+    "@startupjs-ui/span": "^0.3.0"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
     "startupjs": "*"
   },
-  "gitHead": "6e854934a9a9d2484291670dd5955ba8ad9af621"
+  "gitHead": "8d212b47680af1dfe582f9759b38724b46488e25"
 }