@oxyhq/services 6.9.15 → 6.9.16

package/src/ui/components/payment/paymentStyles.js

@@ -1,399 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createPaymentStyles = void 0;
-const react_native_1 = require("react-native");
-const styles_1 = require("../../styles");
-const createPaymentStyles = (colors) => react_native_1.StyleSheet.create({
-    container: {
-        flex: 1,
-    },
-    content: {
-        flex: 1,
-        padding: 16,
-    },
-    stepContainer: {
-        justifyContent: 'flex-start',
-        alignItems: 'flex-start',
-        width: '100%',
-    },
-    section: {
-        marginBottom: 24,
-        width: '100%',
-    },
-    sectionTitle: {
-        fontSize: 16,
-        fontWeight: '600',
-        color: colors.text,
-        marginBottom: 12,
-        fontFamily: styles_1.fontFamilies.interSemiBold,
-    },
-    errorContainer: {
-        flex: 1,
-        justifyContent: 'center',
-        alignItems: 'center',
-        padding: 32,
-    },
-    errorText: {
-        fontSize: 18,
-        color: 'red',
-        marginBottom: 24,
-    },
-    // Summary card styles
-    summaryCard: {
-        backgroundColor: '#fff',
-        borderRadius: 16,
-        padding: 24,
-        marginBottom: 24,
-        alignItems: 'center',
-        width: '100%',
-    },
-    summaryCardContent: {
-        alignItems: 'center',
-        width: '100%',
-    },
-    summaryCardIcon: {
-        marginBottom: 8,
-    },
-    summaryCardMainTitle: {
-        fontFamily: styles_1.fontFamilies.interBold,
-        fontWeight: 'bold',
-        fontSize: 28,
-        color: colors.text,
-        marginBottom: 2,
-        textAlign: 'center',
-        letterSpacing: 0.5,
-    },
-    summaryCardSubtitle: {
-        fontSize: 16,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 24,
-        width: '100%',
-    },
-    summaryCardItems: {
-        width: '100%',
-        marginBottom: 16,
-    },
-    summaryItemPrice: {
-        color: colors.text,
-        fontWeight: '600',
-        fontSize: 16,
-    },
-    summaryCardAmount: {
-        alignItems: 'center',
-        width: '100%',
-        marginBottom: 16,
-    },
-    summaryCardAmountLabel: {
-        fontSize: 16,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 8,
-    },
-    summaryCardAmountValue: {
-        fontSize: 32,
-        fontWeight: 'bold',
-        color: colors.text,
-        textAlign: 'center',
-        marginBottom: 8,
-        fontFamily: styles_1.fontFamilies.interBold,
-    },
-    summaryCardAmountDescription: {
-        fontSize: 14,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        lineHeight: 20,
-    },
-    summaryCardDivider: {
-        height: 1,
-        backgroundColor: colors.border,
-        marginVertical: 16,
-        width: '100%',
-    },
-    summaryCardTotalSection: {
-        width: '100%',
-        marginBottom: 8,
-    },
-    summaryCardTotalRow: {
-        flexDirection: 'row',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        paddingVertical: 4,
-    },
-    summaryCardTotalLabel: {
-        fontSize: 16,
-        color: colors.secondaryText,
-        fontWeight: '500',
-    },
-    summaryCardTotalValue: {
-        fontSize: 16,
-        color: colors.text,
-        fontWeight: '600',
-    },
-    // Card payment styles
-    cardPaymentCard: {
-        backgroundColor: '#fff',
-        borderRadius: 16,
-        padding: 24,
-        marginBottom: 24,
-        alignItems: 'center',
-        width: '100%',
-    },
-    cardPaymentContent: {
-        alignItems: 'center',
-        width: '100%',
-    },
-    cardPaymentIcon: {
-        marginBottom: 8,
-    },
-    cardPaymentMainTitle: {
-        fontFamily: styles_1.fontFamilies.interBold,
-        fontWeight: 'bold',
-        fontSize: 28,
-        color: colors.text,
-        marginBottom: 2,
-        textAlign: 'center',
-        letterSpacing: 0.5,
-    },
-    cardPaymentSubtitle: {
-        fontSize: 16,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 24,
-        width: '100%',
-    },
-    cardPaymentFields: {
-        width: '100%',
-        marginBottom: 16,
-    },
-    cardPaymentWaiting: {
-        fontSize: 14,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 8,
-    },
-    cardRowInfo: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        marginBottom: 16,
-    },
-    cardRowIcon: {
-        marginRight: 8,
-    },
-    cardRowText: {
-        fontSize: 15,
-        color: colors.secondaryText,
-    },
-    cardFieldContainer: {
-        marginBottom: 16,
-    },
-    cardFieldRow: {
-        flexDirection: 'row',
-        gap: 12,
-    },
-    cardFieldHalfLeft: {
-        flex: 1,
-        marginRight: 6,
-    },
-    cardFieldHalfRight: {
-        flex: 1,
-        marginLeft: 6,
-    },
-    // Oxy Pay styles
-    oxyPayCard: {
-        backgroundColor: '#fff',
-        borderRadius: 16,
-        padding: 24,
-        marginBottom: 24,
-        alignItems: 'center',
-        width: '100%',
-    },
-    oxyPayContent: {
-        alignItems: 'center',
-        width: '100%',
-    },
-    oxyPayIcon: {
-        marginBottom: 8,
-    },
-    oxyPayMainTitle: {
-        fontFamily: styles_1.fontFamilies.interBold,
-        fontWeight: 'bold',
-        fontSize: 28,
-        color: colors.text,
-        marginBottom: 2,
-        textAlign: 'center',
-        letterSpacing: 0.5,
-    },
-    oxyPaySubtitle: {
-        fontSize: 16,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 8,
-    },
-    oxyPayBalanceBox: {
-        backgroundColor: `${colors.primary}22`,
-        borderRadius: 12,
-        padding: 8,
-        marginTop: 8,
-    },
-    oxyPayBalanceText: {
-        color: colors.primary,
-        fontWeight: '600',
-    },
-    oxyPayWaiting: {
-        fontSize: 14,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 8,
-    },
-    // FairCoin styles
-    faircoinCard: {
-        backgroundColor: '#fff',
-        borderRadius: 16,
-        padding: 24,
-        marginBottom: 24,
-        alignItems: 'center',
-        width: '100%',
-    },
-    faircoinContent: {
-        alignItems: 'center',
-        width: '100%',
-    },
-    faircoinIcon: {
-        marginBottom: 8,
-    },
-    faircoinMainTitle: {
-        fontFamily: styles_1.fontFamilies.interBold,
-        fontWeight: 'bold',
-        fontSize: 28,
-        color: '#1b1f0a',
-        marginBottom: 2,
-        textAlign: 'center',
-        letterSpacing: 0.5,
-    },
-    faircoinSubtitle: {
-        color: '#1b1f0a',
-        fontWeight: '700',
-        fontSize: 17,
-        marginBottom: 18,
-        textAlign: 'center',
-        letterSpacing: 0.2,
-    },
-    faircoinScanText: {
-        color: '#1b1f0a',
-        fontWeight: '600',
-        fontSize: 15,
-        marginBottom: 8,
-    },
-    faircoinQRCard: {
-        width: 200,
-        height: 200,
-        backgroundColor: '#fff',
-        borderRadius: 32,
-        justifyContent: 'center',
-        alignItems: 'center',
-        marginBottom: 16,
-        padding: 16,
-        borderWidth: 3,
-        borderColor: '#9ffb50',
-        shadowColor: '#9ffb50',
-        shadowOffset: { width: 0, height: 4 },
-        shadowOpacity: 0.25,
-        shadowRadius: 12,
-        elevation: 8,
-        position: 'relative',
-    },
-    faircoinQRBadge: {
-        position: 'absolute',
-        bottom: 12,
-        right: 12,
-        backgroundColor: '#fff',
-        borderRadius: 16,
-        padding: 4,
-        shadowColor: '#000',
-        shadowOffset: { width: 0, height: 2 },
-        shadowOpacity: 0.1,
-        shadowRadius: 4,
-        elevation: 2,
-    },
-    faircoinTitle: {
-        fontSize: 16,
-        marginBottom: 8,
-        color: colors.text,
-        fontWeight: '600',
-        textAlign: 'center',
-    },
-    faircoinAddress: {
-        color: colors.secondaryText,
-        fontSize: 13,
-        textAlign: 'center',
-        marginTop: 6,
-        marginBottom: 2,
-    },
-    faircoinButton: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        alignSelf: 'center',
-        backgroundColor: `${colors.primary}11`,
-        borderRadius: 16,
-        paddingHorizontal: 16,
-        paddingVertical: 8,
-        marginTop: 6,
-        marginBottom: 2,
-    },
-    faircoinButtonText: {
-        color: colors.primary,
-        fontWeight: '600',
-        fontSize: 15,
-    },
-    faircoinWaiting: {
-        fontSize: 14,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 8,
-    },
-    faircoinPlaceholder: {
-        fontSize: 13,
-        color: colors.secondaryText,
-        textAlign: 'center',
-    },
-    // Success styles
-    successCard: {
-        backgroundColor: '#fff',
-        borderRadius: 16,
-        padding: 24,
-        marginBottom: 24,
-        alignItems: 'center',
-        width: '100%',
-    },
-    successContent: {
-        alignItems: 'center',
-        width: '100%',
-    },
-    successIcon: {
-        marginBottom: 8,
-    },
-    successMainTitle: {
-        fontFamily: styles_1.fontFamilies.interBold,
-        fontWeight: 'bold',
-        fontSize: 28,
-        color: colors.success || '#4BB543',
-        marginBottom: 2,
-        textAlign: 'center',
-        letterSpacing: 0.5,
-    },
-    successSubtitle: {
-        fontSize: 16,
-        color: colors.text,
-        textAlign: 'center',
-        marginBottom: 8,
-        width: '100%',
-    },
-    successMessage: {
-        fontSize: 14,
-        color: colors.secondaryText,
-        textAlign: 'center',
-        marginBottom: 8,
-    },
-});
-exports.createPaymentStyles = createPaymentStyles;

package/src/ui/components/payment/types.d.ts

@@ -1,39 +0,0 @@
-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/src/ui/components/payment/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/src/ui/components/photogrid/JustifiedPhotoGrid.d.ts

@@ -1,26 +0,0 @@
-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/src/ui/components/photogrid/JustifiedPhotoGrid.js

@@ -1,122 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-/**
- * Responsive justified photo grid that stretches to the provided containerWidth.
- * Uses flex rows with proportional children widths instead of absolute pixel widths so it always fills.
- */
-const JustifiedPhotoGrid = ({ photos, photoDimensions, loadPhotoDimensions, createJustifiedRows, renderJustifiedPhotoItem, textColor, containerWidth: explicitWidth, gap = 4, minRowHeight = 100, maxRowHeight = 300, dateFormatLocale = 'en-US', }) => {
-    // Responsive width measurement if not explicitly provided
-    const [measuredWidth, setMeasuredWidth] = (0, react_1.useState)(null);
-    const effectiveWidth = explicitWidth ?? measuredWidth ?? 0; // 0 until measured
-    const onLayoutContainer = (0, react_1.useCallback)((e) => {
-        if (explicitWidth)
-            return; // ignore if controlled
-        const w = e.nativeEvent.layout.width;
-        setMeasuredWidth(prev => (prev === w ? prev : w));
-    }, [explicitWidth]);
-    // Ensure dimensions are loaded for displayed photos
-    (0, react_1.useEffect)(() => {
-        loadPhotoDimensions(photos);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [photos.map(p => p.id).join(',')]);
-    // Group photos by date first
-    const photosByDate = (0, react_1.useMemo)(() => {
-        return photos.reduce((groups, photo) => {
-            const date = new Date(photo.uploadDate).toDateString();
-            if (!groups[date])
-                groups[date] = [];
-            groups[date].push(photo);
-            return groups;
-        }, {});
-    }, [photos]);
-    const sortedDates = (0, react_1.useMemo)(() => Object.keys(photosByDate).sort((a, b) => new Date(b).getTime() - new Date(a).getTime()), [photosByDate]);
-    // Track measured width of each date section (may differ if parent applies horizontal padding/margins)
-    const [dateWidths, setDateWidths] = (0, react_1.useState)({});
-    const onLayoutDate = (0, react_1.useCallback)((date, width) => {
-        setDateWidths(prev => (prev[date] === width ? prev : { ...prev, [date]: width }));
-    }, []);
-    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: { width: '100%' }, onLayout: onLayoutContainer, children: effectiveWidth === 0 && !explicitWidth ? null : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: sortedDates.map((date) => {
-                const dayPhotos = photosByDate[date];
-                // createJustifiedRows should build rows such that the "ideal" height (availableWidth / totalAspect) stays within min/max.
-                // We pass the effective container width.
-                const dateWidth = dateWidths[date] ?? effectiveWidth; // fallback to overall width until measured
-                const rows = dateWidth > 0 ? createJustifiedRows(dayPhotos, dateWidth) : [];
-                return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: { marginBottom: 24, width: '100%' }, onLayout: e => onLayoutDate(date, e.nativeEvent.layout.width), children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: { fontSize: 14, fontWeight: '600', marginBottom: 12, color: textColor }, children: new Date(date).toLocaleDateString(dateFormatLocale, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }) }), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: { width: '100%' }, children: rows.map((row, rowIndex) => {
-                                // Compute total aspect ratios using loaded dimensions (fallback 4/3)
-                                const aspects = row.map(p => {
-                                    const dims = photoDimensions[p.id];
-                                    return dims ? dims.width / dims.height : 4 / 3;
-                                });
-                                const totalAspect = aspects.reduce((a, b) => a + b, 0);
-                                const gapsTotal = gap * (row.length - 1);
-                                const availableWidth = dateWidth - gapsTotal;
-                                // Ideal height that perfectly fills width when preserving aspect ratios
-                                const idealHeight = availableWidth / totalAspect;
-                                // We rely on row construction keeping idealHeight within min/max bounds; if not, clamp but then distribute leftover/overflow.
-                                let rowHeight = idealHeight;
-                                let widthAdjustment = 0; // difference to distribute if clamped
-                                if (idealHeight < minRowHeight) {
-                                    rowHeight = minRowHeight;
-                                    widthAdjustment = availableWidth - rowHeight * totalAspect; // negative means overflow
-                                }
-                                else if (idealHeight > maxRowHeight) {
-                                    rowHeight = maxRowHeight;
-                                    widthAdjustment = availableWidth - rowHeight * totalAspect;
-                                }
-                                // Pre-compute widths maintaining aspect ratios
-                                let widths = aspects.map(ar => ar * rowHeight);
-                                // If we have widthAdjustment (due to clamping) distribute proportionally so row still fills exactly
-                                if (widthAdjustment !== 0) {
-                                    const widthSum = widths.reduce((a, b) => a + b, 0);
-                                    widths = widths.map(w => w + (w / widthSum) * widthAdjustment);
-                                }
-                                // To combat rounding issues, adjust last item width to fill precisely
-                                const widthSumRounded = widths.reduce((a, b) => a + b, 0);
-                                const roundingDiff = availableWidth - widthSumRounded;
-                                if (Math.abs(roundingDiff) > 0.5) {
-                                    widths[widths.length - 1] += roundingDiff; // minimal correction
-                                }
-                                return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: { flexDirection: 'row', width: '100%', marginBottom: 4 }, children: row.map((p, i) => {
-                                        const photoWidth = widths[i];
-                                        return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: { width: photoWidth, height: rowHeight, marginRight: i === row.length - 1 ? 0 : gap }, children: renderJustifiedPhotoItem(p, photoWidth, rowHeight, i === row.length - 1) }, p.id));
-                                    }) }, rowIndex));
-                            }) })] }, date));
-            }) })) }));
-};
-exports.default = react_1.default.memo(JustifiedPhotoGrid);

package/src/ui/components/styles/overlay.d.ts

@@ -1,3 +0,0 @@
-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/src/ui/components/styles/overlay.js

@@ -1,81 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isAnimatedValue = void 0;
-exports.default = overlay;
-const react_native_1 = require("react-native");
-// Simple hex color manipulation without color package
-const hexToRgb = (hex) => {
-    const r = Number.parseInt(hex.slice(1, 3), 16);
-    const g = Number.parseInt(hex.slice(3, 5), 16);
-    const b = Number.parseInt(hex.slice(5, 7), 16);
-    return [r, g, b];
-};
-const rgbToHex = (r, g, b) => {
-    return `#${[r, g, b].map(x => {
-        const hex = Math.round(x).toString(16);
-        return hex.length === 1 ? `0${hex}` : hex;
-    }).join('')}`;
-};
-const mixColors = (color1, color2, ratio) => {
-    const [r1, g1, b1] = hexToRgb(color1);
-    const [r2, g2, b2] = hexToRgb(color2);
-    const r = r1 + (r2 - r1) * ratio;
-    const g = g1 + (g2 - g1) * ratio;
-    const b = b1 + (b2 - b1) * ratio;
-    return rgbToHex(r, g, b);
-};
-const isAnimatedValue = (it) => it instanceof react_native_1.Animated.Value;
-exports.isAnimatedValue = isAnimatedValue;
-function overlay(elevation, surfaceColor = '#121212') {
-    if ((0, exports.isAnimatedValue)(elevation)) {
-        const inputRange = [0, 1, 2, 3, 8, 24];
-        // @ts-expect-error: TS doesn't seem to refine the type correctly
-        return elevation.interpolate({
-            inputRange,
-            outputRange: inputRange.map((elevation) => {
-                return calculateColor(surfaceColor, elevation);
-            }),
-        });
-    }
-    // @ts-expect-error: TS doesn't seem to refine the type correctly
-    return calculateColor(surfaceColor, elevation);
-}
-function calculateColor(surfaceColor, elevation = 1) {
-    let overlayTransparency;
-    if (elevation >= 1 && elevation <= 24) {
-        overlayTransparency = elevationOverlayTransparency[elevation];
-    }
-    else if (elevation > 24) {
-        overlayTransparency = elevationOverlayTransparency[24];
-    }
-    else {
-        overlayTransparency = elevationOverlayTransparency[1];
-    }
-    return mixColors(surfaceColor, '#FFFFFF', overlayTransparency * 0.01);
-}
-const elevationOverlayTransparency = {
-    1: 5,
-    2: 7,
-    3: 8,
-    4: 9,
-    5: 10,
-    6: 11,
-    7: 11.5,
-    8: 12,
-    9: 12.5,
-    10: 13,
-    11: 13.5,
-    12: 14,
-    13: 14.25,
-    14: 14.5,
-    15: 14.75,
-    16: 15,
-    17: 15.12,
-    18: 15.24,
-    19: 15.36,
-    20: 15.48,
-    21: 15.6,
-    22: 15.72,
-    23: 15.84,
-    24: 16,
-};

package/src/ui/components/styles/shadow.d.ts

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