@oxyhq/services 5.11.9 → 5.11.10

package/lib/typescript/ui/navigation/types.d.ts

@@ -1,6 +1,7 @@
 import type { OxyServices } from '../../core';
 import type { User } from '../../models/interfaces';
 import type { ComponentType, ReactNode } from 'react';
+import type { QueryClient } from '@tanstack/react-query';
 /**
  * Base props for all screens in the Oxy UI system
  */
@@ -119,5 +120,9 @@ export interface OxyProviderProps {
      * @default true
      */
     showInternalToaster?: boolean;
+    /**
+     * Optional QueryClient instance for React Query. If not provided, a sensible default is created.
+     */
+    queryClient?: QueryClient;
 }
 //# sourceMappingURL=types.d.ts.map

package/lib/typescript/ui/navigation/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/ui/navigation/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/ui/navigation/types.ts"],"names":[],"mappings":"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"}

package/lib/typescript/ui/screens/AccountCenterScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccountCenterScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/AccountCenterScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAe3D,QAAA,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAiPlD,CAAC;AA6BF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"AccountCenterScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/AccountCenterScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAa3D,QAAA,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAyPlD,CAAC;AA6BF,eAAe,mBAAmB,CAAC"}

package/lib/typescript/ui/screens/AccountSettingsScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccountSettingsScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/AccountSettingsScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAcjF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;;AAwjD3D,wBAAiD"}
+{"version":3,"file":"AccountSettingsScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/AccountSettingsScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAcjF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;;AA4mD3D,wBAAiD"}

package/lib/typescript/ui/screens/FeedbackScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FeedbackScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/FeedbackScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAgBjF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAse3D,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAwiB7C,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"FeedbackScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/FeedbackScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAgBjF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AA2e3D,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA4gB7C,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/typescript/ui/screens/FileManagementScreen.d.ts

@@ -1,7 +1,24 @@
 import React from 'react';
 import type { BaseScreenProps } from '../navigation/types';
-interface FileManagementScreenProps extends BaseScreenProps {
+import type { FileMetadata } from '../../models/interfaces';
+export type OnConfirmFileSelection = (files: FileMetadata[]) => void;
+export interface FileManagementScreenProps extends BaseScreenProps {
     userId?: string;
+    selectMode?: boolean;
+    multiSelect?: boolean;
+    onSelect?: (file: FileMetadata) => void;
+    onConfirmSelection?: OnConfirmFileSelection;
+    initialSelectedIds?: string[];
+    maxSelection?: number;
+    disabledMimeTypes?: string[];
+    /**
+     * What to do after a single selection (non-multiSelect) is made.
+     * 'close' (default) will dismiss the bottom sheet via onClose.
+     * 'back' will navigate back to the previous screen (e.g., return to AccountSettings without closing sheet).
+     * 'none' will keep the picker open (caller can manually close or navigate).
+     */
+    afterSelect?: 'close' | 'back' | 'none';
+    allowUploadInSelectMode?: boolean;
 }
 declare const FileManagementScreen: React.FC<FileManagementScreenProps>;
 export default FileManagementScreen;

package/lib/typescript/ui/screens/FileManagementScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileManagementScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/FileManagementScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAgBjF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAU3D,UAAU,yBAA0B,SAAQ,eAAe;IACvD,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAOD,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAsyD7D,CAAC;AA2wBF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"FileManagementScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/FileManagementScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAgBjF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAK3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAO5D,MAAM,MAAM,sBAAsB,GAAG,CAAC,KAAK,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;AAErE,MAAM,WAAW,yBAA0B,SAAQ,eAAe;IAC9D,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IAExC,kBAAkB,CAAC,EAAE,sBAAsB,CAAC;IAE5C,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC7B;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IACxC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACrC;AAOD,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CA00D7D,CAAC;AAszBF,eAAe,oBAAoB,CAAC"}

package/lib/typescript/ui/screens/LanguageSelectorScreen.d.ts

@@ -0,0 +1,7 @@
+import type React from 'react';
+import type { BaseScreenProps } from '../navigation/types';
+interface LanguageSelectorScreenProps extends BaseScreenProps {
+}
+declare const LanguageSelectorScreen: React.FC<LanguageSelectorScreenProps>;
+export default LanguageSelectorScreen;
+//# sourceMappingURL=LanguageSelectorScreen.d.ts.map

package/lib/typescript/ui/screens/LanguageSelectorScreen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LanguageSelectorScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/LanguageSelectorScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AA2F3D,UAAU,2BAA4B,SAAQ,eAAe;CAAI;AAEjE,QAAA,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAkIjE,CAAC;AAwFF,eAAe,sBAAsB,CAAC"}

package/lib/typescript/ui/screens/ProfileScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/ProfileScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAO3D,UAAU,kBAAmB,SAAQ,eAAe;IAChD,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6S/C,CAAC;AAgGF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ProfileScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/ProfileScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAO3D,UAAU,kBAAmB,SAAQ,eAAe;IAChD,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAkT/C,CAAC;AAgGF,eAAe,aAAa,CAAC"}

package/lib/typescript/ui/screens/SessionManagementScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SessionManagementScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/SessionManagementScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAU3D,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA0PtD,CAAC;AAmHF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"SessionManagementScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/SessionManagementScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAO3D,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsRtD,CAAC;AAuFF,eAAe,uBAAuB,CAAC"}

package/lib/typescript/ui/screens/SignInScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SignInScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/SignInScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAkB/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAc3D,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAyY3C,CAAC;AAIF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"SignInScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/SignInScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA0B/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAc3D,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8W3C,CAAC;AAIF,eAAe,YAAY,CAAC"}

package/lib/typescript/ui/screens/SignUpScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SignUpScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/SignUpScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAejF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAwlB3D,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAkO3C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"SignUpScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/SignUpScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAejF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAwlB3D,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAgO3C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/typescript/ui/screens/WelcomeNewUserScreen.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { BaseScreenProps } from '../navigation/types';
+/**
+ * Post-signup welcome & onboarding screen.
+ * - Greets the newly registered user
+ * - Lets them immediately set / change their avatar using existing FileManagement picker
+ * - Only when the user presses "Continue" do we invoke onAuthenticated to finish flow & close sheet
+ */
+declare const WelcomeNewUserScreen: React.FC<BaseScreenProps & {
+    newUser?: any;
+}>;
+export default WelcomeNewUserScreen;
+//# sourceMappingURL=WelcomeNewUserScreen.d.ts.map

package/lib/typescript/ui/screens/WelcomeNewUserScreen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WelcomeNewUserScreen.d.ts","sourceRoot":"","sources":["../../../../src/ui/screens/WelcomeNewUserScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAS3D;;;;;GAKG;AACH,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,GAAG;IAAE,OAAO,CAAC,EAAE,GAAG,CAAA;CAAE,CAyHvE,CAAC;AAqIF,eAAe,oBAAoB,CAAC"}

package/lib/typescript/ui/screens/internal/SignInPasswordStep.d.ts

@@ -1,15 +1,15 @@
 import type React from 'react';
-import { Animated } from 'react-native';
+import { SharedValue } from 'react-native-reanimated';
 interface SignInPasswordStepProps {
     styles: any;
-    fadeAnim: Animated.Value;
-    slideAnim: Animated.Value;
-    scaleAnim: Animated.Value;
+    fadeAnim: SharedValue<number>;
+    slideAnim: SharedValue<number>;
+    scaleAnim: SharedValue<number>;
     colors: any;
     userProfile: any;
     username: string;
     theme: string;
-    logoAnim: Animated.Value;
+    logoAnim: SharedValue<number>;
     errorMessage: string;
     isInputFocused: boolean;
     password: string;

package/lib/typescript/ui/screens/internal/SignInPasswordStep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SignInPasswordStep.d.ts","sourceRoot":"","sources":["../../../../../src/ui/screens/internal/SignInPasswordStep.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAc,QAAQ,EAA+C,MAAM,cAAc,CAAC;AAMjG,UAAU,uBAAuB;IAC7B,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,EAAE,QAAQ,CAAC,KAAK,CAAC;IACzB,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC1B,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC1B,MAAM,EAAE,GAAG,CAAC;IACZ,WAAW,EAAE,GAAG,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,QAAQ,CAAC,KAAK,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,oBAAoB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;CACnE;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAsIzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"SignInPasswordStep.d.ts","sourceRoot":"","sources":["../../../../../src/ui/screens/internal/SignInPasswordStep.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAiB,EAEb,WAAW,EACd,MAAM,yBAAyB,CAAC;AAMjC,UAAU,uBAAuB;IAC7B,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,MAAM,EAAE,GAAG,CAAC;IACZ,WAAW,EAAE,GAAG,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,oBAAoB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;CACnE;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAiJzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/lib/typescript/ui/screens/internal/SignInUsernameStep.d.ts

@@ -1,10 +1,10 @@
 import type React from 'react';
-import { Animated } from 'react-native';
+import { SharedValue } from 'react-native-reanimated';
 interface SignInUsernameStepProps {
     styles: any;
-    fadeAnim: Animated.Value;
-    slideAnim: Animated.Value;
-    scaleAnim: Animated.Value;
+    fadeAnim: SharedValue<number>;
+    slideAnim: SharedValue<number>;
+    scaleAnim: SharedValue<number>;
     colors: any;
     isAddAccountMode: boolean;
     user: any;

package/lib/typescript/ui/screens/internal/SignInUsernameStep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SignInUsernameStep.d.ts","sourceRoot":"","sources":["../../../../../src/ui/screens/internal/SignInUsernameStep.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAA8B,QAAQ,EAAE,MAAM,cAAc,CAAC;AAMpE,UAAU,uBAAuB;IAC7B,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,EAAE,QAAQ,CAAC,KAAK,CAAC;IACzB,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC1B,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC1B,MAAM,EAAE,GAAG,CAAC;IACZ,gBAAgB,EAAE,OAAO,CAAC;IAC1B,IAAI,EAAE,GAAG,CAAC;IACV,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAC;IAC9D,WAAW,EAAE,GAAG,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,oBAAoB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,sBAAsB,EAAE,MAAM,IAAI,CAAC;IACnC,QAAQ,EAAE,GAAG,CAAC;CACjB;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqGzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"SignInUsernameStep.d.ts","sourceRoot":"","sources":["../../../../../src/ui/screens/internal/SignInUsernameStep.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAiB,EAEb,WAAW,EACd,MAAM,yBAAyB,CAAC;AAMjC,UAAU,uBAAuB;IAC7B,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,MAAM,EAAE,GAAG,CAAC;IACZ,gBAAgB,EAAE,OAAO,CAAC;IAC1B,IAAI,EAAE,GAAG,CAAC;IACV,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAC;IAC9D,WAAW,EAAE,GAAG,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,oBAAoB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,sBAAsB,EAAE,MAAM,IAAI,CAAC;IACnC,QAAQ,EAAE,GAAG,CAAC;CACjB;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA2GzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/lib/typescript/ui/styles/authStyles.d.ts

@@ -241,7 +241,7 @@ export declare const createAuthStyles: (colors: AuthThemeColors, theme: string)
         fontWeight: "bold" | undefined;
         fontSize: number;
         marginBottom: number;
-        textAlign: "center";
+        textAlign: "left";
         letterSpacing: number;
     };
     modernUsernameSubtext: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oxyhq/services",
-  "version": "5.11.9",
+  "version": "5.11.10",
   "description": "Reusable OxyHQ module to handle authentication, user management, karma system, device-based session management and more 🚀",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -47,6 +47,10 @@
   "repository": "https://github.com/oxyhq/oxyhqservices",
   "author": "OxyHQ",
   "license": "MIT",
+  "engines": {
+    "node": ">=18.0.0",
+    "npm": ">=9.0.0"
+  },
   "bugs": {
     "url": "https://github.com/oxyhq/oxyhqservices/issues"
   },
@@ -84,7 +88,11 @@
     "sonner-native": "^0.20.0",
     "tailwindcss": "^4.1.11",
     "zod": "^3.25.64",
-    "zustand": "^5.0.6"
+    "zustand": "^5.0.6",
+    "@tanstack/react-query": "^5.59.0",
+    "react": "^18.3.1",
+    "@amir-hossein-karimi/bottom-sheet": "^9.1.2",
+    "@gorhom/bottom-sheet": "^5.1.6"
   },
   "devDependencies": {
     "@biomejs/biome": "^1.9.4",

package/src/models/interfaces.ts

@@ -6,11 +6,8 @@ export interface User {
   id: string;
   username: string;
   email?: string;
-  avatar?: {
-    id?: string;
-    url?: string;
-    [key: string]: unknown;
-  };
+  // Avatar file id (asset id)
+  avatar?: string;
   name?: {
     first?: string;
     last?: string;

package/src/models/session.ts

@@ -15,10 +15,7 @@ export interface StorageKeys {
 export interface MinimalUserData {
   id: string;
   username: string;
-  avatar?: {
-    id?: string;
-    url?: string;
-  };
+  avatar?: string; // file id
 }
 
 export interface SessionLoginResponse {

package/src/ui/components/AnimationExample.tsx

@@ -0,0 +1,194 @@
+import React, { useState } from 'react';
+import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
+import Animated, {
+  useSharedValue,
+  useAnimatedStyle,
+  withTiming,
+  withSpring,
+  withSequence,
+  withDelay,
+  interpolateColor,
+  runOnJS,
+  Easing,
+} from 'react-native-reanimated';
+
+// Example component showcasing improved Reanimated usage
+const AnimationExample: React.FC = () => {
+  const [currentStep, setCurrentStep] = useState(0);
+  
+  // Shared values for better performance
+  const opacity = useSharedValue(1);
+  const scale = useSharedValue(1);
+  const translateX = useSharedValue(0);
+  const rotation = useSharedValue(0);
+  const progress = useSharedValue(0);
+  const colorProgress = useSharedValue(0);
+
+  // Animated styles with proper interpolation
+  const animatedStyle = useAnimatedStyle(() => {
+    return {
+      opacity: opacity.value,
+      transform: [
+        { scale: scale.value },
+        { translateX: translateX.value },
+        { rotate: `${rotation.value}deg` },
+      ],
+    };
+  });
+
+  const progressStyle = useAnimatedStyle(() => {
+    return {
+      width: `${progress.value * 100}%`,
+      backgroundColor: interpolateColor(
+        colorProgress.value,
+        [0, 1],
+        ['#3498db', '#e74c3c']
+      ),
+    };
+  });
+
+  const backgroundStyle = useAnimatedStyle(() => {
+    return {
+      backgroundColor: interpolateColor(
+        colorProgress.value,
+        [0, 1],
+        ['#ecf0f1', '#f39c12']
+      ),
+    };
+  });
+
+  // Complex animation sequence
+  const animateSequence = () => {
+    'worklet';
+    
+    // Staggered animations for smooth transitions
+    opacity.value = withTiming(0.5, { duration: 200 });
+    scale.value = withSpring(0.8, { damping: 15, stiffness: 150 });
+    
+    // Delayed follow-up animations
+    translateX.value = withDelay(
+      100,
+      withSpring(50, { damping: 20, stiffness: 100 }, (finished) => {
+        if (finished) {
+          translateX.value = withSpring(0, { damping: 15, stiffness: 150 });
+        }
+      })
+    );
+
+    // Sequential animations
+    rotation.value = withSequence(
+      withTiming(10, { duration: 150 }),
+      withTiming(-10, { duration: 150 }),
+      withTiming(0, { duration: 150 })
+    );
+
+    // Progress animation with easing
+    progress.value = withTiming(1, { 
+      duration: 1000, 
+      easing: Easing.out(Easing.exp) 
+    }, (finished) => {
+      if (finished) {
+        runOnJS(setCurrentStep)(currentStep + 1);
+      }
+    });
+
+    // Color transition
+    colorProgress.value = withTiming(1, { duration: 800 });
+
+    // Reset animations
+    setTimeout(() => {
+      opacity.value = withSpring(1);
+      scale.value = withSpring(1);
+      progress.value = withTiming(0, { duration: 500 });
+      colorProgress.value = withTiming(0, { duration: 500 });
+    }, 1500);
+  };
+
+  return (
+    <Animated.View style={[styles.container, backgroundStyle]}>
+      <Text style={styles.title}>Advanced Reanimated Example</Text>
+      <Text style={styles.subtitle}>Step: {currentStep}</Text>
+      
+      <Animated.View style={[styles.box, animatedStyle]}>
+        <Text style={styles.boxText}>Animated Box</Text>
+      </Animated.View>
+
+      <View style={styles.progressContainer}>
+        <Animated.View style={[styles.progressBar, progressStyle]} />
+      </View>
+
+      <TouchableOpacity style={styles.button} onPress={animateSequence}>
+        <Text style={styles.buttonText}>Animate Sequence</Text>
+      </TouchableOpacity>
+    </Animated.View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: 20,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    marginBottom: 10,
+    color: '#2c3e50',
+  },
+  subtitle: {
+    fontSize: 16,
+    marginBottom: 30,
+    color: '#7f8c8d',
+  },
+  box: {
+    width: 150,
+    height: 150,
+    backgroundColor: '#3498db',
+    borderRadius: 20,
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginBottom: 30,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.3,
+    shadowRadius: 8,
+    elevation: 8,
+  },
+  boxText: {
+    color: 'white',
+    fontSize: 16,
+    fontWeight: 'bold',
+  },
+  progressContainer: {
+    width: '100%',
+    height: 10,
+    backgroundColor: '#ecf0f1',
+    borderRadius: 5,
+    marginBottom: 30,
+    overflow: 'hidden',
+  },
+  progressBar: {
+    height: '100%',
+    borderRadius: 5,
+  },
+  button: {
+    backgroundColor: '#e74c3c',
+    paddingHorizontal: 30,
+    paddingVertical: 15,
+    borderRadius: 25,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.2,
+    shadowRadius: 4,
+    elevation: 4,
+  },
+  buttonText: {
+    color: 'white',
+    fontSize: 16,
+    fontWeight: 'bold',
+  },
+});
+
+export default AnimationExample;

package/src/ui/components/FollowButton.tsx

@@ -24,6 +24,10 @@ import { toast } from '../../lib/sonner';
 import { useFollow } from '../hooks/useFollow';
 import { useThemeColors } from '../styles/theme';
 
+// Create animated TouchableOpacity
+const AnimatedTouchableOpacity = Animated.createAnimatedComponent(TouchableOpacity);
+const AnimatedText = Animated.createAnimatedComponent(Text);
+
 export interface FollowButtonProps {
   userId: string;
   initiallyFollowing?: boolean;
@@ -65,6 +69,30 @@ const FollowButton: React.FC<FollowButtonProps> = ({
   const animationProgress = useSharedValue(isFollowing ? 1 : 0);
   const scale = useSharedValue(1);
 
+  // Button press handler with animation
+  const handlePress = useCallback(async (event?: { preventDefault?: () => void; stopPropagation?: () => void }) => {
+    if (preventParentActions && event && event.preventDefault) {
+      event.preventDefault();
+      event.stopPropagation?.();
+    }
+    if (disabled || isLoading) return;
+    
+    // Press animation
+    scale.value = withTiming(0.95, { duration: 100 }, (finished) => {
+      if (finished) {
+        scale.value = withSpring(1, { damping: 15, stiffness: 200 });
+      }
+    });
+
+    try {
+      await toggleFollow?.();
+      if (onFollowChange) onFollowChange(!isFollowing);
+    } catch (err: unknown) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      toast.error(error.message || 'Failed to update follow status');
+    }
+  }, [disabled, isLoading, toggleFollow, onFollowChange, isFollowing, preventParentActions, scale]);
+
   // Initialize Zustand state with initial value if not already set
   useEffect(() => {
     if (userId && !isFollowing && initiallyFollowing) {
@@ -86,24 +114,35 @@ const FollowButton: React.FC<FollowButtonProps> = ({
     animationProgress.value = withTiming(isFollowing ? 1 : 0, { duration: 300, easing: Easing.inOut(Easing.ease) });
   }, [isFollowing, animationProgress]);
 
-  // Button press handler
-  const handlePress = useCallback(async (event?: { preventDefault?: () => void; stopPropagation?: () => void }) => {
-    if (preventParentActions && event && event.preventDefault) {
-      event.preventDefault();
-      event.stopPropagation?.();
-    }
-    if (disabled || isLoading) return;
-    try {
-      await toggleFollow?.();
-      if (onFollowChange) onFollowChange(!isFollowing);
-    } catch (err: unknown) {
-      const error = err instanceof Error ? err : new Error(String(err));
-      toast.error(error.message || 'Failed to update follow status');
-    }
-  }, [disabled, isLoading, toggleFollow, onFollowChange, isFollowing, preventParentActions]);
+  // Animated styles for better performance
+  const animatedButtonStyle = useAnimatedStyle(() => {
+    return {
+      transform: [{ scale: scale.value }],
+      backgroundColor: interpolateColor(
+        animationProgress.value,
+        [0, 1],
+        [colors.background, colors.primary]
+      ),
+      borderColor: interpolateColor(
+        animationProgress.value,
+        [0, 1],
+        [colors.border, colors.primary]
+      ),
+    };
+  }, [colors]);
+
+  const animatedTextStyle = useAnimatedStyle(() => {
+    return {
+      color: interpolateColor(
+        animationProgress.value,
+        [0, 1],
+        [colors.text, '#FFFFFF']
+      ),
+    };
+  }, [colors]);
 
-  // Get button style based on size and follow state
-  const getButtonStyle = (): StyleProp<ViewStyle> => {
+  // Get base button style (without state-specific colors since they're animated)
+  const getBaseButtonStyle = (): StyleProp<ViewStyle> => {
     const baseStyle = {
       flexDirection: 'row' as const,
       alignItems: 'center' as const,
@@ -148,27 +187,11 @@ const FollowButton: React.FC<FollowButtonProps> = ({
       };
     }
 
-    // State-specific colors
-    let stateStyle = {};
-    if (isFollowing) {
-      stateStyle = {
-        backgroundColor: colors.primary,
-        borderColor: colors.primary,
-        shadowColor: colors.primary,
-      };
-    } else {
-      stateStyle = {
-        backgroundColor: colors.background,
-        borderColor: colors.border,
-        shadowColor: colors.border,
-      };
-    }
-
-    return [baseStyle, sizeStyle, stateStyle, style];
+    return [baseStyle, sizeStyle, style];
   };
 
-  // Get text style based on size and follow state
-  const getTextStyle = (): StyleProp<TextStyle> => {
+  // Get base text style (without state-specific colors since they're animated)
+  const getBaseTextStyle = (): StyleProp<TextStyle> => {
     const baseTextStyle = {
       fontFamily: fontFamilies.phuduSemiBold,
       fontWeight: '600' as const,
@@ -185,15 +208,12 @@ const FollowButton: React.FC<FollowButtonProps> = ({
       sizeTextStyle = { fontSize: 15 };
     }
 
-    // State-specific text color
-    const textColor = isFollowing ? '#FFFFFF' : colors.text;
-
-    return [baseTextStyle, sizeTextStyle, { color: textColor }, textStyle];
+    return [baseTextStyle, sizeTextStyle, textStyle];
   };
 
   return (
-    <TouchableOpacity
-      style={getButtonStyle()}
+    <AnimatedTouchableOpacity
+      style={[getBaseButtonStyle(), animatedButtonStyle]}
       onPress={handlePress}
       disabled={disabled || isLoading}
       activeOpacity={0.8}
@@ -204,11 +224,11 @@ const FollowButton: React.FC<FollowButtonProps> = ({
           color={isFollowing ? '#FFFFFF' : colors.primary}
         />
       ) : (
-        <Text style={getTextStyle()}>
+        <AnimatedText style={[getBaseTextStyle(), animatedTextStyle]}>
           {isFollowing ? 'Following' : 'Follow'}
-        </Text>
+        </AnimatedText>
       )}
-    </TouchableOpacity>
+    </AnimatedTouchableOpacity>
   );
 };
 

package/src/ui/components/GroupedItem.tsx

@@ -117,6 +117,7 @@ const styles = StyleSheet.create({
         justifyContent: 'space-between',
         marginBottom: 2,
         overflow: 'hidden',
+        width: '100%',
     },
     firstGroupedItem: {
         borderTopLeftRadius: 24,

package/src/ui/components/GroupedSection.tsx

@@ -28,7 +28,7 @@ interface GroupedSectionProps {
 
 const GroupedSection: React.FC<GroupedSectionProps> = ({ items, theme }) => {
     return (
-        <View>
+        <View style={{ width: '100%' }}>
             {items.map((item, index) => (
                 <GroupedItem
                     key={item.id}