@webority-technologies/mobile-ui 0.0.1 → 0.0.3

package/lib/commonjs/components/Slider/Slider.js

@@ -275,8 +275,13 @@ const Slider = exports.Slider = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
       return;
     }
     const delta = event.nativeEvent.actionName === 'increment' ? step : -step;
+    // Round through `precision` (same guard the pan gesture uses) so repeated
+    // increments of a fractional step (e.g. 0.1) don't drift off the exact
+    // decimal via binary float addition (0.1+0.1+0.1 = 0.30000000000000004).
+    const roundedDelta = step > 0 ? Math.round(delta * precision) / precision : delta;
     if (isRange) {
-      const nextLow = clamp(lowVal.value + delta, min, highVal.value);
+      const rawLow = Math.round((lowVal.value + roundedDelta) * precision) / precision;
+      const nextLow = clamp(rawLow, min, highVal.value);
       if (nextLow !== lowVal.value) {
         lowVal.value = nextLow;
         lowX.value = valueToPx(nextLow, trackWidth);
@@ -284,7 +289,8 @@ const Slider = exports.Slider = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
         fireChange(nextLow, highVal.value);
       }
     } else {
-      const next = clamp(lowVal.value + delta, min, max);
+      const rawNext = Math.round((lowVal.value + roundedDelta) * precision) / precision;
+      const next = clamp(rawNext, min, max);
       if (next !== lowVal.value) {
         lowVal.value = next;
         lowX.value = valueToPx(next, trackWidth);
@@ -292,7 +298,7 @@ const Slider = exports.Slider = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
         fireChange(next, next);
       }
     }
-  }, [disabled, step, isRange, min, max, valueToPx, trackWidth, lowX, lowVal, highVal, fireChange, fireHaptic]);
+  }, [disabled, step, precision, isRange, min, max, valueToPx, trackWidth, lowX, lowVal, highVal, fireChange, fireHaptic]);
   const thumbRadius = sizeCfg.thumbDiameter / 2;
 
   // ───────── Animated styles ─────────
@@ -325,8 +331,18 @@ const Slider = exports.Slider = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
   }));
 
   // Display values (from committed state) for labels + a11y.
-  const lowDisplayValue = isRange ? Math.min(...currentValue) : currentValue;
-  const highDisplayValue = isRange ? Math.max(...currentValue) : currentValue;
+  //
+  // Clamped to [min, max]. A caller-supplied value outside the range is not
+  // rewritten — `onChange` is never fired from here and the caller's own state
+  // is untouched — but it must not be RENDERED as-is: valueToPx does not clamp,
+  // so value=150 on a 0..100 slider puts the thumb off the end of the track, and
+  // accessibilityValue would announce `now: 150` against `max: 100`, which is an
+  // invalid state for a screen reader. Any interaction re-clamps through
+  // clamp()/snapToStep() anyway, so this only aligns the first render with what
+  // every subsequent one already does.
+  const clampDisplay = v => clamp(v, min, max);
+  const lowDisplayValue = clampDisplay(isRange ? Math.min(...currentValue) : currentValue);
+  const highDisplayValue = clampDisplay(isRange ? Math.max(...currentValue) : currentValue);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
     ref: ref,
     style: [styles.container, containerStyle, style],

package/lib/commonjs/components/Swipeable/Swipeable.js

@@ -123,6 +123,9 @@ const Swipeable = props => {
   const fireFirstAction = (0, _react.useCallback)(side => {
     const list = side === 'left' ? leftActions : rightActions;
     const first = list?.[0];
+    // Structurally unreachable, not a bug guard: both call sites below are
+    // gated on allowLeft/allowRight (== hasLeft/hasRight), which is exactly
+    // "list has at least one element". Kept for type narrowing on `first`.
     if (!first) {
       return;
     }
@@ -159,7 +162,7 @@ const Swipeable = props => {
     const openThreshold = threshold;
     const allowLeft = hasLeft;
     const allowRight = hasRight;
-    return _reactNativeGestureHandler.Gesture.Pan().enabled(!disabled).activeOffsetX([-dragActivationOffset, dragActivationOffset]).failOffsetY([-failOffsetY, failOffsetY]).onStart(() => {
+    return _reactNativeGestureHandler.Gesture.Pan().enabled(!disabled).withTestId(testID ? `${testID}-gesture` : 'swipeable-gesture').activeOffsetX([-dragActivationOffset, dragActivationOffset]).failOffsetY([-failOffsetY, failOffsetY]).onStart(() => {
       'worklet';
 
       dragStartX.value = translateX.value;
@@ -217,7 +220,7 @@ const Swipeable = props => {
       translateX.value = (0, _reactNativeReanimated.withSpring)(0, springConfig);
       (0, _reactNativeReanimated.runOnJS)(notifyClose)();
     });
-  }, [disabled, dragStartX, fireFirstAction, fullSwipeThreshold, hasLeft, hasRight, leftRevealWidth, notifyClose, notifyOpen, rightRevealWidth, screenWidth, threshold, translateX, dragActivationOffset, failOffsetY, rubberBandFactor, springConfig]);
+  }, [disabled, dragStartX, fireFirstAction, fullSwipeThreshold, hasLeft, hasRight, leftRevealWidth, notifyClose, notifyOpen, rightRevealWidth, screenWidth, threshold, translateX, dragActivationOffset, failOffsetY, rubberBandFactor, springConfig, testID]);
 
   // ───────── Animated styles ─────────
   const contentStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({

package/lib/commonjs/components/TimePicker/TimePicker.js

@@ -337,6 +337,17 @@ const TimePicker = props => {
   const [periodIndex, setPeriodIndex] = (0, _react.useState)(() => initial.period === 'PM' ? 1 : 0);
 
   // Re-sync on open toggle / value change / format / step.
+  //
+  // The `!open` guard is a RENDER OPTIMISATION, not a correctness guard, and it
+  // is worth knowing which. `open` is itself a dependency, so the effect re-runs
+  // when the picker opens and reads a fresh `new Date()` either way — the state
+  // a user actually sees is identical with or without it. What it saves is three
+  // setState calls (and the extra commit they schedule) on every prop change
+  // while the picker is closed. Correctness while closed is handled by RN's
+  // Modal, which renders nothing at visible={false}.
+  //
+  // That is why its test counts render passes through React.Profiler rather than
+  // asserting on the tree: no DOM assertion can distinguish the two paths.
   (0, _react.useEffect)(() => {
     if (!open) {
       return;