@sincpro/mobile-ui 3.0.0 → 3.1.0

package/dist/Form/Form.Field.js

@@ -0,0 +1,55 @@
+import { c as _c } from "react/compiler-runtime";
+import { Controller } from "react-hook-form";
+import { jsx as _jsx } from "nativewind/jsx-runtime";
+/**
+ * The one react-hook-form adapter of the DS. Any control (DS or app) becomes a
+ * form field with typed value, blur, validation message and disabled state.
+ */
+export default function Field(t0) {
+  const $ = _c(8);
+  const {
+    control,
+    name,
+    rules,
+    error,
+    render
+  } = t0;
+  let t1;
+  if ($[0] !== error || $[1] !== render) {
+    t1 = t2 => {
+      const {
+        field,
+        fieldState
+      } = t2;
+      return render({
+        value: field.value,
+        onChange: field.onChange,
+        onBlur: field.onBlur,
+        error: error ?? fieldState.error?.message,
+        disabled: field.disabled
+      });
+    };
+    $[0] = error;
+    $[1] = render;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  let t2;
+  if ($[3] !== control || $[4] !== name || $[5] !== rules || $[6] !== t1) {
+    t2 = _jsx(Controller, {
+      control: control,
+      name: name,
+      render: t1,
+      rules: rules
+    });
+    $[3] = control;
+    $[4] = name;
+    $[5] = rules;
+    $[6] = t1;
+    $[7] = t2;
+  } else {
+    t2 = $[7];
+  }
+  return t2;
+}

package/dist/Form/Form.FractionalQuantityInput.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { Actions } from "../Actions/index.js";
 import { Dialog } from "../Dialog/index.js";
 import { Display } from "../Display/index.js";
@@ -7,105 +7,517 @@ import { normalizeQuantity, roundTo } from "../utils/quantity.js";
 import { useCallback, useMemo, useState } from "react";
 import { TouchableOpacity, View } from "react-native";
 import { tv } from "tailwind-variants";
+import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
 const fractionalQuantityInput = tv({
-    slots: {
-        container: "flex-row items-center border border-brand-accent rounded-full px-1",
-        button: "w-9 h-9 rounded-full justify-center items-center",
-        valueContainer: "min-w-[60px] items-center px-3",
-    },
-    variants: {
-        disabled: {
-            true: {
-                button: "opacity-40",
-            },
-        },
-    },
+  slots: {
+    container: "flex-row items-center border border-primary rounded-full px-1",
+    button: "w-9 h-9 rounded-full justify-center items-center",
+    valueContainer: "min-w-[60px] items-center px-3"
+  },
+  variants: {
+    disabled: {
+      true: {
+        button: "opacity-40"
+      }
+    }
+  }
 });
+/** 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 parseLocalizedNumber(raw) {
-    let s = raw.trim();
-    if (s === "")
-        return 0;
-    s = s.replace(/[^0-9.,+-]/g, "");
-    const hasComma = s.includes(",");
-    const hasDot = s.includes(".");
-    if (hasComma && (!hasDot || s.lastIndexOf(",") > s.lastIndexOf("."))) {
-        s = s.replace(/\./g, "").replace(/,/g, ".");
-    }
-    else {
-        if (!hasComma && hasDot) {
-            if (/^\d{1,3}(\.\d{3})+$/.test(s)) {
-                s = s.replace(/\./g, "");
-            }
-            else if (s.split(".").length - 1 > 1) {
-                const parts = s.split(".");
-                const decimal = parts.pop();
-                s = parts.join("") + "." + decimal;
-            }
-        }
-        else if (hasComma && hasDot) {
-            s = s.replace(/,/g, "");
-        }
-        s = s.replace(/,/g, "");
-    }
-    const n = parseFloat(s);
-    if (isNaN(n))
-        return 0;
-    return n;
+  let s = raw.trim();
+  if (s === "") return 0;
+  s = s.replace(/[^0-9.,+-]/g, "");
+  const hasComma = s.includes(",");
+  const hasDot = s.includes(".");
+  if (hasComma && (!hasDot || s.lastIndexOf(",") > s.lastIndexOf("."))) {
+    s = s.replace(/\./g, "").replace(/,/g, ".");
+  } else {
+    if (!hasComma && hasDot) {
+      if (/^\d{1,3}(\.\d{3})+$/.test(s)) {
+        s = s.replace(/\./g, "");
+      } else if (s.split(".").length - 1 > 1) {
+        const parts = s.split(".");
+        const decimal = parts.pop();
+        s = parts.join("") + "." + decimal;
+      }
+    } else if (hasComma && hasDot) {
+      s = s.replace(/,/g, "");
+    }
+    s = s.replace(/,/g, "");
+  }
+  const n = parseFloat(s);
+  if (isNaN(n)) return 0;
+  return n;
 }
-function FractionalQuantityInput({ value, onChange, precision = 2, minIncrement, maxValue = 999999, style, disabled, quickAddIncrements, }) {
-    const [modalVisible, setModalVisible] = useState(false);
-    const [draft, setDraft] = useState(String(value));
-    const effectiveIncrement = useMemo(() => {
-        if (minIncrement && minIncrement > 0)
-            return minIncrement;
-        return 1 / Math.pow(10, precision);
-    }, [minIncrement, precision]);
-    const chips = useMemo(() => {
-        if (quickAddIncrements && quickAddIncrements.length > 0)
-            return quickAddIncrements;
-        const base = effectiveIncrement;
-        if (base >= 1)
-            return [1, 2, 5];
-        if (base >= 0.5)
-            return [0.5, 1, 2];
-        if (base >= 0.25)
-            return [0.25, 0.5, 1];
-        if (base >= 0.1)
-            return [0.1, 0.25, 0.5];
-        return [base, base * 2, base * 5];
-    }, [effectiveIncrement, quickAddIncrements]);
-    const applyValue = useCallback((next) => {
-        if (next < 0)
-            next = 0;
-        if (next > maxValue)
-            next = maxValue;
-        next = normalizeQuantity(next, effectiveIncrement, precision);
-        onChange(next);
-    }, [onChange, maxValue, effectiveIncrement, precision]);
-    function handleDecrement() {
-        applyValue(value - 1);
-    }
-    function handleIncrement() {
-        applyValue(value + 1);
-    }
-    function openModal() {
-        setDraft(String(value));
-        setModalVisible(true);
-    }
-    function confirmDraft(nextDraft) {
-        let parsed = parseLocalizedNumber(nextDraft);
-        parsed = roundTo(parsed, precision);
-        if (parsed < 0)
-            parsed = 0;
-        if (parsed > maxValue)
-            parsed = maxValue;
-        onChange(parsed);
-        setModalVisible(false);
-    }
-    const formatted = useMemo(() => value.toFixed(precision), [value, precision]);
-    const decrementStyles = fractionalQuantityInput({ disabled: disabled || value <= 0 });
-    const incrementStyles = fractionalQuantityInput({ disabled });
+function FractionalQuantityInput(t0) {
+  const $ = _c(100);
+  const {
+    value,
+    onChange,
+    precision: t1,
+    minIncrement,
+    maxValue: t2,
+    style,
+    disabled,
+    quickAddIncrements
+  } = t0;
+  const precision = t1 === undefined ? 2 : t1;
+  const maxValue = t2 === undefined ? 999999 : t2;
+  const [modalVisible, setModalVisible] = useState(false);
+  const [draft, setDraft] = useState(String(value));
+  let t3;
+  bb0: {
+    if (minIncrement && minIncrement > 0) {
+      t3 = minIncrement;
+      break bb0;
+    }
+    t3 = 1 / Math.pow(10, precision);
+  }
+  const effectiveIncrement = t3;
+  let t4;
+  bb1: {
+    if (quickAddIncrements && quickAddIncrements.length > 0) {
+      t4 = quickAddIncrements;
+      break bb1;
+    }
+    const base = effectiveIncrement;
+    if (base >= 1) {
+      let t5;
+      if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+        t5 = [1, 2, 5];
+        $[0] = t5;
+      } else {
+        t5 = $[0];
+      }
+      t4 = t5;
+      break bb1;
+    }
+    if (base >= 0.5) {
+      let t5;
+      if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+        t5 = [0.5, 1, 2];
+        $[1] = t5;
+      } else {
+        t5 = $[1];
+      }
+      t4 = t5;
+      break bb1;
+    }
+    if (base >= 0.25) {
+      let t5;
+      if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+        t5 = [0.25, 0.5, 1];
+        $[2] = t5;
+      } else {
+        t5 = $[2];
+      }
+      t4 = t5;
+      break bb1;
+    }
+    if (base >= 0.1) {
+      let t5;
+      if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+        t5 = [0.1, 0.25, 0.5];
+        $[3] = t5;
+      } else {
+        t5 = $[3];
+      }
+      t4 = t5;
+      break bb1;
+    }
+    const t5 = base * 2;
+    const t6 = base * 5;
+    let t7;
+    if ($[4] !== base || $[5] !== t5 || $[6] !== t6) {
+      t7 = [base, t5, t6];
+      $[4] = base;
+      $[5] = t5;
+      $[6] = t6;
+      $[7] = t7;
+    } else {
+      t7 = $[7];
+    }
+    t4 = t7;
+  }
+  const chips = t4;
+  let t5;
+  if ($[8] !== effectiveIncrement || $[9] !== maxValue || $[10] !== onChange || $[11] !== precision) {
+    t5 = next => {
+      if (next < 0) {
+        next = 0;
+      }
+      if (next > maxValue) {
+        next = maxValue;
+      }
+      next = normalizeQuantity(next, effectiveIncrement, precision);
+      onChange(next);
+    };
+    $[8] = effectiveIncrement;
+    $[9] = maxValue;
+    $[10] = onChange;
+    $[11] = precision;
+    $[12] = t5;
+  } else {
+    t5 = $[12];
+  }
+  const applyValue = t5;
+  let t6;
+  if ($[13] !== applyValue || $[14] !== value) {
+    t6 = function handleDecrement() {
+      applyValue(value - 1);
+    };
+    $[13] = applyValue;
+    $[14] = value;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+  const handleDecrement = t6;
+  let t7;
+  if ($[16] !== applyValue || $[17] !== value) {
+    t7 = function handleIncrement() {
+      applyValue(value + 1);
+    };
+    $[16] = applyValue;
+    $[17] = value;
+    $[18] = t7;
+  } else {
+    t7 = $[18];
+  }
+  const handleIncrement = t7;
+  let t8;
+  if ($[19] !== value) {
+    t8 = function openModal() {
+      setDraft(String(value));
+      setModalVisible(true);
+    };
+    $[19] = value;
+    $[20] = t8;
+  } else {
+    t8 = $[20];
+  }
+  const openModal = t8;
+  let t9;
+  if ($[21] !== maxValue || $[22] !== onChange || $[23] !== precision) {
+    t9 = function confirmDraft(nextDraft) {
+      let parsed = parseLocalizedNumber(nextDraft);
+      parsed = roundTo(parsed, precision);
+      if (parsed < 0) {
+        parsed = 0;
+      }
+      if (parsed > maxValue) {
+        parsed = maxValue;
+      }
+      onChange(parsed);
+      setModalVisible(false);
+    };
+    $[21] = maxValue;
+    $[22] = onChange;
+    $[23] = precision;
+    $[24] = t9;
+  } else {
+    t9 = $[24];
+  }
+  const confirmDraft = t9;
+  let t10;
+  if ($[25] !== precision || $[26] !== value) {
+    t10 = value.toFixed(precision);
+    $[25] = precision;
+    $[26] = value;
+    $[27] = t10;
+  } else {
+    t10 = $[27];
+  }
+  const formatted = t10;
+  let T0;
+  let T1;
+  let t11;
+  let t12;
+  let t13;
+  let t14;
+  let t15;
+  let t16;
+  let t17;
+  let t18;
+  if ($[28] !== disabled || $[29] !== formatted || $[30] !== handleDecrement || $[31] !== openModal || $[32] !== style || $[33] !== value) {
+    const decrementStyles = fractionalQuantityInput({
+      disabled: disabled || value <= 0
+    });
+    const incrementStyles = fractionalQuantityInput({
+      disabled
+    });
     const containerStyles = fractionalQuantityInput();
-    return (_jsxs(View, { accessibilityLabel: `Cantidad ${formatted}`, className: containerStyles.container(), style: style, children: [_jsx(TouchableOpacity, { className: decrementStyles.button(), disabled: disabled || value <= 0, onPress: handleDecrement, children: _jsx(Display.Icon, { name: "remove", size: 16 }) }), _jsx(TouchableOpacity, { className: containerStyles.valueContainer(), disabled: disabled, onPress: openModal, children: _jsx(Typography.Text, { semibold: true, variant: "body", children: formatted }) }), _jsx(TouchableOpacity, { className: incrementStyles.button(), disabled: disabled, onPress: handleIncrement, children: _jsx(Display.Icon, { name: "add", size: 16 }) }), _jsx(Dialog.EditValue, { footerAdornment: _jsx(View, { className: "flex-row flex-wrap gap-2", children: chips.map((item, index) => (_jsx(Actions.Button, { onPress: () => setDraft((current) => String(roundTo(parseLocalizedNumber(current) + item, precision))), size: "small", title: `+${item}`, variant: "secondary" }, `${item}-${index}`))) }), keyboardType: "decimal-pad", onChange: setDraft, onClose: () => setModalVisible(false), onConfirm: confirmDraft, placeholder: `0${precision > 0 ? ",".padEnd(precision + 1, "0") : ""}`, rightAdornment: _jsxs(Typography.Text, { className: "ml-1", variant: "body", children: ["(m\u00EDn ", effectiveIncrement, ")"] }), title: "Editar cantidad", value: draft, visible: modalVisible })] }));
+    T1 = View;
+    t15 = containerStyles.container();
+    t16 = style;
+    const t19 = disabled || value <= 0;
+    let t20;
+    if ($[44] !== t19) {
+      t20 = {
+        disabled: t19
+      };
+      $[44] = t19;
+      $[45] = t20;
+    } else {
+      t20 = $[45];
+    }
+    const t21 = decrementStyles.button();
+    const t22 = disabled || value <= 0;
+    let t23;
+    if ($[46] === Symbol.for("react.memo_cache_sentinel")) {
+      t23 = _jsx(Display.Icon, {
+        name: "remove",
+        size: 16
+      });
+      $[46] = t23;
+    } else {
+      t23 = $[46];
+    }
+    if ($[47] !== handleDecrement || $[48] !== t20 || $[49] !== t21 || $[50] !== t22) {
+      t17 = _jsx(TouchableOpacity, {
+        accessibilityLabel: "Disminuir",
+        accessibilityRole: "button",
+        accessibilityState: t20,
+        className: t21,
+        disabled: t22,
+        hitSlop: STEP_SLOP,
+        onPress: handleDecrement,
+        children: t23
+      });
+      $[47] = handleDecrement;
+      $[48] = t20;
+      $[49] = t21;
+      $[50] = t22;
+      $[51] = t17;
+    } else {
+      t17 = $[51];
+    }
+    const t24 = `Cantidad ${formatted}`;
+    let t25;
+    if ($[52] !== disabled) {
+      t25 = {
+        disabled
+      };
+      $[52] = disabled;
+      $[53] = t25;
+    } else {
+      t25 = $[53];
+    }
+    let t26;
+    if ($[54] !== formatted) {
+      t26 = _jsx(Typography.Text, {
+        semibold: true,
+        variant: "body",
+        children: formatted
+      });
+      $[54] = formatted;
+      $[55] = t26;
+    } else {
+      t26 = $[55];
+    }
+    if ($[56] !== disabled || $[57] !== openModal || $[58] !== t24 || $[59] !== t25 || $[60] !== t26) {
+      t18 = _jsx(TouchableOpacity, {
+        accessibilityHint: "Abre el editor de cantidad",
+        accessibilityLabel: t24,
+        accessibilityRole: "button",
+        accessibilityState: t25,
+        className: containerStyles.valueContainer(),
+        disabled: disabled,
+        onPress: openModal,
+        children: t26
+      });
+      $[56] = disabled;
+      $[57] = openModal;
+      $[58] = t24;
+      $[59] = t25;
+      $[60] = t26;
+      $[61] = t18;
+    } else {
+      t18 = $[61];
+    }
+    T0 = TouchableOpacity;
+    t11 = "Aumentar";
+    t12 = "button";
+    if ($[62] !== disabled) {
+      t13 = {
+        disabled
+      };
+      $[62] = disabled;
+      $[63] = t13;
+    } else {
+      t13 = $[63];
+    }
+    t14 = incrementStyles.button();
+    $[28] = disabled;
+    $[29] = formatted;
+    $[30] = handleDecrement;
+    $[31] = openModal;
+    $[32] = style;
+    $[33] = value;
+    $[34] = T0;
+    $[35] = T1;
+    $[36] = t11;
+    $[37] = t12;
+    $[38] = t13;
+    $[39] = t14;
+    $[40] = t15;
+    $[41] = t16;
+    $[42] = t17;
+    $[43] = t18;
+  } else {
+    T0 = $[34];
+    T1 = $[35];
+    t11 = $[36];
+    t12 = $[37];
+    t13 = $[38];
+    t14 = $[39];
+    t15 = $[40];
+    t16 = $[41];
+    t17 = $[42];
+    t18 = $[43];
+  }
+  let t19;
+  if ($[64] === Symbol.for("react.memo_cache_sentinel")) {
+    t19 = _jsx(Display.Icon, {
+      name: "add",
+      size: 16
+    });
+    $[64] = t19;
+  } else {
+    t19 = $[64];
+  }
+  let t20;
+  if ($[65] !== T0 || $[66] !== disabled || $[67] !== handleIncrement || $[68] !== t11 || $[69] !== t12 || $[70] !== t13 || $[71] !== t14) {
+    t20 = _jsx(T0, {
+      accessibilityLabel: t11,
+      accessibilityRole: t12,
+      accessibilityState: t13,
+      className: t14,
+      disabled: disabled,
+      hitSlop: STEP_SLOP,
+      onPress: handleIncrement,
+      children: t19
+    });
+    $[65] = T0;
+    $[66] = disabled;
+    $[67] = handleIncrement;
+    $[68] = t11;
+    $[69] = t12;
+    $[70] = t13;
+    $[71] = t14;
+    $[72] = t20;
+  } else {
+    t20 = $[72];
+  }
+  let t21;
+  if ($[73] !== chips || $[74] !== precision) {
+    let t22;
+    if ($[76] !== precision) {
+      t22 = (item, index) => _jsx(Actions.Button, {
+        onPress: () => setDraft(current => String(roundTo(parseLocalizedNumber(current) + item, precision))),
+        size: "small",
+        title: `+${item}`,
+        variant: "secondary"
+      }, `${item}-${index}`);
+      $[76] = precision;
+      $[77] = t22;
+    } else {
+      t22 = $[77];
+    }
+    t21 = chips.map(t22);
+    $[73] = chips;
+    $[74] = precision;
+    $[75] = t21;
+  } else {
+    t21 = $[75];
+  }
+  let t22;
+  if ($[78] !== t21) {
+    t22 = _jsx(View, {
+      className: "flex-row flex-wrap gap-2",
+      children: t21
+    });
+    $[78] = t21;
+    $[79] = t22;
+  } else {
+    t22 = $[79];
+  }
+  let t23;
+  if ($[80] === Symbol.for("react.memo_cache_sentinel")) {
+    t23 = () => setModalVisible(false);
+    $[80] = t23;
+  } else {
+    t23 = $[80];
+  }
+  let t24;
+  if ($[81] !== precision) {
+    t24 = precision > 0 ? ",".padEnd(precision + 1, "0") : "";
+    $[81] = precision;
+    $[82] = t24;
+  } else {
+    t24 = $[82];
+  }
+  const t25 = `0${t24}`;
+  let t26;
+  if ($[83] !== effectiveIncrement) {
+    t26 = _jsxs(Typography.Text, {
+      className: "ml-1",
+      variant: "body",
+      children: ["(m\xEDn ", effectiveIncrement, ")"]
+    });
+    $[83] = effectiveIncrement;
+    $[84] = t26;
+  } else {
+    t26 = $[84];
+  }
+  let t27;
+  if ($[85] !== confirmDraft || $[86] !== draft || $[87] !== modalVisible || $[88] !== t22 || $[89] !== t25 || $[90] !== t26) {
+    t27 = _jsx(Dialog.EditValue, {
+      footerAdornment: t22,
+      keyboardType: "decimal-pad",
+      onChange: setDraft,
+      onClose: t23,
+      onConfirm: confirmDraft,
+      placeholder: t25,
+      rightAdornment: t26,
+      title: "Editar cantidad",
+      value: draft,
+      visible: modalVisible
+    });
+    $[85] = confirmDraft;
+    $[86] = draft;
+    $[87] = modalVisible;
+    $[88] = t22;
+    $[89] = t25;
+    $[90] = t26;
+    $[91] = t27;
+  } else {
+    t27 = $[91];
+  }
+  let t28;
+  if ($[92] !== T1 || $[93] !== t15 || $[94] !== t16 || $[95] !== t17 || $[96] !== t18 || $[97] !== t20 || $[98] !== t27) {
+    t28 = _jsxs(T1, {
+      className: t15,
+      style: t16,
+      children: [t17, t18, t20, t27]
+    });
+    $[92] = T1;
+    $[93] = t15;
+    $[94] = t16;
+    $[95] = t17;
+    $[96] = t18;
+    $[97] = t20;
+    $[98] = t27;
+    $[99] = t28;
+  } else {
+    t28 = $[99];
+  }
+  return t28;
 }
 export default FractionalQuantityInput;