@sincpro/mobile-ui 0.5.0 → 0.7.0

package/dist/Feedback/Feedback.Splash.js

@@ -23,6 +23,7 @@ function Splash({ isReady, logo, minDuration = 800, message = "Inicializando..."
             clearTimeout(minDurationTimeoutRef.current);
         }
         if (!isReady) {
+            // eslint-disable-next-line react-hooks/set-state-in-effect
             setShowContent(false);
             return;
         }

package/dist/Feedback/index.d.ts

@@ -1,5 +1,4 @@
 import Banner from "../Feedback/Feedback.Banner";
-import DomainSplashScreen from "../Feedback/Feedback.DomainSplashScreen";
 import Empty from "../Feedback/Feedback.Empty";
 import EmptyState from "../Feedback/Feedback.EmptyState";
 import Error from "../Feedback/Feedback.Error";
@@ -23,6 +22,5 @@ export declare const Feedback: {
     EmptyState: typeof EmptyState;
     Error: typeof Error;
     SplashScreen: typeof SplashScreen;
-    DomainSplashScreen: typeof DomainSplashScreen;
 };
 export default Feedback;

package/dist/Feedback/index.js

@@ -1,5 +1,4 @@
 import Banner from "../Feedback/Feedback.Banner";
-import DomainSplashScreen from "../Feedback/Feedback.DomainSplashScreen";
 import Empty from "../Feedback/Feedback.Empty";
 import EmptyState from "../Feedback/Feedback.EmptyState";
 import Error from "../Feedback/Feedback.Error";
@@ -24,6 +23,5 @@ export const Feedback = {
     EmptyState,
     Error,
     SplashScreen,
-    DomainSplashScreen,
 };
 export default Feedback;

package/dist/Form/Form.Button.d.ts

@@ -1,151 +1,3 @@
-import { type VariantProps } from "../theme/tw";
-import type React from "react";
-declare const button: import("tailwind-variants").TVReturnType<{
-    variant: {
-        primary: string;
-        accent: string;
-        cta: string;
-        secondary: string;
-        outline: string;
-        outlineDanger: string;
-        outlineBlack: string;
-        flat: string;
-        link: string;
-        transparent: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, "rounded-[13px] items-center justify-center flex-row min-h-[44px]", {
-    variant: {
-        primary: string;
-        accent: string;
-        cta: string;
-        secondary: string;
-        outline: string;
-        outlineDanger: string;
-        outlineBlack: string;
-        flat: string;
-        link: string;
-        transparent: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    variant: {
-        primary: string;
-        accent: string;
-        cta: string;
-        secondary: string;
-        outline: string;
-        outlineDanger: string;
-        outlineBlack: string;
-        flat: string;
-        link: string;
-        transparent: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, "rounded-[13px] items-center justify-center flex-row min-h-[44px]", unknown, unknown, undefined>>;
-declare const buttonIcon: import("tailwind-variants").TVReturnType<{
-    variant: {
-        primary: string;
-        accent: string;
-        cta: string;
-        secondary: string;
-        outline: string;
-        outlineDanger: string;
-        outlineBlack: string;
-        flat: string;
-        link: string;
-        transparent: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, "rounded-[13px] items-center justify-center aspect-square", {
-    variant: {
-        primary: string;
-        accent: string;
-        cta: string;
-        secondary: string;
-        outline: string;
-        outlineDanger: string;
-        outlineBlack: string;
-        flat: string;
-        link: string;
-        transparent: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    variant: {
-        primary: string;
-        accent: string;
-        cta: string;
-        secondary: string;
-        outline: string;
-        outlineDanger: string;
-        outlineBlack: string;
-        flat: string;
-        link: string;
-        transparent: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, "rounded-[13px] items-center justify-center aspect-square", unknown, unknown, undefined>>;
-export interface ButtonProps extends VariantProps<typeof button> {
-    title: string;
-    onPress?: () => void;
-    confirm?: string;
-    loading?: boolean;
-    disabled?: boolean;
-    className?: string;
-    icon?: React.ReactNode;
-}
-export interface ButtonIconProps extends VariantProps<typeof buttonIcon> {
-    icon: string;
-    onPress?: () => void;
-    confirm?: string;
-    loading?: boolean;
-    disabled?: boolean;
-    className?: string;
-}
-declare const ButtonWithIcon: React.FC<ButtonProps> & {
-    Icon: React.FC<ButtonIconProps>;
-};
-export default ButtonWithIcon;
+/** @deprecated Use `Actions.Button` from `@sincpro/mobile-ui/Actions` instead. */
+export type { ButtonIconProps, ButtonProps } from "../Actions/Actions.Button";
+export { default as ButtonWithIcon, default, } from "../Actions/Actions.Button";

package/dist/Form/Form.Button.js

@@ -1,283 +1 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import { useConfirmationContext } from "../Dialog/Confirmation.context";
-import { Display } from "../Display";
-import { theme } from "../theme";
-import { tv } from "../theme/tw";
-import { Typography } from "../Typography";
-import { LinearGradient } from "expo-linear-gradient";
-import { useCallback } from "react";
-import { ActivityIndicator, TouchableOpacity, View } from "react-native";
-import { runOnJS } from "react-native-reanimated";
-// ============================================================================
-// STYLE VARIANTS
-// ============================================================================
-const button = tv({
-    base: "rounded-[13px] items-center justify-center flex-row min-h-[44px]",
-    variants: {
-        variant: {
-            primary: "shadow-sm",
-            accent: "shadow-sm",
-            cta: "shadow-sm",
-            secondary: "bg-bg-muted",
-            outline: "bg-transparent border border-primary",
-            outlineDanger: "bg-transparent border border-danger",
-            outlineBlack: "bg-transparent border border-border-strong",
-            flat: "bg-text-primary/10",
-            link: "bg-transparent min-h-0",
-            transparent: "bg-transparent border border-border-light",
-        },
-        size: {
-            small: "py-1.5 px-3 min-h-[36px]",
-            medium: "py-2.5 px-4 min-h-[44px]",
-            large: "py-3 px-5 min-h-[48px]",
-        },
-        disabled: {
-            true: "opacity-70",
-        },
-    },
-    defaultVariants: {
-        variant: "primary",
-        size: "medium",
-    },
-});
-const buttonIcon = tv({
-    base: "rounded-[13px] items-center justify-center aspect-square",
-    variants: {
-        variant: {
-            primary: "shadow-sm",
-            accent: "shadow-sm",
-            cta: "shadow-sm",
-            secondary: "bg-bg-muted",
-            outline: "bg-transparent border border-primary",
-            outlineDanger: "bg-transparent border border-danger",
-            outlineBlack: "bg-transparent border border-border-strong",
-            flat: "bg-text-primary/10",
-            link: "bg-transparent",
-            transparent: "bg-transparent border border-border-light",
-        },
-        size: {
-            small: "w-9 h-9",
-            medium: "w-11 h-11",
-            large: "w-[52px] h-[52px]",
-        },
-        disabled: {
-            true: "opacity-70",
-        },
-    },
-    defaultVariants: {
-        variant: "primary",
-        size: "medium",
-    },
-});
-const textColor = tv({
-    variants: {
-        variant: {
-            primary: "text-white",
-            accent: "text-text-on-accent",
-            cta: "text-text-on-accent",
-            secondary: "text-text-primary",
-            outline: "text-primary",
-            outlineDanger: "text-danger",
-            outlineBlack: "text-text-primary",
-            flat: "text-text-primary",
-            link: "text-primary",
-            transparent: "text-white",
-        },
-        disabled: {
-            true: "opacity-50",
-        },
-    },
-    compoundVariants: [
-        {
-            variant: "primary",
-            disabled: true,
-            className: "text-white/70",
-        },
-        {
-            variant: "accent",
-            disabled: true,
-            className: "text-text-on-accent",
-        },
-        {
-            variant: "cta",
-            disabled: true,
-            className: "text-text-on-accent",
-        },
-        {
-            variant: "transparent",
-            disabled: true,
-            className: "text-white/70",
-        },
-        {
-            variant: ["secondary", "outline", "link"],
-            disabled: true,
-            className: "text-text-secondary",
-        },
-        {
-            variant: "outlineDanger",
-            disabled: true,
-            className: "text-danger/50",
-        },
-        {
-            variant: "outlineBlack",
-            disabled: true,
-            className: "text-text-primary/50",
-        },
-        {
-            variant: "flat",
-            disabled: true,
-            className: "text-text-primary/50",
-        },
-    ],
-    defaultVariants: {
-        variant: "primary",
-        disabled: false,
-    },
-});
-// ============================================================================
-// COLOR & SIZE MAPS (Dynamic with theme)
-// ============================================================================
-function getLoadingColorDynamic(variant) {
-    const map = {
-        primary: theme.text.inverse,
-        accent: theme.text.inverse,
-        cta: theme.text.inverse,
-        secondary: theme.text.primary,
-        outline: theme.primary,
-        outlineDanger: theme.danger,
-        outlineBlack: theme.text.primary,
-        flat: theme.text.primary,
-        link: theme.primary,
-        transparent: theme.text.inverse,
-    };
-    return map[variant] ?? theme.text.inverse;
-}
-function getIconColorDynamic(variant, disabled) {
-    if (disabled) {
-        const disabledMap = {
-            primary: theme.icon.inverse + "70",
-            accent: theme.text.onAccent + "70",
-            cta: theme.text.onAccent + "70",
-            secondary: theme.text.disabled,
-            outline: theme.icon.disabled,
-            outlineDanger: theme.danger + "7f",
-            outlineBlack: theme.text.primary + "7f",
-            flat: theme.text.primary + "7f",
-            link: theme.icon.disabled,
-            transparent: theme.icon.inverse + "70",
-        };
-        return disabledMap[variant] ?? theme.icon.disabled;
-    }
-    const enabledMap = {
-        primary: theme.icon.inverse,
-        accent: theme.text.onAccent,
-        cta: theme.text.onAccent,
-        secondary: theme.text.primary,
-        outline: theme.primary,
-        outlineDanger: theme.danger,
-        outlineBlack: theme.text.primary,
-        flat: theme.text.primary,
-        link: theme.primary,
-        transparent: theme.icon.inverse,
-    };
-    return enabledMap[variant] ?? theme.icon.inverse;
-}
-const iconSizeMap = {
-    small: 16,
-    medium: 20,
-    large: 28,
-};
-const textVariantMap = {
-    small: "buttonSmall",
-    medium: "button",
-    large: "buttonLarge",
-};
-// ============================================================================
-// HELPER FUNCTIONS
-// ============================================================================
-function getLoadingColor(variant) {
-    return getLoadingColorDynamic(variant);
-}
-function getIconColor(variant, disabled) {
-    return getIconColorDynamic(variant, disabled);
-}
-function getIconSize(size) {
-    return iconSizeMap[size] ?? 20;
-}
-function getTextVariant(size) {
-    return textVariantMap[size] ?? "button";
-}
-const Button = ({ title, onPress, confirm, variant = "primary", size = "medium", loading = false, disabled = false, className, icon, }) => {
-    const { show, hide } = useConfirmationContext();
-    const textColorClass = textColor({
-        variant: variant ?? "primary",
-        disabled,
-    });
-    const loadingColorValue = getLoadingColor(variant ?? "primary");
-    const textVariantValue = getTextVariant(size ?? "medium");
-    const handlePress = useCallback(() => {
-        if (confirm && onPress) {
-            show({
-                title: "Confirmar acción",
-                message: confirm,
-                confirmText: "Confirmar",
-                cancelText: "Cancelar",
-                onConfirm: () => {
-                    hide();
-                    runOnJS(onPress)();
-                },
-                onCancel: () => hide(),
-            });
-        }
-        else if (onPress) {
-            runOnJS(onPress)();
-        }
-    }, [onPress, confirm, show, hide]);
-    if (variant === "link") {
-        return (_jsx(TouchableOpacity, { activeOpacity: 0.7, className: className, disabled: disabled || loading, onPress: handlePress, children: loading ? (_jsx(ActivityIndicator, { color: loadingColorValue, size: "small" })) : (_jsx(Typography.Text, { className: textColorClass, variant: textVariantValue, children: title })) }));
-    }
-    if (variant === "primary" || variant === "accent" || variant === "cta") {
-        const gradientColors = variant === "primary" ? theme.gradient.primary : theme.gradient.accent;
-        return (_jsx(LinearGradient, { colors: gradientColors, end: { x: 1, y: 1 }, start: { x: 0, y: 0 }, style: {
-                borderRadius: 13,
-                opacity: disabled ? 0.7 : 1,
-            }, children: _jsx(TouchableOpacity, { activeOpacity: 0.8, disabled: disabled || loading, onPress: handlePress, children: _jsx(View, { className: button({ size, disabled }), style: { backgroundColor: "transparent" }, children: loading ? (_jsx(ActivityIndicator, { color: loadingColorValue, size: "small" })) : (_jsxs(_Fragment, { children: [icon ? _jsx(View, { className: "mr-2", children: icon }) : null, _jsx(Typography.Text, { allowFontScaling: false, bold: true, className: textColorClass, ellipsizeMode: "tail", numberOfLines: 1, variant: textVariantValue, children: title })] })) }) }) }));
-    }
-    return (_jsx(TouchableOpacity, { activeOpacity: 0.8, className: button({ variant, size, disabled, className }), disabled: disabled || loading, onPress: handlePress, children: loading ? (_jsx(ActivityIndicator, { color: loadingColorValue, size: "small" })) : (_jsxs(_Fragment, { children: [icon ? _jsx(View, { className: "mr-2", children: icon }) : null, _jsx(Typography.Text, { allowFontScaling: false, bold: true, className: textColorClass, ellipsizeMode: "tail", numberOfLines: 1, variant: textVariantValue, children: title })] })) }));
-};
-const ButtonIcon = ({ icon, onPress, confirm, variant = "primary", size = "medium", loading = false, disabled = false, className, }) => {
-    const { show, hide } = useConfirmationContext();
-    const iconColorValue = getIconColor(variant ?? "primary", disabled);
-    const iconSizeValue = getIconSize(size ?? "medium");
-    const loadingColorValue = getLoadingColor(variant ?? "primary");
-    const handlePress = useCallback(() => {
-        if (confirm && onPress) {
-            show({
-                title: "Confirmar acción",
-                message: confirm,
-                confirmText: "Confirmar",
-                cancelText: "Cancelar",
-                onConfirm: () => {
-                    hide();
-                    runOnJS(onPress)();
-                },
-                onCancel: () => hide(),
-            });
-        }
-        else if (onPress) {
-            runOnJS(onPress)();
-        }
-    }, [onPress, confirm, show, hide]);
-    if (variant === "primary") {
-        return (_jsx(LinearGradient, { colors: theme.gradient.primary, end: { x: 1, y: 1 }, start: { x: 0, y: 0 }, style: {
-                borderRadius: 13,
-                opacity: disabled ? 0.7 : 1,
-            }, children: _jsx(TouchableOpacity, { activeOpacity: 0.8, disabled: disabled || loading, onPress: handlePress, children: _jsx(View, { className: buttonIcon({ size, disabled }), style: { backgroundColor: "transparent" }, children: loading ? (_jsx(ActivityIndicator, { color: loadingColorValue, size: "small" })) : (_jsx(Display.Icon, { color: iconColorValue, name: icon, size: iconSizeValue })) }) }) }));
-    }
-    return (_jsx(TouchableOpacity, { activeOpacity: 0.8, className: buttonIcon({ variant, size, disabled, className }), disabled: disabled || loading, onPress: handlePress, children: loading ? (_jsx(ActivityIndicator, { color: loadingColorValue, size: "small" })) : (_jsx(Display.Icon, { color: iconColorValue, name: icon, size: iconSizeValue })) }));
-};
-// ============================================================================
-// COMPOUND COMPONENT
-// ============================================================================
-const ButtonWithIcon = Object.assign(Button, { Icon: ButtonIcon });
-export default ButtonWithIcon;
+export { default as ButtonWithIcon, default, } from "../Actions/Actions.Button";

package/dist/Form/Form.FAB.d.ts

@@ -1,10 +1,3 @@
-export interface FABProps {
-    icon: string;
-    onPress: () => void;
-    label?: string;
-    position?: "bottom-right" | "bottom-left";
-    className?: string;
-    testID?: string;
-}
-declare function FAB({ icon, onPress, label, position, className, testID, }: FABProps): import("react").JSX.Element;
-export default FAB;
+/** @deprecated Use `Actions.FAB` from `@sincpro/mobile-ui/Actions` instead. */
+export type { FABProps } from "../Actions/Actions.FAB";
+export { default } from "../Actions/Actions.FAB";

package/dist/Form/Form.FAB.js

@@ -1,17 +1 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import Icon from "../Display/Display.Icon";
-import Pressable from "../primitives/Pressable";
-import { theme } from "../theme";
-import { cn } from "../theme/tw";
-import { Typography } from "../Typography";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-function FAB({ icon, onPress, label, position = "bottom-right", className, testID, }) {
-    const insets = useSafeAreaInsets();
-    return (_jsxs(Pressable, { accessibilityLabel: label ?? "Acción", accessibilityRole: "button", className: cn("absolute flex-row items-center justify-center rounded-full bg-primary", label ? "h-14 px-5 gap-2" : "w-14 h-14", className), onPress: onPress, style: {
-            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", children: label })) : null] }));
-}
-export default FAB;
+export { default } from "../Actions/Actions.FAB";

package/dist/Form/Form.FilterButton.d.ts

@@ -1,12 +1,3 @@
-import { FC } from "react";
-export interface FilterButtonProps {
-    title: string;
-    active: boolean;
-    onPress: () => void;
-}
-export declare const FilterButton: FC<FilterButtonProps>;
-interface FilterButtonGroupProps {
-    children: React.ReactNode;
-}
-export declare function FilterButtonGroup({ children }: FilterButtonGroupProps): import("react").JSX.Element;
-export {};
+/** @deprecated Use `Actions.FilterButton` from `@sincpro/mobile-ui/Actions` instead. */
+export type { FilterButtonProps } from "../Actions/Actions.FilterButton";
+export { FilterButton, FilterButtonGroup, } from "../Actions/Actions.FilterButton";

package/dist/Form/Form.FilterButton.js

@@ -1,34 +1 @@
-import { jsx as _jsx } from "nativewind/jsx-runtime";
-import { tv } from "../theme/tw";
-import { Typography } from "../Typography";
-import { TouchableOpacity, View } from "react-native";
-const filterButton = tv({
-    base: "rounded-lg items-center justify-center py-2 px-3 min-h-[36px]",
-    variants: {
-        active: {
-            true: "bg-primary border-0",
-            false: "bg-transparent border border-brand-primary",
-        },
-    },
-    defaultVariants: {
-        active: false,
-    },
-});
-const filterText = tv({
-    base: "font-bold",
-    variants: {
-        active: {
-            true: "text-white",
-            false: "text-primary",
-        },
-    },
-    defaultVariants: {
-        active: false,
-    },
-});
-export const FilterButton = ({ title, active, onPress }) => {
-    return (_jsx(TouchableOpacity, { activeOpacity: 0.8, className: filterButton({ active }), onPress: onPress, children: _jsx(Typography.Text, { className: filterText({ active }), variant: "buttonSmall", children: title }) }));
-};
-export function FilterButtonGroup({ children }) {
-    return _jsx(View, { className: "flex-row gap-2 p-3", children: children });
-}
+export { FilterButton, FilterButtonGroup, } from "../Actions/Actions.FilterButton";

package/dist/Form/Form.IconButton.d.ts

@@ -1,67 +1,3 @@
-import { type VariantProps } from "../theme/tw";
-import { IconType } from "../utils/icon";
-declare const iconButton: import("tailwind-variants").TVReturnType<{
-    variant: {
-        primary: string;
-        secondary: string;
-        tertiary: string;
-        ghost: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    rounded: {
-        true: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, "rounded-lg items-center justify-center", {
-    variant: {
-        primary: string;
-        secondary: string;
-        tertiary: string;
-        ghost: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    rounded: {
-        true: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    variant: {
-        primary: string;
-        secondary: string;
-        tertiary: string;
-        ghost: string;
-    };
-    size: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    rounded: {
-        true: string;
-    };
-    disabled: {
-        true: string;
-    };
-}, undefined, "rounded-lg items-center justify-center", unknown, unknown, undefined>>;
-interface IconButtonProps extends VariantProps<typeof iconButton> {
-    icon?: string;
-    type?: IconType;
-    onPress: () => void;
-    loading?: boolean;
-    iconColor?: string;
-    className?: string;
-}
-declare function IconButton({ icon, type, onPress, variant, size, loading, disabled, rounded, iconColor, className, }: IconButtonProps): import("react").JSX.Element;
-export default IconButton;
+/** @deprecated Use `Actions.IconButton` from `@sincpro/mobile-ui/Actions` instead. */
+export type { IconButtonProps } from "../Actions/Actions.IconButton";
+export { default } from "../Actions/Actions.IconButton";