@sincpro/mobile-ui 3.0.1 → 3.2.0

package/dist/Actions/Actions.Dock.d.ts

@@ -16,5 +16,5 @@ export type DockProps = {
     className?: string;
     testID?: string;
 };
-declare function Dock({ primaryAction, children, summary, title, moreLabel, collapseLabel, expanded: controlledExpanded, defaultExpanded, onExpandedChange, dismissible, snapPoints, placement, safeAreaBottom, className, testID, }: DockProps): import("react").JSX.Element;
+declare function Dock({ primaryAction, children, summary, title, moreLabel, collapseLabel, expanded: controlledExpanded, defaultExpanded, onExpandedChange, dismissible, snapPoints, placement, safeAreaBottom: safeAreaBottomProp, className, testID, }: DockProps): import("react").JSX.Element;
 export default Dock;

package/dist/Actions/Actions.Dock.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import Sheet from "../Dialog/Dialog.Sheet.js";
 import Icon from "../Display/Display.Icon.js";
 import Pressable from "../primitives/Pressable.js";
@@ -9,23 +9,302 @@ import { useState } from "react";
 import { View } from "react-native";
 import { KeyboardStickyView } from "react-native-keyboard-controller";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-function Dock({ primaryAction, children, summary, title = "Más opciones", moreLabel = "Más opciones", collapseLabel = "Ocultar opciones", expanded: controlledExpanded, defaultExpanded = false, onExpandedChange, dismissible = true, snapPoints, placement = "fixed", safeAreaBottom = placement === "fixed", className, testID, }) {
-    const theme = useTheme();
-    const insets = useSafeAreaInsets();
-    const [internalExpanded, setInternalExpanded] = useState(defaultExpanded);
-    const expanded = controlledExpanded ?? internalExpanded;
-    const requestExpanded = (next) => {
-        if (next === expanded)
-            return;
-        if (!next && !dismissible)
-            return;
-        if (controlledExpanded === undefined)
-            setInternalExpanded(next);
-        onExpandedChange?.(next);
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "nativewind/jsx-runtime";
+function Dock(t0) {
+  const $ = _c(66);
+  const {
+    primaryAction,
+    children,
+    summary,
+    title: t1,
+    moreLabel: t2,
+    collapseLabel: t3,
+    expanded: controlledExpanded,
+    defaultExpanded: t4,
+    onExpandedChange,
+    dismissible: t5,
+    snapPoints,
+    placement: t6,
+    safeAreaBottom: safeAreaBottomProp,
+    className,
+    testID
+  } = t0;
+  const title = t1 === undefined ? "M\xE1s opciones" : t1;
+  const moreLabel = t2 === undefined ? "M\xE1s opciones" : t2;
+  const collapseLabel = t3 === undefined ? "Ocultar opciones" : t3;
+  const defaultExpanded = t4 === undefined ? false : t4;
+  const dismissible = t5 === undefined ? true : t5;
+  const placement = t6 === undefined ? "fixed" : t6;
+  const safeAreaBottom = safeAreaBottomProp ?? placement === "fixed";
+  const theme = useTheme();
+  const insets = useSafeAreaInsets();
+  const [internalExpanded, setInternalExpanded] = useState(defaultExpanded);
+  const expanded = controlledExpanded ?? internalExpanded;
+  let t7;
+  if ($[0] !== controlledExpanded || $[1] !== dismissible || $[2] !== expanded || $[3] !== onExpandedChange) {
+    t7 = next => {
+      if (next === expanded) {
+        return;
+      }
+      if (!next && !dismissible) {
+        return;
+      }
+      if (controlledExpanded === undefined) {
+        setInternalExpanded(next);
+      }
+      onExpandedChange?.(next);
+    };
+    $[0] = controlledExpanded;
+    $[1] = dismissible;
+    $[2] = expanded;
+    $[3] = onExpandedChange;
+    $[4] = t7;
+  } else {
+    t7 = $[4];
+  }
+  const requestExpanded = t7;
+  const t8 = !expanded && "border-t border-border-light px-4";
+  let t9;
+  if ($[5] !== className || $[6] !== t8) {
+    t9 = cn("gap-3 bg-bg-card py-2", t8, className);
+    $[5] = className;
+    $[6] = t8;
+    $[7] = t9;
+  } else {
+    t9 = $[7];
+  }
+  const t10 = !expanded && safeAreaBottom ? insets.bottom + 8 : 8;
+  let t11;
+  if ($[8] !== t10) {
+    t11 = {
+      paddingBottom: t10
+    };
+    $[8] = t10;
+    $[9] = t11;
+  } else {
+    t11 = $[9];
+  }
+  const t12 = testID ? `${testID}-bar` : undefined;
+  const t13 = expanded ? collapseLabel : moreLabel;
+  const t14 = expanded && !dismissible;
+  let t15;
+  if ($[10] !== expanded || $[11] !== t14) {
+    t15 = {
+      expanded,
+      disabled: t14
+    };
+    $[10] = expanded;
+    $[11] = t14;
+    $[12] = t15;
+  } else {
+    t15 = $[12];
+  }
+  const t16 = expanded && !dismissible;
+  let t17;
+  if ($[13] !== expanded || $[14] !== requestExpanded) {
+    t17 = () => requestExpanded(!expanded);
+    $[13] = expanded;
+    $[14] = requestExpanded;
+    $[15] = t17;
+  } else {
+    t17 = $[15];
+  }
+  let t18;
+  if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
+    t18 = {
+      minWidth: 48,
+      minHeight: 48
+    };
+    $[16] = t18;
+  } else {
+    t18 = $[16];
+  }
+  const t19 = testID ? `${testID}-more` : undefined;
+  const t20 = expanded && !dismissible ? "text-text-disabled" : "text-text-primary";
+  const t21 = expanded ? collapseLabel : moreLabel;
+  let t22;
+  if ($[17] !== t20 || $[18] !== t21) {
+    t22 = _jsx(Typography.Text, {
+      className: t20,
+      variant: "buttonSmall",
+      children: t21
+    });
+    $[17] = t20;
+    $[18] = t21;
+    $[19] = t22;
+  } else {
+    t22 = $[19];
+  }
+  const t23 = expanded && !dismissible ? theme.icon.disabled : theme.icon.secondary;
+  const t24 = expanded ? "expand" : "collapse";
+  let t25;
+  if ($[20] !== t23 || $[21] !== t24) {
+    t25 = _jsx(Icon, {
+      color: t23,
+      name: t24,
+      size: 16
+    });
+    $[20] = t23;
+    $[21] = t24;
+    $[22] = t25;
+  } else {
+    t25 = $[22];
+  }
+  let t26;
+  if ($[23] !== t13 || $[24] !== t15 || $[25] !== t16 || $[26] !== t17 || $[27] !== t19 || $[28] !== t22 || $[29] !== t25) {
+    t26 = _jsxs(Pressable, {
+      accessibilityLabel: t13,
+      accessibilityRole: "button",
+      accessibilityState: t15,
+      className: "flex-1 flex-row items-center justify-center gap-2 rounded-md bg-bg-muted px-3",
+      disabled: t16,
+      onPress: t17,
+      style: t18,
+      testID: t19,
+      children: [t22, t25]
+    });
+    $[23] = t13;
+    $[24] = t15;
+    $[25] = t16;
+    $[26] = t17;
+    $[27] = t19;
+    $[28] = t22;
+    $[29] = t25;
+    $[30] = t26;
+  } else {
+    t26 = $[30];
+  }
+  let t27;
+  if ($[31] !== primaryAction) {
+    t27 = _jsx(View, {
+      className: "flex-1",
+      children: primaryAction
+    });
+    $[31] = primaryAction;
+    $[32] = t27;
+  } else {
+    t27 = $[32];
+  }
+  let t28;
+  if ($[33] !== t26 || $[34] !== t27) {
+    t28 = _jsxs(View, {
+      className: "flex-row items-center gap-3",
+      children: [t26, t27]
+    });
+    $[33] = t26;
+    $[34] = t27;
+    $[35] = t28;
+  } else {
+    t28 = $[35];
+  }
+  let t29;
+  if ($[36] !== summary || $[37] !== t11 || $[38] !== t12 || $[39] !== t28 || $[40] !== t9) {
+    t29 = _jsxs(View, {
+      className: t9,
+      style: t11,
+      testID: t12,
+      children: [summary, t28]
+    });
+    $[36] = summary;
+    $[37] = t11;
+    $[38] = t12;
+    $[39] = t28;
+    $[40] = t9;
+    $[41] = t29;
+  } else {
+    t29 = $[41];
+  }
+  const bar = t29;
+  const t30 = placement === "fixed" && !expanded;
+  const t31 = safeAreaBottom ? insets.bottom : 0;
+  let t32;
+  if ($[42] !== t31) {
+    t32 = {
+      opened: t31
     };
-    const bar = (_jsxs(View, { className: cn("gap-3 bg-bg-card py-2", !expanded && "border-t border-border-light px-4", className), style: { paddingBottom: !expanded && safeAreaBottom ? insets.bottom + 8 : 8 }, testID: testID ? `${testID}-bar` : undefined, children: [summary, _jsxs(View, { className: "flex-row items-center gap-3", children: [_jsxs(Pressable, { accessibilityLabel: expanded ? collapseLabel : moreLabel, accessibilityRole: "button", accessibilityState: { expanded, disabled: expanded && !dismissible }, className: "flex-1 flex-row items-center justify-center gap-2 rounded-lg bg-bg-muted px-3", disabled: expanded && !dismissible, onPress: () => requestExpanded(!expanded), style: { minWidth: 48, minHeight: 48 }, testID: testID ? `${testID}-more` : undefined, children: [_jsx(Typography.Text, { className: expanded && !dismissible ? "text-text-disabled" : "text-text-primary", variant: "buttonSmall", children: expanded ? collapseLabel : moreLabel }), _jsx(Icon, { color: expanded && !dismissible ? theme.icon.disabled : theme.icon.secondary, name: expanded ? "expand" : "collapse", size: 16 })] }), _jsx(View, { className: "flex-1", children: primaryAction })] })] }));
-    return (_jsxs(_Fragment, { children: [_jsx(KeyboardStickyView, { enabled: placement === "fixed" && !expanded, offset: { opened: safeAreaBottom ? insets.bottom : 0 }, style: placement === "fixed"
-                    ? { position: "absolute", bottom: 0, left: 0, right: 0, zIndex: 20 }
-                    : undefined, testID: testID, children: !expanded ? bar : null }), _jsx(Sheet, { dismissible: dismissible, footer: expanded ? bar : undefined, onClose: () => requestExpanded(false), snapPoints: snapPoints, testID: testID ? `${testID}-sheet` : undefined, title: title, visible: expanded, children: children })] }));
+    $[42] = t31;
+    $[43] = t32;
+  } else {
+    t32 = $[43];
+  }
+  let t33;
+  if ($[44] !== placement) {
+    t33 = placement === "fixed" ? {
+      position: "absolute",
+      bottom: 0,
+      left: 0,
+      right: 0,
+      zIndex: 20
+    } : undefined;
+    $[44] = placement;
+    $[45] = t33;
+  } else {
+    t33 = $[45];
+  }
+  const t34 = !expanded ? bar : null;
+  let t35;
+  if ($[46] !== t30 || $[47] !== t32 || $[48] !== t33 || $[49] !== t34 || $[50] !== testID) {
+    t35 = _jsx(KeyboardStickyView, {
+      enabled: t30,
+      offset: t32,
+      style: t33,
+      testID: testID,
+      children: t34
+    });
+    $[46] = t30;
+    $[47] = t32;
+    $[48] = t33;
+    $[49] = t34;
+    $[50] = testID;
+    $[51] = t35;
+  } else {
+    t35 = $[51];
+  }
+  const t36 = expanded ? bar : undefined;
+  let t37;
+  if ($[52] !== requestExpanded) {
+    t37 = () => requestExpanded(false);
+    $[52] = requestExpanded;
+    $[53] = t37;
+  } else {
+    t37 = $[53];
+  }
+  const t38 = testID ? `${testID}-sheet` : undefined;
+  let t39;
+  if ($[54] !== children || $[55] !== dismissible || $[56] !== expanded || $[57] !== snapPoints || $[58] !== t36 || $[59] !== t37 || $[60] !== t38 || $[61] !== title) {
+    t39 = _jsx(Sheet, {
+      dismissible: dismissible,
+      footer: t36,
+      onClose: t37,
+      snapPoints: snapPoints,
+      testID: t38,
+      title: title,
+      visible: expanded,
+      children: children
+    });
+    $[54] = children;
+    $[55] = dismissible;
+    $[56] = expanded;
+    $[57] = snapPoints;
+    $[58] = t36;
+    $[59] = t37;
+    $[60] = t38;
+    $[61] = title;
+    $[62] = t39;
+  } else {
+    t39 = $[62];
+  }
+  let t40;
+  if ($[63] !== t35 || $[64] !== t39) {
+    t40 = _jsxs(_Fragment, {
+      children: [t35, t39]
+    });
+    $[63] = t35;
+    $[64] = t39;
+    $[65] = t40;
+  } else {
+    t40 = $[65];
+  }
+  return t40;
 }
 export default Dock;

package/dist/Actions/Actions.FAB.js

@@ -1,19 +1,107 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import Icon from "../Display/Display.Icon.js";
 import Pressable from "../primitives/Pressable.js";
-import { theme } from "../theme/index.js";
+import { useTheme } from "../theme/index.js";
 import { cn } from "../theme/tw.js";
 import { Typography } from "../Typography/index.js";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-function FAB({ icon, onPress, label, position = "bottom-right", className, testID, accessibilityLabel, }) {
-    const insets = useSafeAreaInsets();
-    return (_jsxs(Pressable, { accessibilityLabel: accessibilityLabel ?? label ?? "Acción", accessibilityRole: "button", className: cn("absolute flex-row items-center justify-center rounded-full bg-primary", label ? "min-h-14 px-5 py-3 gap-2" : "w-14 h-14", className), onPress: onPress, style: {
-            minHeight: 56,
-            minWidth: 56,
-            bottom: insets.bottom + 16,
-            right: position === "bottom-right" ? 16 : undefined,
-            left: position === "bottom-left" ? 16 : undefined,
-            ...theme.shadow.lg,
-        }, testID: testID, children: [_jsx(Icon, { color: theme.icon.inverse, name: icon, size: 24 }), label ? (_jsx(Typography.Text, { className: "text-text-on-primary font-semibold", style: { flexShrink: 1 }, children: label })) : null] }));
+import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+function FAB(t0) {
+  const $ = _c(21);
+  const {
+    icon,
+    onPress,
+    label,
+    position: t1,
+    className,
+    testID,
+    accessibilityLabel
+  } = t0;
+  const position = t1 === undefined ? "bottom-right" : t1;
+  const theme = useTheme();
+  const insets = useSafeAreaInsets();
+  const t2 = accessibilityLabel ?? label ?? "Acci\xF3n";
+  const t3 = label ? "min-h-14 px-5 py-3 gap-2" : "w-14 h-14";
+  let t4;
+  if ($[0] !== className || $[1] !== t3) {
+    t4 = cn("absolute flex-row items-center justify-center rounded-full bg-primary", t3, className);
+    $[0] = className;
+    $[1] = t3;
+    $[2] = t4;
+  } else {
+    t4 = $[2];
+  }
+  const t5 = insets.bottom + 16;
+  const t6 = position === "bottom-right" ? 16 : undefined;
+  const t7 = position === "bottom-left" ? 16 : undefined;
+  let t8;
+  if ($[3] !== t5 || $[4] !== t6 || $[5] !== t7 || $[6] !== theme.shadow.lg) {
+    t8 = {
+      minHeight: 56,
+      minWidth: 56,
+      bottom: t5,
+      right: t6,
+      left: t7,
+      ...theme.shadow.lg
+    };
+    $[3] = t5;
+    $[4] = t6;
+    $[5] = t7;
+    $[6] = theme.shadow.lg;
+    $[7] = t8;
+  } else {
+    t8 = $[7];
+  }
+  let t9;
+  if ($[8] !== icon || $[9] !== theme.icon.inverse) {
+    t9 = _jsx(Icon, {
+      color: theme.icon.inverse,
+      name: icon,
+      size: 24
+    });
+    $[8] = icon;
+    $[9] = theme.icon.inverse;
+    $[10] = t9;
+  } else {
+    t9 = $[10];
+  }
+  let t10;
+  if ($[11] !== label) {
+    t10 = label ? _jsx(Typography.Text, {
+      className: "text-text-on-primary",
+      semibold: true,
+      style: {
+        flexShrink: 1
+      },
+      children: label
+    }) : null;
+    $[11] = label;
+    $[12] = t10;
+  } else {
+    t10 = $[12];
+  }
+  let t11;
+  if ($[13] !== onPress || $[14] !== t10 || $[15] !== t2 || $[16] !== t4 || $[17] !== t8 || $[18] !== t9 || $[19] !== testID) {
+    t11 = _jsxs(Pressable, {
+      accessibilityLabel: t2,
+      accessibilityRole: "button",
+      className: t4,
+      onPress: onPress,
+      style: t8,
+      testID: testID,
+      children: [t9, t10]
+    });
+    $[13] = onPress;
+    $[14] = t10;
+    $[15] = t2;
+    $[16] = t4;
+    $[17] = t8;
+    $[18] = t9;
+    $[19] = testID;
+    $[20] = t11;
+  } else {
+    t11 = $[20];
+  }
+  return t11;
 }
 export default FAB;

package/dist/Actions/Actions.FilterButton.d.ts

@@ -1,13 +1,30 @@
+import type { IconName } from "../Display/index.js";
 import { FC, ReactNode } from "react";
+export interface FilterChipProps {
+    label: string;
+    active?: boolean;
+    onPress: () => void;
+    /** Leading icon, e.g. `filter` for the trigger of a filter sheet. */
+    icon?: IconName;
+    /** Trailing count, e.g. how many filters are applied. Hidden when 0. */
+    count?: number;
+    disabled?: boolean;
+    accessibilityLabel?: string;
+    className?: string;
+    testID?: string;
+}
+export declare function FilterChip({ label, active, onPress, icon, count, disabled, accessibilityLabel, className, testID, }: FilterChipProps): import("react").JSX.Element;
 export interface FilterButtonProps {
     title: string;
     active: boolean;
     onPress: () => void;
+    /** Kept for compatibility: every filter button renders the same chip. */
     variant?: "default" | "mobile";
     disabled?: boolean;
     className?: string;
     testID?: string;
 }
+/** A filter toggle. Same chip as `ListViewV2.Header.Filters.Chip` and `Search.Filters`. */
 export declare const FilterButton: FC<FilterButtonProps>;
 export interface FilterButtonGroupProps {
     children: ReactNode;