@oxyhq/services 6.9.13 → 6.9.15

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

@@ -0,0 +1,64 @@
+import type React from 'react';
+import { type ViewStyle, type TextStyle, type StyleProp } from 'react-native';
+export interface OxySignInButtonProps {
+    /**
+     * Controls the appearance of the button
+     * @default 'default'
+     */
+    variant?: 'default' | 'outline' | 'contained';
+    /**
+     * Optional function to handle button press
+     * If not provided, the button will use the showBottomSheet method from OxyContext
+     */
+    onPress?: () => void;
+    /**
+     * Additional styles for the button container
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Additional styles for the button text
+     */
+    textStyle?: StyleProp<TextStyle>;
+    /**
+     * Custom button text
+     * @default 'Sign in with Oxy'
+     */
+    text?: string;
+    /**
+     * Whether to disable the button
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Whether to show the button even if user is already authenticated
+     * @default false
+     */
+    showWhenAuthenticated?: boolean;
+}
+/**
+ * A pre-styled button component for signing in with Oxy identity
+ *
+ * This component opens the Oxy Auth flow which allows users to authenticate
+ * using their Oxy Accounts identity (via QR code or deep link).
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <OxySignInButton />
+ *
+ * // Custom styling
+ * <OxySignInButton
+ *   variant="contained"
+ *   style={{ marginTop: 20 }}
+ *   text="Login with Oxy"
+ * />
+ *
+ * // Custom handler
+ * <OxySignInButton onPress={() => {
+ *   // Custom authentication flow
+ *   console.log('Custom auth flow initiated');
+ * }} />
+ * ```
+ */
+export declare const OxySignInButton: React.FC<OxySignInButtonProps>;
+export default OxySignInButton;

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

@@ -0,0 +1,17 @@
+import type React from 'react';
+interface ProfileCardProps {
+    user: {
+        username: string;
+        email?: string;
+        name?: {
+            full?: string;
+        };
+        avatar?: string;
+    };
+    theme: 'light' | 'dark';
+    onEditPress?: () => void;
+    onClosePress?: () => void;
+    showCloseButton?: boolean;
+}
+declare const ProfileCard: React.FC<ProfileCardProps>;
+export default ProfileCard;

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

@@ -0,0 +1,14 @@
+import type React from 'react';
+interface QuickAction {
+    id: string;
+    icon: string;
+    iconColor: string;
+    title: string;
+    onPress: () => void;
+}
+interface QuickActionsProps {
+    actions: QuickAction[];
+    theme: 'light' | 'dark';
+}
+declare const QuickActions: React.FC<QuickActionsProps>;
+export default QuickActions;

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

@@ -0,0 +1,11 @@
+import type React from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+interface SectionProps {
+    title?: string;
+    theme?: 'light' | 'dark';
+    children: React.ReactNode;
+    isFirst?: boolean;
+    style?: StyleProp<ViewStyle>;
+}
+declare const Section: React.FC<SectionProps>;
+export default Section;

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

@@ -0,0 +1,9 @@
+import type React from 'react';
+import { type StyleProp, type TextStyle } from 'react-native';
+interface SectionTitleProps {
+    title: string;
+    theme?: 'light' | 'dark';
+    style?: StyleProp<TextStyle>;
+}
+declare const SectionTitle: React.FC<SectionTitleProps>;
+export default SectionTitle;

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

@@ -0,0 +1,19 @@
+import React from 'react';
+export interface SettingRowProps {
+    title: string;
+    description?: string;
+    value: boolean;
+    onValueChange: (value: boolean) => void;
+    disabled?: boolean;
+    textColor?: string;
+    mutedTextColor?: string;
+    borderColor?: string;
+    /** Active color for the switch track (default: #d169e5) */
+    activeColor?: string;
+    /** Inactive color for the switch track (default: #767577) */
+    inactiveColor?: string;
+    /** Accessibility label for the switch */
+    accessibilityLabel?: string;
+}
+declare const _default: React.NamedExoticComponent<SettingRowProps>;
+export default _default;

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

@@ -0,0 +1,17 @@
+/**
+ * SignInModal - Full screen sign-in modal with QR code
+ *
+ * A semi-transparent full-screen modal that displays:
+ * - QR code for scanning with Oxy Accounts app
+ * - Button to open Oxy Auth popup
+ *
+ * Animates with fade-in effect.
+ */
+import type React from 'react';
+export declare const showSignInModal: () => void;
+export declare const hideSignInModal: () => void;
+export declare const isSignInModalVisible: () => boolean;
+/** Subscribe to modal visibility changes */
+export declare const subscribeToSignInModal: (listener: (visible: boolean) => void) => (() => void);
+declare const SignInModal: React.FC;
+export default SignInModal;

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

@@ -0,0 +1,25 @@
+import type React from 'react';
+import type { BaseScreenProps } from '../types/navigation';
+import type { RouteName } from '../types/navigation';
+export interface StepConfig {
+    id: string;
+    component: React.ComponentType<any>;
+    props?: Record<string, unknown>;
+    canProceed?: (stepData?: unknown) => boolean;
+    onEnter?: () => void;
+    onExit?: () => void;
+}
+export interface StepBasedScreenProps extends Omit<BaseScreenProps, 'navigate'> {
+    steps: StepConfig[];
+    initialStep?: number;
+    showProgressIndicator?: boolean;
+    enableAnimations?: boolean;
+    onStepChange?: (currentStep: number, totalSteps: number) => void;
+    onComplete?: (stepData: unknown[]) => void;
+    stepData?: unknown[];
+    navigate: (screen: RouteName, props?: Record<string, unknown>) => void;
+    oxyServices: any;
+    getNavigationProps?: () => Record<string, unknown>;
+}
+declare const StepBasedScreen: React.FC<StepBasedScreenProps>;
+export default StepBasedScreen;

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

@@ -0,0 +1,75 @@
+import * as React from 'react';
+import { Animated, type StyleProp, type View, type ViewStyle } from 'react-native';
+import type { ThemeProp } from './types';
+type Elevation = 0 | 1 | 2 | 3 | 4 | 5 | Animated.Value;
+export type Props = Omit<React.ComponentPropsWithRef<typeof View>, 'style'> & {
+    /**
+     * Content of the `Surface`.
+     */
+    children: React.ReactNode;
+    style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
+    /**
+     * @supported Available in v5.x with theme version 3
+     * Changes shadows and background on iOS and Android.
+     * Used to create UI hierarchy between components.
+     *
+     * Note: If `mode` is set to `flat`, Surface doesn't have a shadow.
+     *
+     * Note: In version 2 the `elevation` prop was accepted via `style` prop i.e. `style={{ elevation: 4 }}`.
+     * It's no longer supported with theme version 3 and you should use `elevation` property instead.
+     */
+    elevation?: Elevation;
+    /**
+     * @supported Available in v5.x with theme version 3
+     * Mode of the Surface.
+     * - `elevated` - Surface with a shadow and background color corresponding to set `elevation` value.
+     * - `flat` - Surface without a shadow, with the background color corresponding to set `elevation` value.
+     */
+    mode?: 'flat' | 'elevated';
+    /**
+     * @optional
+     */
+    theme?: ThemeProp;
+    /**
+     * TestID used for testing purposes
+     */
+    testID?: string;
+    ref?: React.RefObject<View>;
+    /**
+     * @internal
+     */
+    container?: boolean;
+};
+/**
+ * Surface is a basic container that can give depth to an element with elevation shadow.
+ * On dark theme with `adaptive` mode, surface is constructed by also placing a semi-transparent white overlay over a component surface.
+ * See [Dark Theme](https://callstack.github.io/react-native-paper/docs/guides/theming#dark-theme) for more information.
+ * Overlay and shadow can be applied by specifying the `elevation` property both on Android and iOS.
+ *
+ * ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { Surface, Text } from 'react-native-paper';
+ * import { StyleSheet } from 'react-native';
+ *
+ * const MyComponent = () => (
+ *   <Surface style={styles.surface} elevation={4}>
+ *      <Text>Surface</Text>
+ *   </Surface>
+ * );
+ *
+ * export default MyComponent;
+ *
+ * const styles = StyleSheet.create({
+ *   surface: {
+ *     padding: 8,
+ *     height: 80,
+ *     width: 80,
+ *     alignItems: 'center',
+ *     justifyContent: 'center',
+ *   },
+ * });
+ * ```
+ */
+declare const Surface: import("./utils/forwardRef").ForwardRefComponent<View, Props>;
+export default Surface;

package/lib/typescript/ui/components/TextField/Addons/Outline.d.ts

@@ -0,0 +1,15 @@
+import { type ColorValue, type StyleProp, type ViewStyle } from 'react-native';
+import type { TextInputLabelProp } from '../types';
+type OutlineProps = {
+    isV3: boolean;
+    activeColor: string;
+    backgroundColor: ColorValue;
+    hasActiveOutline?: boolean;
+    focused?: boolean;
+    outlineColor?: string;
+    roundness?: number;
+    label?: TextInputLabelProp;
+    style?: StyleProp<ViewStyle>;
+};
+export declare const Outline: ({ isV3, label, activeColor, backgroundColor, hasActiveOutline, focused, outlineColor, roundness, style, }: OutlineProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/typescript/ui/components/TextField/Addons/Underline.d.ts

@@ -0,0 +1,18 @@
+import { type StyleProp, type ViewStyle } from 'react-native';
+import type { ThemeProp } from '../../types';
+type UnderlineProps = {
+    parentState: {
+        focused: boolean;
+    };
+    error?: boolean;
+    colors?: {
+        error?: string;
+    };
+    activeColor: string;
+    underlineColorCustom?: string;
+    hasActiveOutline?: boolean;
+    style?: StyleProp<ViewStyle>;
+    theme?: ThemeProp;
+};
+export declare const Underline: ({ parentState, error, colors, activeColor, underlineColorCustom, hasActiveOutline, style, theme: themeOverrides, }: UnderlineProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/typescript/ui/components/TextField/Adornment/TextFieldAdornment.d.ts

@@ -0,0 +1,44 @@
+import React from 'react';
+import type { LayoutChangeEvent, TextStyle, StyleProp, Animated, DimensionValue } from 'react-native';
+import type { ThemeProp } from '../../types';
+import { AdornmentSide, AdornmentType } from './enums';
+import type { AdornmentConfig, AdornmentStyleAdjustmentForNativeInput } from './types';
+export declare function getAdornmentConfig({ left, right, }: {
+    left?: React.ReactNode;
+    right?: React.ReactNode;
+}): Array<AdornmentConfig>;
+export declare function getAdornmentStyleAdjustmentForNativeInput({ adornmentConfig, leftAffixWidth, rightAffixWidth, paddingHorizontal, inputOffset, mode, isV3, }: {
+    inputOffset?: number;
+    adornmentConfig: AdornmentConfig[];
+    leftAffixWidth: number;
+    rightAffixWidth: number;
+    mode?: 'outlined' | 'flat';
+    paddingHorizontal?: DimensionValue;
+    isV3?: boolean;
+}): AdornmentStyleAdjustmentForNativeInput | {};
+export interface TextFieldAdornmentProps {
+    forceFocus: () => void;
+    adornmentConfig: AdornmentConfig[];
+    topPosition: {
+        [AdornmentType.Affix]: {
+            [AdornmentSide.Left]: number | null;
+            [AdornmentSide.Right]: number | null;
+        };
+        [AdornmentType.Icon]: number;
+    };
+    onAffixChange: {
+        [AdornmentSide.Left]: (event: LayoutChangeEvent) => void;
+        [AdornmentSide.Right]: (event: LayoutChangeEvent) => void;
+    };
+    left?: React.ReactNode;
+    right?: React.ReactNode;
+    textStyle?: StyleProp<TextStyle>;
+    visible?: Animated.Value;
+    isTextInputFocused: boolean;
+    paddingHorizontal?: DimensionValue;
+    maxFontSizeMultiplier?: number | undefined | null;
+    theme?: ThemeProp;
+    disabled?: boolean;
+}
+declare const TextFieldAdornment: React.FunctionComponent<TextFieldAdornmentProps>;
+export default TextFieldAdornment;

package/lib/typescript/ui/components/TextField/Adornment/TextFieldAffix.d.ts

@@ -0,0 +1,72 @@
+import React from 'react';
+import { Animated, type DimensionValue, type GestureResponderEvent, type LayoutChangeEvent, type StyleProp, type TextStyle } from 'react-native';
+import { AdornmentSide } from './enums';
+import type { ThemeProp } from "../../types";
+export type Props = {
+    /**
+     * Text to show.
+     */
+    text: string;
+    onLayout?: (event: LayoutChangeEvent) => void;
+    /**
+     * Function to execute on press.
+     */
+    onPress?: (e: GestureResponderEvent) => void;
+    /**
+     * Accessibility label for the affix. This is read by the screen reader when the user taps the affix.
+     */
+    accessibilityLabel?: string;
+    /**
+     * Style that is passed to the Text element.
+     */
+    textStyle?: StyleProp<TextStyle>;
+    /**
+     * @optional
+     */
+    theme?: ThemeProp;
+};
+type ContextState = {
+    topPosition: number | null;
+    onLayout?: (event: LayoutChangeEvent) => void;
+    visible?: Animated.Value;
+    textStyle?: StyleProp<TextStyle>;
+    side: AdornmentSide;
+    paddingHorizontal?: DimensionValue;
+    maxFontSizeMultiplier?: number | undefined | null;
+    testID?: string;
+    disabled?: boolean;
+};
+declare const AffixAdornment: React.FunctionComponent<{
+    affix: React.ReactNode;
+    testID: string;
+} & ContextState>;
+/**
+ * A component to render a leading / trailing text in the TextInput
+ *
+ * ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { TextInput } from 'react-native-paper';
+ *
+ * const MyComponent = () => {
+ *   const [text, setText] = React.useState('');
+ *
+ *   return (
+ *     <TextInput
+ *       mode="outlined"
+ *       label="Outlined input"
+ *       placeholder="Type something"
+ *       right={<TextInput.Affix text="/100" />}
+ *     />
+ *   );
+ * };
+ *
+ * export default MyComponent;
+ * ```
+ */
+declare const TextFieldAffix: {
+    ({ text, textStyle: labelStyle, theme: themeOverrides, onLayout: onTextLayout, onPress, accessibilityLabel, }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default TextFieldAffix;
+export { TextFieldAffix, AffixAdornment };

package/lib/typescript/ui/components/TextField/Adornment/TextFieldIcon.d.ts

@@ -0,0 +1,77 @@
+import React from 'react';
+import { type ColorValue, type GestureResponderEvent, type StyleProp, type ViewStyle } from 'react-native';
+import type { $Omit, ThemeProp } from "../../types";
+import type { IconSource } from '../../Icon';
+import IconButton from '../../IconButton/IconButton';
+export type Props = $Omit<React.ComponentProps<typeof IconButton>, 'icon' | 'theme' | 'color' | 'iconColor'> & {
+    /**
+     * @renamed Renamed from 'name' to 'icon` in v5.x
+     * Icon to show.
+     */
+    icon: IconSource;
+    /**
+     * Function to execute on press.
+     */
+    onPress?: (e: GestureResponderEvent) => void;
+    /**
+     * Whether the TextInput will focus after onPress.
+     */
+    forceTextInputFocus?: boolean;
+    /**
+     * Color of the icon or a function receiving a boolean indicating whether the TextInput is focused and returning the color.
+     */
+    color?: ((isTextInputFocused: boolean) => string | undefined) | string;
+    /**
+     * Color of the ripple effect.
+     */
+    rippleColor?: ColorValue;
+    style?: StyleProp<ViewStyle>;
+    /**
+     * @optional
+     */
+    theme?: ThemeProp;
+};
+type StyleContextType = {
+    style: StyleProp<ViewStyle>;
+    isTextInputFocused: boolean;
+    forceFocus: () => void;
+    testID: string;
+    disabled?: boolean;
+};
+declare const IconAdornment: React.FunctionComponent<{
+    testID: string;
+    icon: React.ReactNode;
+    topPosition: number;
+    side: 'left' | 'right';
+    theme?: ThemeProp;
+    disabled?: boolean;
+} & Omit<StyleContextType, 'style'>>;
+/**
+ * A component to render a leading / trailing icon in the TextInput
+ *
+ * ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { TextInput } from 'react-native-paper';
+ *
+ * const MyComponent = () => {
+ *   const [text, setText] = React.useState('');
+ *
+ *   return (
+ *     <TextInput
+ *       label="Password"
+ *       secureTextEntry
+ *       right={<TextInput.Icon icon="eye" />}
+ *     />
+ *   );
+ * };
+ *
+ * export default MyComponent;
+ * ```
+ */
+declare const TextFieldIcon: {
+    ({ icon, onPress, forceTextInputFocus, color: customColor, theme: themeOverrides, rippleColor, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default TextFieldIcon;
+export { IconAdornment };

package/lib/typescript/ui/components/TextField/Adornment/enums.d.ts

@@ -0,0 +1,12 @@
+export declare enum AdornmentType {
+    Icon = "icon",
+    Affix = "affix"
+}
+export declare enum AdornmentSide {
+    Right = "right",
+    Left = "left"
+}
+export declare enum InputMode {
+    Outlined = "outlined",
+    Flat = "flat"
+}

package/lib/typescript/ui/components/TextField/Adornment/types.d.ts

@@ -0,0 +1,11 @@
+import type { AdornmentSide, AdornmentType } from './enums';
+export type AdornmentConfig = {
+    side: AdornmentSide;
+    type: AdornmentType;
+};
+export type AdornmentStyleAdjustmentForNativeInput = {
+    adornmentStyleAdjustmentForNativeInput: Array<{
+        paddingRight: number;
+        paddingLeft: number;
+    } | Record<string, never>>;
+};

package/lib/typescript/ui/components/TextField/Adornment/utils.d.ts

@@ -0,0 +1,11 @@
+import type { InternalTheme } from "../../types";
+type BaseProps = {
+    theme: InternalTheme;
+    disabled?: boolean;
+};
+export declare function getTextColor({ theme, disabled }: BaseProps): string;
+export declare function getIconColor({ theme, isTextInputFocused, disabled, customColor, }: BaseProps & {
+    isTextInputFocused: boolean;
+    customColor?: ((isTextInputFocused: boolean) => string | undefined) | string;
+}): string | undefined;
+export {};

package/lib/typescript/ui/components/TextField/Label/InputLabel.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { InputLabelProps } from '../types';
+declare const _default: React.MemoExoticComponent<(props: InputLabelProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/lib/typescript/ui/components/TextField/Label/LabelBackground.d.ts

@@ -0,0 +1,3 @@
+import type { LabelBackgroundProps } from '../types';
+declare const LabelBackground: ({ labeled, labelLayoutWidth, labelLayoutHeight, placeholderStyle, baseLabelTranslateX, topPosition, backgroundColor, roundness, labelStyle, maxFontSizeMultiplier, testID, }: LabelBackgroundProps) => (import("react/jsx-runtime").JSX.Element | null)[];
+export default LabelBackground;

package/lib/typescript/ui/components/TextField/TextFieldFlat.d.ts

@@ -0,0 +1,3 @@
+import type { ChildTextInputProps } from './types';
+declare const TextInputFlat: ({ disabled, editable, label, error, selectionColor: customSelectionColor, cursorColor, underlineColor, underlineStyle, activeUnderlineColor, textColor, dense, style, theme, render, multiline, parentState, innerRef, onFocus, forceFocus, onBlur, onChangeText, onLayoutAnimatedText, onLabelTextLayout, onLeftAffixLayoutChange, onRightAffixLayoutChange, onInputLayout, left, right, placeholderTextColor, testID, contentStyle, scaledLabel, ...rest }: ChildTextInputProps) => import("react/jsx-runtime").JSX.Element;
+export default TextInputFlat;

package/lib/typescript/ui/components/TextField/TextFieldOutlined.d.ts

@@ -0,0 +1,3 @@
+import type { ChildTextInputProps } from './types';
+declare const TextInputOutlined: ({ disabled, editable, label, error, selectionColor: customSelectionColor, cursorColor, underlineColor: _underlineColor, outlineColor: customOutlineColor, activeOutlineColor, outlineStyle, textColor, dense, style, theme, render, multiline, parentState, innerRef, onFocus, forceFocus, onBlur, onChangeText, onLayoutAnimatedText, onLabelTextLayout, onLeftAffixLayoutChange, onRightAffixLayoutChange, onInputLayout, onLayout, left, right, placeholderTextColor, testID, contentStyle, scaledLabel, ...rest }: ChildTextInputProps) => import("react/jsx-runtime").JSX.Element;
+export default TextInputOutlined;

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

@@ -0,0 +1,31 @@
+export declare const MAXIMIZED_LABEL_FONT_SIZE = 16;
+export declare const MINIMIZED_LABEL_FONT_SIZE = 12;
+export declare const LABEL_WIGGLE_X_OFFSET = 4;
+export declare const ADORNMENT_SIZE = 24;
+export declare const MIN_WIDTH = 100;
+export declare const MD2_AFFIX_OFFSET = 12;
+export declare const MD3_AFFIX_OFFSET = 16;
+export declare const ICON_SIZE = 24;
+export declare const MD2_ICON_OFFSET = 12;
+export declare const MD3_ICON_OFFSET = 16;
+export declare const MD2_MIN_HEIGHT = 64;
+export declare const MD3_MIN_HEIGHT = 56;
+export declare const MD3_ADORNMENT_OFFSET = 16;
+export declare const MD2_ADORNMENT_OFFSET = 12;
+export declare const LABEL_PADDING_TOP_DENSE = 24;
+export declare const LABEL_PADDING_TOP = 8;
+export declare const MD2_LABEL_PADDING_TOP = 30;
+export declare const MD3_LABEL_PADDING_TOP = 26;
+export declare const MD2_LABEL_PADDING_HORIZONTAL = 12;
+export declare const MD3_LABEL_PADDING_HORIZONTAL = 16;
+export declare const MD2_FLAT_INPUT_OFFSET = 8;
+export declare const MD3_FLAT_INPUT_OFFSET = 16;
+export declare const MINIMIZED_LABEL_Y_OFFSET = -18;
+export declare const MIN_DENSE_HEIGHT_WL = 52;
+export declare const MIN_DENSE_HEIGHT = 40;
+export declare const MD2_INPUT_PADDING_HORIZONTAL = 14;
+export declare const MD3_INPUT_PADDING_HORIZONTAL = 16;
+export declare const MD2_OUTLINED_INPUT_OFFSET = 8;
+export declare const MD3_OUTLINED_INPUT_OFFSET = 16;
+export declare const OUTLINE_MINIMIZED_LABEL_Y_OFFSET = -6;
+export declare const MIN_DENSE_HEIGHT_OUTLINED = 48;