@sincpro/mobile-ui 3.1.0 → 3.2.0

package/dist/Display/Display.SwipeableRow.js

@@ -1,6 +1,7 @@
 import { c as _c } from "react/compiler-runtime";
 import Icon from "./Display.Icon.js";
 import { useTheme } from "../theme/index.js";
+import { resolveOnColor } from "../theme/contrast.js";
 import { Typography } from "../Typography/index.js";
 import { useRef } from "react";
 import { TouchableOpacity, View } from "react-native";
@@ -26,29 +27,35 @@ function ActionButtons(t0) {
   if ($[1] !== actions || $[2] !== onDone || $[3] !== theme) {
     let t3;
     if ($[5] !== onDone || $[6] !== theme) {
-      t3 = (action, index) => _jsxs(TouchableOpacity, {
-        accessibilityLabel: action.label ?? "Acci\xF3n",
-        accessibilityRole: "button",
-        activeOpacity: 0.8,
-        onPress: () => {
-          onDone();
-          action.onPress();
-        },
-        style: {
-          backgroundColor: action.color ?? theme.danger,
-          justifyContent: "center",
-          alignItems: "center",
-          paddingHorizontal: 20
-        },
-        children: [action.icon ? _jsx(Icon, {
-          color: theme.text.inverse,
-          name: action.icon,
-          size: 20
-        }) : null, action.label ? _jsx(Typography.Text, {
-          className: "text-text-inverse mt-1",
-          children: action.label
-        }) : null]
-      }, index);
+      t3 = (action, index) => {
+        const ink = action.color ? resolveOnColor(action.color) : theme.text.onDanger;
+        return _jsxs(TouchableOpacity, {
+          accessibilityLabel: action.label ?? "Acci\xF3n",
+          accessibilityRole: "button",
+          activeOpacity: 0.8,
+          onPress: () => {
+            onDone();
+            action.onPress();
+          },
+          style: {
+            backgroundColor: action.color ?? theme.danger,
+            justifyContent: "center",
+            alignItems: "center",
+            paddingHorizontal: 20
+          },
+          children: [action.icon ? _jsx(Icon, {
+            color: ink,
+            name: action.icon,
+            size: 20
+          }) : null, action.label ? _jsx(Typography.Text, {
+            className: "mt-1",
+            style: {
+              color: ink
+            },
+            children: action.label
+          }) : null]
+        }, index);
+      };
       $[5] = onDone;
       $[6] = theme;
       $[7] = t3;

package/dist/Display/icon-map.d.ts

@@ -10,7 +10,7 @@ export declare const ICON_MAP: {
         readonly md: "add";
     };
     readonly "add-circle": {
-        readonly sf: "plus.circle.fill";
+        readonly sf: "plus.circle";
         readonly md: "add_circle";
     };
     readonly archive: {
@@ -90,7 +90,7 @@ export declare const ICON_MAP: {
         readonly md: "delete";
     };
     readonly dismiss: {
-        readonly sf: "xmark.circle.fill";
+        readonly sf: "xmark.circle";
         readonly md: "cancel";
     };
     readonly document: {
@@ -118,7 +118,7 @@ export declare const ICON_MAP: {
         readonly md: "inbox";
     };
     readonly error: {
-        readonly sf: "exclamationmark.circle.fill";
+        readonly sf: "exclamationmark.circle";
         readonly md: "error";
     };
     readonly expand: {
@@ -146,7 +146,7 @@ export declare const ICON_MAP: {
         readonly md: "visibility_off";
     };
     readonly home: {
-        readonly sf: "house.fill";
+        readonly sf: "house";
         readonly md: "home";
     };
     readonly image: {
@@ -158,7 +158,7 @@ export declare const ICON_MAP: {
         readonly md: "inbox";
     };
     readonly info: {
-        readonly sf: "info.circle.fill";
+        readonly sf: "info.circle";
         readonly md: "info";
     };
     readonly link: {
@@ -206,7 +206,7 @@ export declare const ICON_MAP: {
         readonly md: "more_vert";
     };
     readonly mute: {
-        readonly sf: "speaker.slash.fill";
+        readonly sf: "speaker.slash";
         readonly md: "volume_off";
     };
     readonly next: {
@@ -290,11 +290,11 @@ export declare const ICON_MAP: {
         readonly md: "share";
     };
     readonly stop: {
-        readonly sf: "hand.raised.fill";
+        readonly sf: "hand.raised";
         readonly md: "front_hand";
     };
     readonly success: {
-        readonly sf: "checkmark.circle.fill";
+        readonly sf: "checkmark.circle";
         readonly md: "check_circle";
     };
     readonly sync: {
@@ -326,7 +326,7 @@ export declare const ICON_MAP: {
         readonly md: "visibility";
     };
     readonly volume: {
-        readonly sf: "speaker.wave.2.fill";
+        readonly sf: "speaker.wave.2";
         readonly md: "volume_up";
     };
     readonly wallet: {
@@ -334,7 +334,7 @@ export declare const ICON_MAP: {
         readonly md: "wallet";
     };
     readonly warning: {
-        readonly sf: "exclamationmark.triangle.fill";
+        readonly sf: "exclamationmark.triangle";
         readonly md: "warning";
     };
     readonly wifi: {

package/dist/Display/icon-map.js

@@ -1,10 +1,14 @@
+// Android and web draw from Material Symbols 400, an outline-only font. SF Symbols use the
+// outline variant too, so an icon looks the same on both platforms. Only glyphs that are
+// solid in Material as well (play, pause) or whose fill is the meaning against an empty pair
+// (rating / rating-empty, bookmark / bookmark-empty) use `.fill`.
 export const ICON_MAP = {
   add: {
     sf: "plus",
     md: "add"
   },
   "add-circle": {
-    sf: "plus.circle.fill",
+    sf: "plus.circle",
     md: "add_circle"
   },
   archive: {
@@ -84,7 +88,7 @@ export const ICON_MAP = {
     md: "delete"
   },
   dismiss: {
-    sf: "xmark.circle.fill",
+    sf: "xmark.circle",
     md: "cancel"
   },
   document: {
@@ -112,7 +116,7 @@ export const ICON_MAP = {
     md: "inbox"
   },
   error: {
-    sf: "exclamationmark.circle.fill",
+    sf: "exclamationmark.circle",
     md: "error"
   },
   expand: {
@@ -140,7 +144,7 @@ export const ICON_MAP = {
     md: "visibility_off"
   },
   home: {
-    sf: "house.fill",
+    sf: "house",
     md: "home"
   },
   image: {
@@ -152,7 +156,7 @@ export const ICON_MAP = {
     md: "inbox"
   },
   info: {
-    sf: "info.circle.fill",
+    sf: "info.circle",
     md: "info"
   },
   link: {
@@ -200,7 +204,7 @@ export const ICON_MAP = {
     md: "more_vert"
   },
   mute: {
-    sf: "speaker.slash.fill",
+    sf: "speaker.slash",
     md: "volume_off"
   },
   next: {
@@ -284,11 +288,11 @@ export const ICON_MAP = {
     md: "share"
   },
   stop: {
-    sf: "hand.raised.fill",
+    sf: "hand.raised",
     md: "front_hand"
   },
   success: {
-    sf: "checkmark.circle.fill",
+    sf: "checkmark.circle",
     md: "check_circle"
   },
   sync: {
@@ -320,7 +324,7 @@ export const ICON_MAP = {
     md: "visibility"
   },
   volume: {
-    sf: "speaker.wave.2.fill",
+    sf: "speaker.wave.2",
     md: "volume_up"
   },
   wallet: {
@@ -328,7 +332,7 @@ export const ICON_MAP = {
     md: "wallet"
   },
   warning: {
-    sf: "exclamationmark.triangle.fill",
+    sf: "exclamationmark.triangle",
     md: "warning"
   },
   wifi: {

package/dist/Form/Form.DatePicker.js

@@ -49,6 +49,7 @@ function withClockTime(base, time) {
   next.setHours(time.getHours(), time.getMinutes(), time.getSeconds(), time.getMilliseconds());
   return next;
 }
+const CALENDAR_SNAP_POINTS = ["90%"];
 function DatePicker(t0) {
   const $ = _c(107);
   const {
@@ -464,6 +465,7 @@ function DatePicker(t0) {
         title: "Aplicar"
       }),
       onClose: close,
+      snapPoints: mode === "date" ? CALENDAR_SNAP_POINTS : undefined,
       title: label ?? (mode === "time" ? "Seleccionar hora" : "Seleccionar fecha"),
       visible: open,
       children: [open ? _jsx(View, {

package/dist/Form/Form.Input.d.ts

@@ -21,5 +21,5 @@ export interface FormInputProps extends Omit<TextInputProps, "secureTextEntry">
  * | `card`    | bodySmall, semibold    | card surface, rounded-lg, ≥48           | 8            |
  * | `outline` | bodyLarge              | border only, rounded, 44 high           | 16           |
  */
-declare function FormInput({ label, error, tooltip, look, secure, style, multiline, numberOfLines, onFocus, onBlur, className, ref, ...props }: FormInputProps): import("react").JSX.Element;
+declare function FormInput({ label, error, tooltip, look, secure, style, multiline, numberOfLines, onFocus, onBlur, onSubmitEditing, submitBehavior, className, ref, ...props }: FormInputProps): import("react").JSX.Element;
 export default FormInput;