@sincpro/mobile-ui 3.0.1 → 3.2.0

package/dist/Form/Form.QuantitySelector.js

@@ -1,36 +1,240 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { Display } from "../Display/index.js";
 import { Typography } from "../Typography/index.js";
 import { TouchableOpacity, View } from "react-native";
 import { tv } from "tailwind-variants";
+import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
 const quantitySelector = tv({
-    slots: {
-        container: "flex-row items-center self-start border border-primary rounded-full px-1",
-        button: "w-9 h-9 rounded-full justify-center items-center",
-        valueContainer: "min-w-[40px] items-center px-3",
-    },
-    variants: {
-        disabled: {
-            true: {
-                button: "opacity-50",
-            },
-        },
-    },
+  slots: {
+    container: "flex-row items-center self-start border border-primary rounded-full px-1",
+    button: "w-9 h-9 rounded-full justify-center items-center",
+    valueContainer: "min-w-[40px] items-center px-3"
+  },
+  variants: {
+    disabled: {
+      true: {
+        button: "opacity-50"
+      }
+    }
+  }
 });
-function QuantitySelector({ value, onChange, min = 1, max = 999, style, }) {
-    const handleDecrement = () => {
-        if (value > min) {
-            onChange(value - 1);
-        }
+/** The 36-point step buttons reach a 48-point target without covering the value. */
+const STEP_SLOP = {
+  top: 6,
+  bottom: 6,
+  left: 4,
+  right: 4
+};
+function QuantitySelector(t0) {
+  const $ = _c(51);
+  const {
+    value,
+    onChange,
+    min: t1,
+    max: t2,
+    style
+  } = t0;
+  const min = t1 === undefined ? 1 : t1;
+  const max = t2 === undefined ? 999 : t2;
+  let t3;
+  if ($[0] !== min || $[1] !== onChange || $[2] !== value) {
+    t3 = () => {
+      if (value > min) {
+        onChange(value - 1);
+      }
     };
-    const handleIncrement = () => {
-        if (value < max) {
-            onChange(value + 1);
-        }
+    $[0] = min;
+    $[1] = onChange;
+    $[2] = value;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  const handleDecrement = t3;
+  let t4;
+  if ($[4] !== max || $[5] !== onChange || $[6] !== value) {
+    t4 = () => {
+      if (value < max) {
+        onChange(value + 1);
+      }
     };
-    const decrementStyles = quantitySelector({ disabled: value <= min });
-    const incrementStyles = quantitySelector({ disabled: value >= max });
+    $[4] = max;
+    $[5] = onChange;
+    $[6] = value;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  const handleIncrement = t4;
+  let T0;
+  let T1;
+  let t10;
+  let t11;
+  let t12;
+  let t5;
+  let t6;
+  let t7;
+  let t8;
+  let t9;
+  if ($[8] !== handleDecrement || $[9] !== max || $[10] !== min || $[11] !== style || $[12] !== value) {
+    const decrementStyles = quantitySelector({
+      disabled: value <= min
+    });
+    const incrementStyles = quantitySelector({
+      disabled: value >= max
+    });
     const containerStyles = quantitySelector();
-    return (_jsxs(View, { className: containerStyles.container(), style: style, children: [_jsx(TouchableOpacity, { className: decrementStyles.button(), disabled: value <= min, onPress: handleDecrement, children: _jsx(Display.Icon, { name: "remove", size: 16 }) }), _jsx(View, { className: containerStyles.valueContainer(), children: _jsx(Typography.Text, { semibold: true, variant: "body", children: value }) }), _jsx(TouchableOpacity, { className: incrementStyles.button(), disabled: value >= max, onPress: handleIncrement, children: _jsx(Display.Icon, { name: "add", size: 16 }) })] }));
+    T1 = View;
+    t9 = containerStyles.container();
+    t10 = style;
+    const t13 = value <= min;
+    let t14;
+    if ($[23] !== t13) {
+      t14 = {
+        disabled: t13
+      };
+      $[23] = t13;
+      $[24] = t14;
+    } else {
+      t14 = $[24];
+    }
+    const t15 = decrementStyles.button();
+    const t16 = value <= min;
+    let t17;
+    if ($[25] === Symbol.for("react.memo_cache_sentinel")) {
+      t17 = _jsx(Display.Icon, {
+        name: "remove",
+        size: 16
+      });
+      $[25] = t17;
+    } else {
+      t17 = $[25];
+    }
+    if ($[26] !== handleDecrement || $[27] !== t14 || $[28] !== t15 || $[29] !== t16) {
+      t11 = _jsx(TouchableOpacity, {
+        accessibilityLabel: "Disminuir",
+        accessibilityRole: "button",
+        accessibilityState: t14,
+        className: t15,
+        disabled: t16,
+        hitSlop: STEP_SLOP,
+        onPress: handleDecrement,
+        children: t17
+      });
+      $[26] = handleDecrement;
+      $[27] = t14;
+      $[28] = t15;
+      $[29] = t16;
+      $[30] = t11;
+    } else {
+      t11 = $[30];
+    }
+    if ($[31] !== value) {
+      t12 = _jsx(View, {
+        className: containerStyles.valueContainer(),
+        children: _jsx(Typography.Text, {
+          semibold: true,
+          variant: "body",
+          children: value
+        })
+      });
+      $[31] = value;
+      $[32] = t12;
+    } else {
+      t12 = $[32];
+    }
+    T0 = TouchableOpacity;
+    t5 = "Aumentar";
+    t6 = "button";
+    const t18 = value >= max;
+    if ($[33] !== t18) {
+      t7 = {
+        disabled: t18
+      };
+      $[33] = t18;
+      $[34] = t7;
+    } else {
+      t7 = $[34];
+    }
+    t8 = incrementStyles.button();
+    $[8] = handleDecrement;
+    $[9] = max;
+    $[10] = min;
+    $[11] = style;
+    $[12] = value;
+    $[13] = T0;
+    $[14] = T1;
+    $[15] = t10;
+    $[16] = t11;
+    $[17] = t12;
+    $[18] = t5;
+    $[19] = t6;
+    $[20] = t7;
+    $[21] = t8;
+    $[22] = t9;
+  } else {
+    T0 = $[13];
+    T1 = $[14];
+    t10 = $[15];
+    t11 = $[16];
+    t12 = $[17];
+    t5 = $[18];
+    t6 = $[19];
+    t7 = $[20];
+    t8 = $[21];
+    t9 = $[22];
+  }
+  const t13 = value >= max;
+  let t14;
+  if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
+    t14 = _jsx(Display.Icon, {
+      name: "add",
+      size: 16
+    });
+    $[35] = t14;
+  } else {
+    t14 = $[35];
+  }
+  let t15;
+  if ($[36] !== T0 || $[37] !== handleIncrement || $[38] !== t13 || $[39] !== t5 || $[40] !== t6 || $[41] !== t7 || $[42] !== t8) {
+    t15 = _jsx(T0, {
+      accessibilityLabel: t5,
+      accessibilityRole: t6,
+      accessibilityState: t7,
+      className: t8,
+      disabled: t13,
+      hitSlop: STEP_SLOP,
+      onPress: handleIncrement,
+      children: t14
+    });
+    $[36] = T0;
+    $[37] = handleIncrement;
+    $[38] = t13;
+    $[39] = t5;
+    $[40] = t6;
+    $[41] = t7;
+    $[42] = t8;
+    $[43] = t15;
+  } else {
+    t15 = $[43];
+  }
+  let t16;
+  if ($[44] !== T1 || $[45] !== t10 || $[46] !== t11 || $[47] !== t12 || $[48] !== t15 || $[49] !== t9) {
+    t16 = _jsxs(T1, {
+      className: t9,
+      style: t10,
+      children: [t11, t12, t15]
+    });
+    $[44] = T1;
+    $[45] = t10;
+    $[46] = t11;
+    $[47] = t12;
+    $[48] = t15;
+    $[49] = t9;
+    $[50] = t16;
+  } else {
+    t16 = $[50];
+  }
+  return t16;
 }
 export default QuantitySelector;

package/dist/Form/Form.RadioButton.d.ts

@@ -3,5 +3,6 @@ interface RadioButtonProps {
     selected: boolean;
     onPress: () => void;
 }
+/** One option of a single-choice group: the same row Select and PickerField list. */
 declare function RadioButton({ label, selected, onPress }: RadioButtonProps): import("react").JSX.Element;
 export default RadioButton;

package/dist/Form/Form.RadioButton.js

@@ -1,31 +1,28 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import { Typography } from "../Typography/index.js";
-import { TouchableOpacity, View } from "react-native";
-import { tv } from "tailwind-variants";
-const radioButton = tv({
-    slots: {
-        container: "flex-row items-center py-2.5 px-3 rounded-lg border-[1.5px] border-border-default bg-bg-card",
-        radioCircle: "w-[18px] h-[18px] rounded-full border-2 border-border-default mr-2 justify-center items-center",
-        radioInner: "w-[9px] h-[9px] rounded-full",
-        label: "flex-1",
-    },
-    variants: {
-        selected: {
-            true: {
-                container: "border-primary bg-primary/10",
-                radioCircle: "border-primary",
-                radioInner: "bg-primary",
-                label: "text-text-primary font-semibold",
-            },
-            false: {
-                label: "text-text-secondary",
-            },
-        },
-    },
-    defaultVariants: { selected: false },
-});
-function RadioButton({ label, selected, onPress }) {
-    const styles = radioButton({ selected });
-    return (_jsxs(TouchableOpacity, { activeOpacity: 0.7, className: styles.container(), onPress: onPress, children: [_jsx(View, { className: styles.radioCircle(), children: selected && _jsx(View, { className: styles.radioInner() }) }), _jsx(Typography.Text, { className: styles.label(), variant: "bodySmall", children: label })] }));
+import { c as _c } from "react/compiler-runtime";
+import { ChoiceRow } from "./choice-row.js";
+import { jsx as _jsx } from "nativewind/jsx-runtime";
+/** One option of a single-choice group: the same row Select and PickerField list. */
+function RadioButton(t0) {
+  const $ = _c(4);
+  const {
+    label,
+    selected,
+    onPress
+  } = t0;
+  let t1;
+  if ($[0] !== label || $[1] !== onPress || $[2] !== selected) {
+    t1 = _jsx(ChoiceRow, {
+      label: label,
+      onPress: onPress,
+      selected: selected
+    });
+    $[0] = label;
+    $[1] = onPress;
+    $[2] = selected;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  return t1;
 }
 export default RadioButton;

package/dist/Form/Form.Select.d.ts

@@ -10,6 +10,7 @@ export type SelectProps<T extends string | number> = {
     label?: string;
     placeholder?: string;
     title?: string;
+    /** Kept for compatibility: a row applies its option on tap, on Android and iOS alike. */
     confirmLabel?: string;
     disabled?: boolean;
     readOnly?: boolean;
@@ -18,5 +19,5 @@ export type SelectProps<T extends string | number> = {
     className?: string;
     testID?: string;
 };
-declare function Select<T extends string | number>({ options, value, onChange, onBlur, label, placeholder, title, confirmLabel, disabled, readOnly, loading, error, className, testID, }: SelectProps<T>): import("react").JSX.Element;
+declare function Select<T extends string | number>({ options, value, onChange, onBlur, label, placeholder, title, disabled, readOnly, loading, error, className, testID, }: SelectProps<T>): import("react").JSX.Element;
 export default Select;