@oxyhq/services 6.9.13 → 6.9.15

package/lib/typescript/ui/components/icon/FAIRWalletIcon.d.ts

@@ -0,0 +1,8 @@
+import type React from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+interface FAIRWalletIconProps {
+    size?: number;
+    style?: StyleProp<ViewStyle>;
+}
+declare const FAIRWalletIcon: React.FC<FAIRWalletIconProps>;
+export default FAIRWalletIcon;

package/lib/typescript/ui/components/icon/OxyIcon.d.ts

@@ -0,0 +1,9 @@
+import type React from 'react';
+export interface IconProps {
+    name: string;
+    size?: number;
+    color?: string;
+    style?: Record<string, unknown>;
+}
+declare const OxyIcon: React.FC<IconProps>;
+export default OxyIcon;

package/lib/typescript/ui/components/icon/index.d.ts

@@ -0,0 +1,3 @@
+export { default as OxyIcon } from './OxyIcon';
+export { default as FAIRWalletIcon } from './FAIRWalletIcon';
+export type { IconProps } from './OxyIcon';

package/lib/typescript/ui/components/index.d.ts

@@ -0,0 +1,16 @@
+export { default as ProfileCard } from './ProfileCard';
+export { default as Section } from './Section';
+export { default as SectionTitle } from './SectionTitle';
+export { default as GroupedItem } from './GroupedItem';
+export { default as GroupedSection } from './GroupedSection';
+export { default as QuickActions } from './QuickActions';
+export { default as Header, getHeaderHeight } from './Header';
+export { default as LoadingState } from './LoadingState';
+export { default as EmptyState } from './EmptyState';
+export { default as SettingRow } from './SettingRow';
+export { default as Avatar } from './Avatar';
+export { default as FollowButton } from './FollowButton';
+export { FontLoader, setupFonts } from './FontLoader';
+export { default as OxyLogo } from './OxyLogo';
+export { default as OxySignInButton } from './OxySignInButton';
+export { default as OxyPayButton } from './OxyPayButton';

package/lib/typescript/ui/components/internal/GroupedPillButtons.d.ts

@@ -0,0 +1,23 @@
+import type React from 'react';
+interface ButtonConfig {
+    text: string;
+    onPress: () => void;
+    icon?: string;
+    variant?: 'primary' | 'secondary' | 'transparent';
+    disabled?: boolean;
+    loading?: boolean;
+    testID?: string;
+}
+interface GroupedPillButtonColors {
+    primary: string;
+    secondary?: string;
+    border: string;
+    text: string;
+}
+interface GroupedPillButtonsProps {
+    buttons: ButtonConfig[];
+    colors: GroupedPillButtonColors;
+    gap?: number;
+}
+declare const GroupedPillButtons: React.FC<GroupedPillButtonsProps>;
+export default GroupedPillButtons;

package/lib/typescript/ui/components/internal/PinInput.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+interface PinInputColors {
+    primary: string;
+    secondary?: string;
+    background: string;
+    inputBackground: string;
+    text: string;
+    border: string;
+}
+export interface PinInputProps {
+    value: string;
+    onChange: (val: string) => void;
+    length?: number;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    colors: PinInputColors;
+}
+export interface PinInputHandle {
+    focus: () => void;
+}
+declare const PinInput: React.ForwardRefExoticComponent<PinInputProps & React.RefAttributes<PinInputHandle>>;
+export default PinInput;

package/lib/typescript/ui/components/modals/DeleteAccountModal.d.ts

@@ -0,0 +1,18 @@
+import type React from 'react';
+interface DeleteAccountModalProps {
+    visible: boolean;
+    username: string;
+    onClose: () => void;
+    onDelete: (password: string) => Promise<void>;
+    colors: {
+        background: string;
+        text: string;
+        secondaryText: string;
+        border: string;
+        danger: string;
+        inputBackground: string;
+    };
+    t: (key: string, params?: Record<string, string>) => string | undefined;
+}
+declare const DeleteAccountModal: React.FC<DeleteAccountModalProps>;
+export default DeleteAccountModal;

package/lib/typescript/ui/components/modals/index.d.ts

@@ -0,0 +1 @@
+export { default as DeleteAccountModal } from './DeleteAccountModal';

package/lib/typescript/ui/components/payment/PaymentDetailsStep.d.ts

@@ -0,0 +1,20 @@
+import type React from 'react';
+import type { CardDetails, PaymentColors, PaymentStepAnimations } from './types';
+interface PaymentDetailsStepProps {
+    paymentMethod: string;
+    cardDetails: CardDetails;
+    onCardDetailsChange: (details: CardDetails) => void;
+    colors: PaymentColors;
+    animations: PaymentStepAnimations;
+    faircoinAddress: string;
+    isMobile: boolean;
+    qrSize: number;
+    onBack: () => void;
+    onNext: () => void;
+    QRCodeComponent?: React.ComponentType<{
+        value?: string;
+        size?: number;
+    }>;
+}
+declare const PaymentDetailsStep: React.FC<PaymentDetailsStepProps>;
+export default PaymentDetailsStep;

package/lib/typescript/ui/components/payment/PaymentMethodStep.d.ts

@@ -0,0 +1,13 @@
+import type React from 'react';
+import type { PaymentMethod, PaymentColors, PaymentStepAnimations } from './types';
+interface PaymentMethodStepProps {
+    availablePaymentMethods: PaymentMethod[];
+    selectedMethod: string;
+    onSelectMethod: (method: string) => void;
+    colors: PaymentColors;
+    animations: PaymentStepAnimations;
+    onBack: () => void;
+    onNext: () => void;
+}
+declare const PaymentMethodStep: React.FC<PaymentMethodStepProps>;
+export default PaymentMethodStep;

package/lib/typescript/ui/components/payment/PaymentReviewStep.d.ts

@@ -0,0 +1,15 @@
+import type React from 'react';
+import type { CardDetails, PaymentColors, PaymentStepAnimations } from './types';
+interface PaymentReviewStepProps {
+    amount: string | number;
+    currency: string;
+    paymentMethod: string;
+    cardDetails: CardDetails;
+    colors: PaymentColors;
+    animations: PaymentStepAnimations;
+    isPaying: boolean;
+    onBack: () => void;
+    onPay: () => void;
+}
+declare const PaymentReviewStep: React.FC<PaymentReviewStepProps>;
+export default PaymentReviewStep;

package/lib/typescript/ui/components/payment/PaymentSuccessStep.d.ts

@@ -0,0 +1,9 @@
+import type React from 'react';
+import type { PaymentColors, PaymentStepAnimations } from './types';
+interface PaymentSuccessStepProps {
+    colors: PaymentColors;
+    animations: PaymentStepAnimations;
+    onDone: () => void;
+}
+declare const PaymentSuccessStep: React.FC<PaymentSuccessStepProps>;
+export default PaymentSuccessStep;

package/lib/typescript/ui/components/payment/PaymentSummaryStep.d.ts

@@ -0,0 +1,14 @@
+import type React from 'react';
+import type { PaymentItem, PaymentColors, PaymentStepAnimations } from './types';
+interface PaymentSummaryStepProps {
+    paymentItems: PaymentItem[];
+    amount: string | number;
+    currency: string;
+    description?: string;
+    colors: PaymentColors;
+    animations: PaymentStepAnimations;
+    onClose: () => void;
+    onNext: () => void;
+}
+declare const PaymentSummaryStep: React.FC<PaymentSummaryStepProps>;
+export default PaymentSummaryStep;

package/lib/typescript/ui/components/payment/constants.d.ts

@@ -0,0 +1,6 @@
+import type { PaymentMethod } from './types';
+export declare const PAYMENT_METHODS: PaymentMethod[];
+export declare const CURRENCY_SYMBOLS: Record<string, string>;
+export declare const CURRENCY_NAMES: Record<string, string>;
+export declare const getCurrencySymbol: (currency: string) => string;
+export declare const getCurrencyName: (currency: string) => string;

package/lib/typescript/ui/components/payment/index.d.ts

@@ -0,0 +1,8 @@
+export { default as PaymentSummaryStep } from './PaymentSummaryStep';
+export { default as PaymentMethodStep } from './PaymentMethodStep';
+export { default as PaymentDetailsStep } from './PaymentDetailsStep';
+export { default as PaymentReviewStep } from './PaymentReviewStep';
+export { default as PaymentSuccessStep } from './PaymentSuccessStep';
+export { createPaymentStyles } from './paymentStyles';
+export { PAYMENT_METHODS, CURRENCY_SYMBOLS, CURRENCY_NAMES, getCurrencySymbol, getCurrencyName } from './constants';
+export type { PaymentItem, PaymentGatewayResult, CardDetails, PaymentMethod, PaymentStepAnimations, PaymentColors } from './types';

package/lib/typescript/ui/components/payment/paymentStyles.d.ts

@@ -0,0 +1,395 @@
+import type { PaymentColors } from './types';
+export declare const createPaymentStyles: (colors: PaymentColors) => {
+    container: {
+        flex: number;
+    };
+    content: {
+        flex: number;
+        padding: number;
+    };
+    stepContainer: {
+        justifyContent: "flex-start";
+        alignItems: "flex-start";
+        width: "100%";
+    };
+    section: {
+        marginBottom: number;
+        width: "100%";
+    };
+    sectionTitle: {
+        fontSize: number;
+        fontWeight: "600";
+        color: string;
+        marginBottom: number;
+        fontFamily: string;
+    };
+    errorContainer: {
+        flex: number;
+        justifyContent: "center";
+        alignItems: "center";
+        padding: number;
+    };
+    errorText: {
+        fontSize: number;
+        color: string;
+        marginBottom: number;
+    };
+    summaryCard: {
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        marginBottom: number;
+        alignItems: "center";
+        width: "100%";
+    };
+    summaryCardContent: {
+        alignItems: "center";
+        width: "100%";
+    };
+    summaryCardIcon: {
+        marginBottom: number;
+    };
+    summaryCardMainTitle: {
+        fontFamily: string;
+        fontWeight: "bold";
+        fontSize: number;
+        color: string;
+        marginBottom: number;
+        textAlign: "center";
+        letterSpacing: number;
+    };
+    summaryCardSubtitle: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+        width: "100%";
+    };
+    summaryCardItems: {
+        width: "100%";
+        marginBottom: number;
+    };
+    summaryItemPrice: {
+        color: string;
+        fontWeight: "600";
+        fontSize: number;
+    };
+    summaryCardAmount: {
+        alignItems: "center";
+        width: "100%";
+        marginBottom: number;
+    };
+    summaryCardAmountLabel: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+    };
+    summaryCardAmountValue: {
+        fontSize: number;
+        fontWeight: "bold";
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+        fontFamily: string;
+    };
+    summaryCardAmountDescription: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        lineHeight: number;
+    };
+    summaryCardDivider: {
+        height: number;
+        backgroundColor: string;
+        marginVertical: number;
+        width: "100%";
+    };
+    summaryCardTotalSection: {
+        width: "100%";
+        marginBottom: number;
+    };
+    summaryCardTotalRow: {
+        flexDirection: "row";
+        justifyContent: "space-between";
+        alignItems: "center";
+        paddingVertical: number;
+    };
+    summaryCardTotalLabel: {
+        fontSize: number;
+        color: string;
+        fontWeight: "500";
+    };
+    summaryCardTotalValue: {
+        fontSize: number;
+        color: string;
+        fontWeight: "600";
+    };
+    cardPaymentCard: {
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        marginBottom: number;
+        alignItems: "center";
+        width: "100%";
+    };
+    cardPaymentContent: {
+        alignItems: "center";
+        width: "100%";
+    };
+    cardPaymentIcon: {
+        marginBottom: number;
+    };
+    cardPaymentMainTitle: {
+        fontFamily: string;
+        fontWeight: "bold";
+        fontSize: number;
+        color: string;
+        marginBottom: number;
+        textAlign: "center";
+        letterSpacing: number;
+    };
+    cardPaymentSubtitle: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+        width: "100%";
+    };
+    cardPaymentFields: {
+        width: "100%";
+        marginBottom: number;
+    };
+    cardPaymentWaiting: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+    };
+    cardRowInfo: {
+        flexDirection: "row";
+        alignItems: "center";
+        marginBottom: number;
+    };
+    cardRowIcon: {
+        marginRight: number;
+    };
+    cardRowText: {
+        fontSize: number;
+        color: string;
+    };
+    cardFieldContainer: {
+        marginBottom: number;
+    };
+    cardFieldRow: {
+        flexDirection: "row";
+        gap: number;
+    };
+    cardFieldHalfLeft: {
+        flex: number;
+        marginRight: number;
+    };
+    cardFieldHalfRight: {
+        flex: number;
+        marginLeft: number;
+    };
+    oxyPayCard: {
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        marginBottom: number;
+        alignItems: "center";
+        width: "100%";
+    };
+    oxyPayContent: {
+        alignItems: "center";
+        width: "100%";
+    };
+    oxyPayIcon: {
+        marginBottom: number;
+    };
+    oxyPayMainTitle: {
+        fontFamily: string;
+        fontWeight: "bold";
+        fontSize: number;
+        color: string;
+        marginBottom: number;
+        textAlign: "center";
+        letterSpacing: number;
+    };
+    oxyPaySubtitle: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+    };
+    oxyPayBalanceBox: {
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        marginTop: number;
+    };
+    oxyPayBalanceText: {
+        color: string;
+        fontWeight: "600";
+    };
+    oxyPayWaiting: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+    };
+    faircoinCard: {
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        marginBottom: number;
+        alignItems: "center";
+        width: "100%";
+    };
+    faircoinContent: {
+        alignItems: "center";
+        width: "100%";
+    };
+    faircoinIcon: {
+        marginBottom: number;
+    };
+    faircoinMainTitle: {
+        fontFamily: string;
+        fontWeight: "bold";
+        fontSize: number;
+        color: string;
+        marginBottom: number;
+        textAlign: "center";
+        letterSpacing: number;
+    };
+    faircoinSubtitle: {
+        color: string;
+        fontWeight: "700";
+        fontSize: number;
+        marginBottom: number;
+        textAlign: "center";
+        letterSpacing: number;
+    };
+    faircoinScanText: {
+        color: string;
+        fontWeight: "600";
+        fontSize: number;
+        marginBottom: number;
+    };
+    faircoinQRCard: {
+        width: number;
+        height: number;
+        backgroundColor: string;
+        borderRadius: number;
+        justifyContent: "center";
+        alignItems: "center";
+        marginBottom: number;
+        padding: number;
+        borderWidth: number;
+        borderColor: string;
+        shadowColor: string;
+        shadowOffset: {
+            width: number;
+            height: number;
+        };
+        shadowOpacity: number;
+        shadowRadius: number;
+        elevation: number;
+        position: "relative";
+    };
+    faircoinQRBadge: {
+        position: "absolute";
+        bottom: number;
+        right: number;
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        shadowColor: string;
+        shadowOffset: {
+            width: number;
+            height: number;
+        };
+        shadowOpacity: number;
+        shadowRadius: number;
+        elevation: number;
+    };
+    faircoinTitle: {
+        fontSize: number;
+        marginBottom: number;
+        color: string;
+        fontWeight: "600";
+        textAlign: "center";
+    };
+    faircoinAddress: {
+        color: string;
+        fontSize: number;
+        textAlign: "center";
+        marginTop: number;
+        marginBottom: number;
+    };
+    faircoinButton: {
+        flexDirection: "row";
+        alignItems: "center";
+        alignSelf: "center";
+        backgroundColor: string;
+        borderRadius: number;
+        paddingHorizontal: number;
+        paddingVertical: number;
+        marginTop: number;
+        marginBottom: number;
+    };
+    faircoinButtonText: {
+        color: string;
+        fontWeight: "600";
+        fontSize: number;
+    };
+    faircoinWaiting: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+    };
+    faircoinPlaceholder: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+    };
+    successCard: {
+        backgroundColor: string;
+        borderRadius: number;
+        padding: number;
+        marginBottom: number;
+        alignItems: "center";
+        width: "100%";
+    };
+    successContent: {
+        alignItems: "center";
+        width: "100%";
+    };
+    successIcon: {
+        marginBottom: number;
+    };
+    successMainTitle: {
+        fontFamily: string;
+        fontWeight: "bold";
+        fontSize: number;
+        color: string;
+        marginBottom: number;
+        textAlign: "center";
+        letterSpacing: number;
+    };
+    successSubtitle: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+        width: "100%";
+    };
+    successMessage: {
+        fontSize: number;
+        color: string;
+        textAlign: "center";
+        marginBottom: number;
+    };
+};

package/lib/typescript/ui/components/payment/types.d.ts

@@ -0,0 +1,39 @@
+import type { Animated } from 'react-native';
+export type PaymentItem = {
+    type: 'product' | 'subscription' | 'service' | 'fee' | string;
+    name: string;
+    description?: string;
+    quantity?: number;
+    period?: string;
+    price: number;
+    currency?: string;
+};
+export interface PaymentGatewayResult {
+    success: boolean;
+    details?: Record<string, string | number | boolean | null>;
+    error?: string;
+}
+export interface CardDetails {
+    number: string;
+    expiry: string;
+    cvv: string;
+}
+export interface PaymentMethod {
+    key: string;
+    label: string;
+    icon: string;
+    description: string;
+}
+export interface PaymentStepAnimations {
+    fadeAnim: Animated.Value;
+    slideAnim: Animated.Value;
+    scaleAnim: Animated.Value;
+}
+export interface PaymentColors {
+    primary: string;
+    text: string;
+    secondaryText: string;
+    border: string;
+    success?: string;
+    background?: string;
+}

package/lib/typescript/ui/components/photogrid/JustifiedPhotoGrid.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { FileMetadata } from '@oxyhq/core';
+export interface JustifiedPhotoGridProps {
+    photos: FileMetadata[];
+    photoDimensions: {
+        [key: string]: {
+            width: number;
+            height: number;
+        };
+    };
+    loadPhotoDimensions: (photos: FileMetadata[]) => Promise<void>;
+    createJustifiedRows: (photos: FileMetadata[], containerWidth: number) => FileMetadata[][];
+    renderJustifiedPhotoItem: (photo: FileMetadata, width: number, height: number, isLast: boolean) => React.ReactElement;
+    renderSimplePhotoItem: (photo: FileMetadata, index: number) => React.ReactElement;
+    textColor: string;
+    /**
+     * Full available width from parent. If omitted, component will measure itself and adapt responsively.
+     */
+    containerWidth?: number;
+    gap?: number;
+    minRowHeight?: number;
+    maxRowHeight?: number;
+    dateFormatLocale?: string;
+}
+declare const _default: React.NamedExoticComponent<JustifiedPhotoGridProps>;
+export default _default;

package/lib/typescript/ui/components/styles/overlay.d.ts

@@ -0,0 +1,3 @@
+import { Animated } from 'react-native';
+export declare const isAnimatedValue: (it: number | string | Animated.AnimatedInterpolation<number | string>) => it is Animated.Value;
+export default function overlay<T extends Animated.Value | number>(elevation: T, surfaceColor?: string): T extends number ? string : Animated.AnimatedInterpolation<number | string>;

package/lib/typescript/ui/components/styles/shadow.d.ts

@@ -0,0 +1,2 @@
+import { Animated, type ShadowStyleIOS, type ViewStyle } from 'react-native';
+export default function shadow(elevation?: number | Animated.Value, isV3?: boolean): ViewStyle | ShadowStyleIOS;

package/lib/typescript/ui/components/theming.d.ts

@@ -0,0 +1,7 @@
+import type { InternalTheme } from './types';
+/**
+ * Adapter to convert services theming to react-native-paper's InternalTheme format
+ */
+export declare const useInternalTheme: (themeOverrides?: (Partial<InternalTheme> & {
+    dark?: boolean;
+}) | "light" | "dark") => InternalTheme;