react-native-system-ui 0.0.1 → 0.0.3

package/dist/cjs/components/space/Space.js

@@ -20,7 +20,7 @@ function _reactNative() {
 }
 var _hooks = require("../../hooks");
 var _tokens = require("./tokens");
-var _validate = require("../../utils/validate");
+var _utils = require("../../utils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const alignMap = {
@@ -38,24 +38,22 @@ const justifyMap = {
   around: 'space-around',
   evenly: 'space-evenly'
 };
-const parseValue = (value, presets) => {
+const parseSpaceSize = (value, presets) => {
   if (value === undefined) return presets.normal;
-  if ((0, _validate.isFiniteNumber)(value)) return value;
-  const presetValue = presets[value];
-  if (presetValue !== undefined) return presetValue;
-  const parsed = parseFloat(value);
-  return Number.isNaN(parsed) ? presets.normal : parsed;
+  if ((0, _utils.isFiniteNumber)(value)) return value;
+  if (typeof value === 'string' && value in presets) {
+    return presets[value];
+  }
+  return (0, _utils.parseNumberLike)(value, presets.normal) ?? presets.normal;
 };
 const parseGap = (value, presets) => {
   if (Array.isArray(value)) {
-    const verticalGap = parseValue(value[0], presets);
-    const horizontalGap = parseValue(value[1], presets);
-    return [horizontalGap, verticalGap];
+    return [parseSpaceSize(value[1], presets), parseSpaceSize(value[0], presets)];
   }
-  const parsed = parseValue(value, presets);
+  const parsed = parseSpaceSize(value, presets);
   return [parsed, parsed];
 };
-const Space = props => {
+const Space = exports.Space = /*#__PURE__*/_react().default.memo(props => {
   const {
     children,
     gap,
@@ -105,31 +103,32 @@ const Space = props => {
     containerBaseStyle.marginHorizontal = isHorizontal && horizontalGap ? -horizontalGap / 2 : undefined;
     containerBaseStyle.marginVertical = verticalGap ? -verticalGap / 2 : undefined;
   }
-  const childArray = _react().default.Children.toArray(children).filter(child => child != null && !(0, _validate.isBoolean)(child));
+  const childArray = _react().default.Children.toArray(children).filter(_utils.isRenderable);
   const content = [];
-  childArray.forEach((child, index) => {
-    const key = /*#__PURE__*/_react().default.isValidElement(child) && child.key !== null ? child.key : index;
+  for (let i = 0; i < childArray.length; i++) {
+    const child = childArray[i];
+    const key = /*#__PURE__*/_react().default.isValidElement(child) && child.key != null ? child.key : i;
     const fillStyle = shouldFillMainAxis ? {
       flexGrow: 1,
       flexBasis: 0,
       minWidth: 0
     } : !isHorizontal && (fill || shouldBlock) ? {
       width: '100%'
-    } : null;
-    const node = (0, _validate.isText)(child) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, null, child) : child;
+    } : undefined;
+    const node = (0, _utils.isText)(child) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, null, child) : child;
     content.push(/*#__PURE__*/_react().default.createElement(_reactNative().View, {
       key: key,
       style: [spacingStyle, fillStyle]
     }, node));
-    if (divider && index < childArray.length - 1) {
-      const dividerNode = (0, _validate.isText)(divider) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, null, divider) : divider;
+    if (divider && i < childArray.length - 1) {
+      const dividerNode = (0, _utils.isText)(divider) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, null, divider) : divider;
       content.push(/*#__PURE__*/_react().default.createElement(_reactNative().View, {
         key: `divider-${String(key)}`,
         style: spacingStyle
       }, dividerNode));
     }
-  });
-  const interactive = (0, _validate.isFunction)(onClick);
+  }
+  const interactive = (0, _utils.isFunction)(onClick);
   const {
     interactionProps,
     states
@@ -142,13 +141,13 @@ const Space = props => {
   });
   if (interactive) {
     return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, _extends({
-      style: [containerBaseStyle, style, states.pressed ? {
+      style: [tokens.layout.container, containerBaseStyle, style, states.pressed && {
         opacity: 0.85
-      } : null]
+      }]
     }, interactionProps, rest), content);
   }
   return /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({
-    style: [containerBaseStyle, style]
+    style: [tokens.layout.container, containerBaseStyle, style]
   }, rest), content);
-};
-exports.Space = Space;
+});
+Space.displayName = 'Space';

package/dist/cjs/components/stepper/Stepper.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.Stepper = void 0;
 function _react() {
-  const data = _interopRequireDefault(require("react"));
+  const data = _interopRequireWildcard(require("react"));
   _react = function () {
     return data;
   };
@@ -19,11 +19,9 @@ function _reactNative() {
   return data;
 }
 var _hooks = require("../../hooks");
-var _number = require("../../utils/number");
-var _validate = require("../../utils/validate");
-var _promise = require("../../utils/promise");
+var _utils = require("../../utils");
 var _tokens = require("./tokens");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const LONG_PRESS_DELAY = 600;
 const LONG_PRESS_INTERVAL = 100;
@@ -63,19 +61,19 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
     style,
     ...rest
   } = p;
-  const [changing, setChanging] = _react().default.useState(false);
-  const changingRef = _react().default.useRef(false);
-  const decimalLength = (0, _number.parseDecimalLength)(decimalLengthProp);
+  const [changing, setChanging] = (0, _react().useState)(false);
+  const changingRef = (0, _react().useRef)(false);
+  const decimalLength = (0, _utils.parseDecimalLength)(decimalLengthProp);
   const resolvedStepRaw = Number(step ?? 1);
-  const resolvedStep = (0, _validate.isFiniteNumber)(resolvedStepRaw) && resolvedStepRaw > 0 ? resolvedStepRaw : 1;
-  const resolvedButtonSize = Math.max(0, (0, _number.parseNumber)(buttonSize, tokens.defaults.buttonSize));
-  const resolvedInputWidth = Math.max(0, (0, _number.parseNumber)(inputWidth, tokens.defaults.inputWidth));
+  const resolvedStep = (0, _utils.isFiniteNumber)(resolvedStepRaw) && resolvedStepRaw > 0 ? resolvedStepRaw : 1;
+  const resolvedButtonSize = Math.max(0, (0, _utils.parseNumber)(buttonSize, tokens.defaults.buttonSize));
+  const resolvedInputWidth = Math.max(0, (0, _utils.parseNumber)(inputWidth, tokens.defaults.inputWidth));
   const resolvedDefaultValue = (() => {
     const raw = p.defaultValue;
     if (raw === null) return null;
-    const base = (0, _validate.isFiniteNumber)(raw) ? raw : 0;
-    const formatted = (0, _number.formatNumber)(base, integer, decimalLength);
-    return autoFixed ? (0, _number.clampValue)(formatted, min, max) : formatted;
+    const base = (0, _utils.isFiniteNumber)(raw) ? raw : 0;
+    const formatted = (0, _utils.formatNumber)(base, integer, decimalLength);
+    return autoFixed ? (0, _utils.clampValue)(formatted, min, max) : formatted;
   })();
   const [value, triggerChange] = (0, _hooks.useControllableValue)({
     ...p,
@@ -83,46 +81,46 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
   }, {
     defaultValue: resolvedDefaultValue
   });
-  const valueRef = _react().default.useRef(value ?? null);
-  _react().default.useEffect(() => {
+  const valueRef = (0, _react().useRef)(value ?? null);
+  (0, _react().useEffect)(() => {
     valueRef.current = value ?? null;
   }, [value]);
-  const inputRef = _react().default.useRef(null);
-  _react().default.useImperativeHandle(ref, () => ({
+  const inputRef = (0, _react().useRef)(null);
+  (0, _react().useImperativeHandle)(ref, () => ({
     focus: () => inputRef.current?.focus(),
     blur: () => inputRef.current?.blur()
   }));
-  const [hasFocus, setHasFocus] = _react().default.useState(false);
-  const [inputValue, setInputValue] = _react().default.useState(() => (0, _number.numberToString)(value, decimalLength));
-  const inputValueRef = _react().default.useRef(inputValue);
-  const setInputText = _react().default.useCallback(text => {
+  const [hasFocus, setHasFocus] = (0, _react().useState)(false);
+  const [inputValue, setInputValue] = (0, _react().useState)(() => (0, _utils.numberToString)(value, decimalLength));
+  const inputValueRef = (0, _react().useRef)(inputValue);
+  const setInputText = (0, _react().useCallback)(text => {
     inputValueRef.current = text;
     setInputValue(text);
   }, []);
-  _react().default.useEffect(() => {
+  (0, _react().useEffect)(() => {
     if (!hasFocus) {
-      const nextText = (0, _number.numberToString)(value, decimalLength);
+      const nextText = (0, _utils.numberToString)(value, decimalLength);
       setInputText(nextText);
     }
   }, [decimalLength, hasFocus, setInputText, value]);
-  const getCurrentNumber = () => {
+  const getCurrentNumber = (0, _react().useCallback)(() => {
     const current = valueRef.current;
-    return (0, _validate.isFiniteNumber)(current) ? current : 0;
-  };
-  const isActionDisabled = type => {
+    return (0, _utils.isFiniteNumber)(current) ? current : 0;
+  }, []);
+  const isActionDisabled = (0, _react().useCallback)(type => {
     if (disabled) return true;
     if (type === 'plus' && disablePlus) return true;
     if (type === 'minus' && disableMinus) return true;
     const current = getCurrentNumber();
-    if (type === 'plus' && (0, _validate.isFiniteNumber)(max) && current >= max) {
+    if (type === 'plus' && (0, _utils.isFiniteNumber)(max) && current >= max) {
       return true;
     }
-    if (type === 'minus' && (0, _validate.isFiniteNumber)(min) && current <= min) {
+    if (type === 'minus' && (0, _utils.isFiniteNumber)(min) && current <= min) {
       return true;
     }
     return false;
-  };
-  const setValue = next => {
+  }, [disableMinus, disablePlus, disabled, getCurrentNumber, max, min]);
+  const setValue = (0, _react().useCallback)(next => {
     const prev = valueRef.current ?? null;
     if (Object.is(prev, next)) return false;
     valueRef.current = next;
@@ -130,19 +128,19 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
       name
     });
     return true;
-  };
-  const applyNextValue = nextRaw => {
-    const formatted = (0, _number.formatNumber)(nextRaw, integer, decimalLength);
-    return autoFixed ? (0, _number.clampValue)(formatted, min, max) : formatted;
-  };
-  const performValueChange = (next, committed) => {
+  }, [name, triggerChange]);
+  const applyNextValue = (0, _react().useCallback)(nextRaw => {
+    const formatted = (0, _utils.formatNumber)(nextRaw, integer, decimalLength);
+    return autoFixed ? (0, _utils.clampValue)(formatted, min, max) : formatted;
+  }, [autoFixed, decimalLength, integer, max, min]);
+  const performValueChange = (0, _react().useCallback)((next, committed) => {
     if (changingRef.current) {
       return 'noop';
     }
     const commit = () => {
       const didChange = setValue(next);
       if (!didChange) return 'noop';
-      setInputText((0, _number.numberToString)(next, decimalLength));
+      setInputText((0, _utils.numberToString)(next, decimalLength));
       committed?.(next);
       return 'changed';
     };
@@ -151,17 +149,17 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
     }
     try {
       const result = beforeChange(next);
-      if ((0, _promise.isPromiseLike)(result)) {
+      if ((0, _utils.isPromiseLike)(result)) {
         changingRef.current = true;
         setChanging(true);
         result.then(allowed => {
           if (allowed === false) {
-            setInputText((0, _number.numberToString)(valueRef.current, decimalLength));
+            setInputText((0, _utils.numberToString)(valueRef.current, decimalLength));
             return;
           }
           commit();
         }).catch(error => {
-          console.error(error);
+          if (typeof __DEV__ !== 'undefined' && __DEV__) console.error(error);
           commit();
         }).finally(() => {
           changingRef.current = false;
@@ -170,16 +168,16 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
         return 'pending';
       }
       if (result === false) {
-        setInputText((0, _number.numberToString)(valueRef.current, decimalLength));
+        setInputText((0, _utils.numberToString)(valueRef.current, decimalLength));
         return 'noop';
       }
       return commit();
     } catch (error) {
-      console.error(error);
+      if (typeof __DEV__ !== 'undefined' && __DEV__) console.error(error);
       return commit();
     }
-  };
-  const stepOnce = (type, event, options) => {
+  }, [beforeChange, decimalLength, setInputText, setValue]);
+  const stepOnce = (0, _react().useCallback)((type, event, options) => {
     if (changingRef.current) {
       return 'noop';
     }
@@ -191,7 +189,7 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
     }
     const current = getCurrentNumber();
     const diff = type === 'plus' ? resolvedStep : -resolvedStep;
-    const next = applyNextValue((0, _number.addNumber)(current, diff));
+    const next = applyNextValue((0, _utils.addNumber)(current, diff));
     return performValueChange(next, committedValue => {
       if (!emitButtonCallbacks || !event) return;
       if (type === 'plus') {
@@ -200,11 +198,11 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
         onMinus?.(event, committedValue);
       }
     });
-  };
-  const longPressRef = _react().default.useRef({
+  }, [applyNextValue, getCurrentNumber, isActionDisabled, onMinus, onOverlimit, onPlus, performValueChange, resolvedStep]);
+  const longPressRef = (0, _react().useRef)({
     hadLongPress: false
   });
-  const clearLongPress = () => {
+  const clearLongPress = (0, _react().useCallback)(() => {
     if (longPressRef.current.delay) {
       clearTimeout(longPressRef.current.delay);
       longPressRef.current.delay = undefined;
@@ -213,9 +211,14 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
       clearInterval(longPressRef.current.interval);
       longPressRef.current.interval = undefined;
     }
-  };
-  _react().default.useEffect(() => clearLongPress, []);
-  const startLongPress = type => {
+  }, []);
+  (0, _react().useEffect)(() => clearLongPress, [clearLongPress]);
+  (0, _react().useEffect)(() => {
+    if (disabled || changing || !longPress) {
+      clearLongPress();
+    }
+  }, [changing, clearLongPress, disabled, longPress]);
+  const startLongPress = (0, _react().useCallback)(type => {
     if (!longPress) return;
     if (changingRef.current) return;
     if (isActionDisabled(type)) return;
@@ -241,11 +244,11 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
         }
       }, LONG_PRESS_INTERVAL);
     }, LONG_PRESS_DELAY);
-  };
-  const handlePressOut = () => {
+  }, [clearLongPress, isActionDisabled, longPress, stepOnce]);
+  const handlePressOut = (0, _react().useCallback)(() => {
     clearLongPress();
-  };
-  const handleButtonPress = (type, event) => {
+  }, [clearLongPress]);
+  const handleButtonPress = (0, _react().useCallback)((type, event) => {
     if (longPressRef.current.hadLongPress) {
       longPressRef.current.hadLongPress = false;
       return;
@@ -255,24 +258,24 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
       emitOverlimit: true,
       emitButtonCallbacks: true
     });
-  };
-  const currentForCompare = (0, _validate.isFiniteNumber)(value) ? value : 0;
-  const minNumber = (0, _validate.isFiniteNumber)(min) ? min : undefined;
-  const maxNumber = (0, _validate.isFiniteNumber)(max) ? max : undefined;
+  }, [stepOnce]);
+  const currentForCompare = (0, _utils.isFiniteNumber)(value) ? value : 0;
+  const minNumber = (0, _utils.isFiniteNumber)(min) ? min : undefined;
+  const maxNumber = (0, _utils.isFiniteNumber)(max) ? max : undefined;
   const disabledForAll = disabled || changing;
   const minusDisabled = disabledForAll || disableMinus || minNumber !== undefined && currentForCompare <= minNumber;
   const plusDisabled = disabledForAll || disablePlus || maxNumber !== undefined && currentForCompare >= maxNumber;
   const radius = tokens.radii.default;
-  const buttonBaseStyle = {
+  const buttonBaseStyle = (0, _react().useMemo)(() => ({
     width: resolvedButtonSize,
     height: resolvedButtonSize
-  };
-  const inputBoxStyle = {
+  }), [resolvedButtonSize]);
+  const inputBoxStyle = (0, _react().useMemo)(() => ({
     width: resolvedInputWidth,
     height: resolvedButtonSize,
     marginHorizontal: tokens.spacing.gap
-  };
-  const getButtonStyle = (type, state) => {
+  }), [resolvedButtonSize, resolvedInputWidth, tokens.spacing.gap]);
+  const getButtonStyle = (0, _react().useCallback)((type, state) => {
     const isPlus = type === 'plus';
     const disabledState = isPlus ? plusDisabled : minusDisabled;
     if (theme === 'round') {
@@ -283,18 +286,18 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
       if (isPlus) {
         return [...base, {
           backgroundColor: tokens.colors.roundTheme,
-          ...(state.pressed && !disabledState ? {
+          ...(state.pressed && !disabledState && {
             opacity: tokens.opacity.pressed
-          } : null)
+          })
         }, buttonStyle];
       }
       return [...base, {
         backgroundColor: tokens.colors.roundThemeBackground,
         borderWidth: _reactNative().StyleSheet.hairlineWidth,
         borderColor: tokens.colors.roundTheme,
-        ...(state.pressed && !disabledState ? {
+        ...(state.pressed && !disabledState && {
           opacity: tokens.opacity.pressed
-        } : null)
+        })
       }, buttonStyle];
     }
     const cornerStyle = type === 'minus' ? {
@@ -308,8 +311,8 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
     return [styles.button, buttonBaseStyle, cornerStyle, {
       backgroundColor
     }, buttonStyle];
-  };
-  const getButtonTextStyle = type => {
+  }, [buttonBaseStyle, buttonStyle, minusDisabled, plusDisabled, radius, resolvedButtonSize, theme, tokens.colors.active, tokens.colors.background, tokens.colors.buttonDisabledBackground, tokens.colors.roundTheme, tokens.colors.roundThemeBackground, tokens.opacity.pressed, tokens.opacity.roundDisabled]);
+  const getButtonTextStyle = (0, _react().useCallback)(type => {
     const isPlus = type === 'plus';
     const disabledState = isPlus ? plusDisabled : minusDisabled;
     if (theme === 'round') {
@@ -325,8 +328,8 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
       fontSize: tokens.typography.fontSize,
       fontWeight: tokens.typography.fontWeight
     }];
-  };
-  const handleChangeText = text => {
+  }, [minusDisabled, plusDisabled, theme, tokens.colors.buttonDisabledIcon, tokens.colors.buttonIcon, tokens.colors.roundTheme, tokens.colors.roundThemeText, tokens.typography.fontSize, tokens.typography.fontWeight]);
+  const handleChangeText = (0, _react().useCallback)(text => {
     if (disableInput || disabled || changingRef.current) return;
     setInputText(text);
     inputProps?.onChangeText?.(text);
@@ -338,17 +341,17 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
     const numeric = Number.parseFloat(trimmed);
     if (!Number.isFinite(numeric)) return;
     performValueChange(applyNextValue(numeric));
-  };
-  const handleFocus = event => {
-    setHasFocus(true);
+  }, [allowEmpty, applyNextValue, changingRef, disableInput, disabled, inputProps, performValueChange, resolvedDefaultValue, setInputText]);
+  const handleFocus = (0, _react().useCallback)(event => {
     if (disableInput) {
       inputRef.current?.blur();
       return;
     }
+    setHasFocus(true);
     onFocus?.(event);
     inputProps?.onFocus?.(event);
-  };
-  const handleBlur = event => {
+  }, [disableInput, inputProps, onFocus]);
+  const handleBlur = (0, _react().useCallback)(event => {
     setHasFocus(false);
     if (!changingRef.current) {
       const trimmed = inputValueRef.current.trim();
@@ -363,37 +366,60 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
     }
     onBlur?.(event);
     inputProps?.onBlur?.(event);
-  };
-  const handleInputPressIn = event => {
+  }, [allowEmpty, applyNextValue, inputProps, onBlur, performValueChange, resolvedDefaultValue]);
+  const handleInputPressIn = (0, _react().useCallback)(event => {
     onClick?.(event);
     inputProps?.onPressIn?.(event);
-  };
-  const renderButton = type => {
-    const isPlus = type === 'plus';
-    const visible = isPlus ? showPlus : showMinus;
-    if (!visible) return null;
+  }, [inputProps, onClick]);
+  const handleMinusPress = (0, _react().useCallback)(event => handleButtonPress('minus', event), [handleButtonPress]);
+  const handlePlusPress = (0, _react().useCallback)(event => handleButtonPress('plus', event), [handleButtonPress]);
+  const handleMinusPressIn = (0, _react().useCallback)(() => startLongPress('minus'), [startLongPress]);
+  const handlePlusPressIn = (0, _react().useCallback)(() => startLongPress('plus'), [startLongPress]);
+  const getMinusButtonStyle = (0, _react().useCallback)(state => getButtonStyle('minus', state), [getButtonStyle]);
+  const getPlusButtonStyle = (0, _react().useCallback)(state => getButtonStyle('plus', state), [getButtonStyle]);
+  const renderMinusButton = (0, _react().useCallback)(() => {
+    if (!showMinus) return null;
     return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
-      key: type,
-      testID: `stepper-${type}`,
+      key: "minus",
+      testID: "stepper-minus",
       accessibilityRole: "button",
-      accessibilityLabel: type === 'plus' ? 'add' : 'minus',
+      accessibilityLabel: "minus",
       accessibilityState: {
-        disabled: isPlus ? plusDisabled : minusDisabled
+        disabled: minusDisabled
       },
-      onPress: event => handleButtonPress(type, event),
-      onPressIn: () => startLongPress(type),
+      onPress: handleMinusPress,
+      onPressIn: handleMinusPressIn,
       onPressOut: handlePressOut,
-      style: state => getButtonStyle(type, state)
+      style: getMinusButtonStyle
     }, /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-      style: getButtonTextStyle(type)
-    }, isPlus ? '+' : '-'));
-  };
-  const renderInput = () => {
+      style: getButtonTextStyle('minus')
+    }, "-"));
+  }, [getButtonTextStyle, getMinusButtonStyle, handleMinusPress, handleMinusPressIn, handlePressOut, minusDisabled, showMinus]);
+  const renderPlusButton = (0, _react().useCallback)(() => {
+    if (!showPlus) return null;
+    return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
+      key: "plus",
+      testID: "stepper-plus",
+      accessibilityRole: "button",
+      accessibilityLabel: "add",
+      accessibilityState: {
+        disabled: plusDisabled
+      },
+      onPress: handlePlusPress,
+      onPressIn: handlePlusPressIn,
+      onPressOut: handlePressOut,
+      style: getPlusButtonStyle
+    }, /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+      style: getButtonTextStyle('plus')
+    }, "+"));
+  }, [getButtonTextStyle, getPlusButtonStyle, handlePlusPress, handlePlusPressIn, handlePressOut, plusDisabled, showPlus]);
+  const inputNode = (0, _react().useMemo)(() => {
     if (!showInput) return null;
     const editable = !disabledForAll && !disableInput;
     const inputDisabled = disabledForAll || disableInput;
     const inputBackground = theme === 'round' ? 'transparent' : inputDisabled ? tokens.colors.inputDisabledBackground : tokens.colors.background;
     const inputTextColor = inputDisabled ? tokens.colors.inputDisabledText : tokens.colors.inputText;
+    const keyboardType = integer ? 'number-pad' : 'decimal-pad';
     return /*#__PURE__*/_react().default.createElement(_reactNative().TextInput, _extends({
       ref: inputRef
     }, inputProps, {
@@ -404,16 +430,16 @@ const Stepper = exports.Stepper = /*#__PURE__*/_react().default.forwardRef((p, r
       value: inputValue,
       placeholder: placeholder,
       editable: editable,
-      keyboardType: integer ? 'number-pad' : 'decimal-pad',
+      keyboardType: keyboardType,
       onChangeText: handleChangeText,
       onFocus: handleFocus,
       onBlur: handleBlur,
       onPressIn: handleInputPressIn
     }));
-  };
+  }, [disableInput, disabledForAll, handleBlur, handleChangeText, handleFocus, handleInputPressIn, inputBoxStyle, inputProps, inputStyle, inputValue, integer, placeholder, showInput, theme, tokens.colors.background, tokens.colors.inputDisabledBackground, tokens.colors.inputDisabledText, tokens.colors.inputText]);
   return /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({}, rest, {
     style: [styles.container, style]
-  }), renderButton('minus'), renderInput(), renderButton('plus'));
+  }), renderMinusButton(), inputNode, renderPlusButton());
 });
 const styles = _reactNative().StyleSheet.create({
   container: {
@@ -424,9 +450,7 @@ const styles = _reactNative().StyleSheet.create({
     justifyContent: 'center',
     alignItems: 'center'
   },
-  buttonText: {
-    // fontWeight is now dynamic via token
-  },
+  buttonText: {},
   input: {
     textAlign: 'center',
     paddingHorizontal: 0,