fix: merge conflicts

example/storybook/package.json

@@ -16,7 +16,6 @@
     "storybook-watcher": "sb-rn-watcher --config-path .ondevice",
     "storybook": "NODE_OPTIONS=--openssl-legacy-provider start-storybook -p 6007",
     "build-storybook": "build-storybook",
-    "build": "bob build",
     "release": "release-it",
     "test": "jest",
     "update-snapshot": "jest -u"

package.json

@@ -6,7 +6,8 @@
     "packages/*",
     "packages/unstyled/**",
     "packages/react-native-aria/**",
-    "packages/**"
+    "packages/**",
+    "example/storybook"
   ],
   "scripts": {
     "test": "bash ./scripts/test.sh",
@@ -20,7 +21,7 @@
     "lint": "eslint packages/**/**/src --ext .ts,.tsx --config .eslintrc",
     "eject:gluestack-style": "git clone -b development [email protected]:gluestack/gluestack-style.git gluestack-style && echo Now update babel.config.js",
     "create-new-package": "node ./scripts/create-new-package.js",
-    "storybook": "cd example/storybook && yarn && yarn storybook",
+    "storybook": "cd example/storybook && yarn storybook",
     "kitchensink:web": "cd example/ui-examples && yarn web"
   },
   "devDependencies": {

packages/react-native-aria/checkbox/src/useCheckbox.ts

@@ -1,10 +1,11 @@
 import type { RefObject } from 'react';
 import type { ToggleState } from '@react-stately/toggle';
 import { mergeProps } from '@react-aria/utils';
+import type { AccessibilityProps } from 'react-native';
 import { useToggle } from '@react-native-aria/toggle';
 import { AriaCheckboxProps } from '@react-types/checkbox';
 
-export interface CheckboxAria {
+export interface CheckboxAria extends AccessibilityProps {
   /** Props for the input or Pressable/Touchable element. */
   inputProps: any;
 }

packages/react-native-aria/radio/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-aria/radio",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "mono repo setup with bob",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

packages/react-native-aria/radio/src/useRadio.ts

@@ -1,6 +1,6 @@
 import type { AriaRadioProps } from '@react-types/radio';
 import { mergeProps } from '@react-aria/utils';
-import type { InputHTMLAttributes, RefObject } from 'react';
+import type { RefObject } from 'react';
 import type { RadioGroupState } from '@react-stately/radio';
 import { usePress } from '@react-native-aria/interactions';
 import type { AccessibilityProps } from 'react-native';
@@ -18,8 +18,8 @@ export interface RadioAriaProps extends AriaRadioProps, AccessibilityProps {
 }
 
 export interface RadioAria extends AccessibilityProps {
-  /** Props for the input element. */
-  inputProps: InputHTMLAttributes<HTMLElement>;
+  /** Props for the input or Pressable/Touchable element. */
+  inputProps: any;
 }
 
 /**

packages/react-native-aria/slider/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-aria/slider",
-  "version": "0.2.8",
+  "version": "0.2.10",
   "description": "useSlider - React Native Aria",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

packages/react-native-aria/slider/src/useMove.ts

@@ -10,7 +10,7 @@
  * governing permissions and limitations under the License.
  */
 
-import React from 'react';
+import React, { useState } from 'react';
 import { PanResponder } from 'react-native';
 
 interface MoveResult {
@@ -26,29 +26,37 @@ interface MoveResult {
 export function useMove(props: any): MoveResult {
   let { onMoveStart, onMove, onMoveEnd } = props;
 
-  const panResponter = React.useMemo(
+  const [initialMoveX, setInitialMoveX] = useState(0);
+  const [initialMoveY, setInitialMoveY] = useState(0);
+  const panResponder = React.useMemo(
     () =>
       PanResponder.create({
         onMoveShouldSetPanResponderCapture: (_event) => {
           return true;
         },
-        onPanResponderGrant: (_evt) => {
+        onPanResponderGrant: (_evt, gestureState) => {
           onMoveStart?.({
             type: 'movestart',
             pointerType: 'touch',
           });
+          setInitialMoveX(gestureState.moveX);
+          setInitialMoveY(gestureState.moveY);
         },
         onPanResponderMove: (_event, gestureState) => {
-          if (gestureState.dx === 0 && gestureState.dy === 0) {
+          const deltaX = gestureState.moveX - initialMoveX;
+          const deltaY = gestureState.moveY - initialMoveY;
+          if (deltaX === 0 && deltaY === 0) {
             return;
           }
 
-          onMove({
-            type: 'move',
-            pointerType: 'touch',
-            deltaX: gestureState.dx,
-            deltaY: gestureState.dy,
-          });
+          if (deltaX) {
+            onMove({
+              type: 'move',
+              pointerType: 'touch',
+              deltaX: deltaX,
+              deltaY: deltaY,
+            });
+          }
         },
         onPanResponderRelease: () => {
           onMoveEnd?.({
@@ -57,8 +65,8 @@ export function useMove(props: any): MoveResult {
           });
         },
       }),
-    [onMove, onMoveEnd, onMoveStart]
+    [onMove, onMoveEnd, onMoveStart, initialMoveX, initialMoveY]
   );
 
-  return { moveProps: panResponter.panHandlers };
+  return { moveProps: panResponder.panHandlers };
 }

packages/react-native-aria/slider/src/useSliderThumb.ts

@@ -1,7 +1,7 @@
 import { AriaSliderThumbProps } from '@react-types/slider';
 import { clamp } from '@react-aria/utils';
 import { getSliderThumbId, sliderIds } from './utils';
-import { useRef } from 'react';
+import { useRef, useState } from 'react';
 import { SliderState } from '@react-stately/slider';
 import { useLabel } from '@react-aria/label';
 import { useMove } from './useMove';
@@ -52,10 +52,14 @@ export function useSliderThumb(
   stateRef.current = state;
   let reverseX = isReversed || direction === 'rtl';
   let currentPosition = useRef<number>(null);
+
+  const [startPosition, setStartPosition] = useState(0);
+
   let { moveProps } = useMove({
     onMoveStart() {
-      currentPosition.current = null;
       state.setThumbDragging(index, true);
+      let size = isVertical ? trackLayout.height : trackLayout.width;
+      setStartPosition(stateRef.current.getThumbPercent(index) * size);
     },
     onMove({ deltaX, deltaY }) {
       let size = isVertical ? trackLayout.height : trackLayout.width;
@@ -75,11 +79,10 @@ export function useSliderThumb(
           delta = -delta;
         }
       }
-      currentPosition.current += delta;
-      stateRef.current.setThumbPercent(
-        index,
-        clamp(currentPosition.current / size, 0, 1)
-      );
+
+      const position = startPosition + delta;
+
+      stateRef.current.setThumbPercent(index, clamp(position / size, 0, 1));
     },
     onMoveEnd() {
       state.setThumbDragging(index, false);