@oxy.so/services 11.14.0 → 11.16.0

package/src/ui/screens/fileManagement/PhotoPickerSection.tsx

@@ -1,8 +1,9 @@
+import { PressableScale } from '@oxy.so/bloom/pressable-scale';
+import { SpinnerIcon } from '@oxy.so/bloom/loading';
+import { Button } from '@oxy.so/bloom/button';
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import {
   View,
-  TouchableOpacity,
-  ActivityIndicator,
   RefreshControl,
   FlatList,
   Platform,
@@ -14,7 +15,6 @@ import { Text } from '@oxy.so/bloom/typography';
 import { Image as ExpoImage } from 'expo-image';
 import Ionicons from '../../icons/Ionicons';
 import MaterialCommunityIcons from '../../icons/MaterialCommunityIcons';
-import * as Skeleton from '@oxy.so/bloom/skeleton';
 import type { FileMetadata } from '@oxy.so/core';
 import { computePhotoGridLayout } from './photoGridLayout';
 import FileLibraryError from './FileLibraryError';
@@ -110,7 +110,7 @@ export interface PhotoPickerViewProps {
   loadingMore: boolean;
   /**
    * Initial-load flag. While `true` AND no photos have arrived yet, the picker
-   * renders its OWN loading skeleton (placement-aware grid of shimmer tiles)
+   * keeps its toolbar and grid mounted while the query resolves
    * instead of the empty state — so the loading UI matches the picker's shape
    * and container width, not the browse file-manager chrome.
    */
@@ -156,18 +156,6 @@ const RING_SPRING_TENSION = 120;
 const CELL_CORNER_RADIUS = 8; // `rounded-radius-8`
 const SELECTION_RING_WIDTH = 3; // `border-[3px]`
 
-/**
- * Loading-skeleton tile fill. The picker's backdrop is ALWAYS black regardless
- * of theme, so we cannot use Bloom `Skeleton.Box`'s theme default (`contrast50`,
- * which is a near-black gray on a dark theme → invisible on this backdrop). A
- * neutral dark gray reads as a photo placeholder on black; Bloom's shimmer still
- * pulses the tile opacity on top of it. `Skeleton.Box` applies `style` after its
- * own base, so this override wins while the animated opacity is preserved.
- */
-const SKELETON_TILE_COLOR = '#26262A';
-/** Minimum skeleton rows so the grid never looks empty on a very short panel. */
-const SKELETON_MIN_ROWS = 4;
-
 type PhotoPickerCellProps = {
   photo: FileMetadata;
   size: number;
@@ -299,8 +287,7 @@ const PhotoPickerCell = React.memo(function PhotoPickerCell(props: PhotoPickerCe
         opacity,
       }}
     >
-      <TouchableOpacity
-        activeOpacity={0.85}
+      <PressableScale
         onPress={onPress}
         onLongPress={onLongPress}
         className="flex-1"
@@ -347,7 +334,7 @@ const PhotoPickerCell = React.memo(function PhotoPickerCell(props: PhotoPickerCe
             </Text>
           </View>
         )}
-      </TouchableOpacity>
+      </PressableScale>
     </Animated.View>
   );
 });
@@ -413,18 +400,6 @@ const PhotoPickerView: React.FC<PhotoPickerViewProps> = ({
     [effectiveWidth],
   );
 
-  // How many shimmer tiles the loading skeleton renders: enough FULL rows to
-  // fill the panel down to (but never past) its `maxHeight` cap, so the panel
-  // hugs the skeleton content instead of overflowing or scrolling. `floor`
-  // keeps the last row whole; `SKELETON_MIN_ROWS` guards a very short panel.
-  const skeletonTileCount = useMemo(() => {
-    const rowHeight = cellSize + gutter;
-    if (rowHeight <= 0) return columns * SKELETON_MIN_ROWS;
-    const available = Math.max(0, panelHeight - FLOATING_NAV_BAR_HEIGHT);
-    const rows = Math.max(SKELETON_MIN_ROWS, Math.floor(available / rowHeight));
-    return rows * columns;
-  }, [cellSize, gutter, columns, panelHeight]);
-
   // Map selectedIds → 1-based selection order for the badge. We freeze a
   // stable order at the time of selection: the order is the insertion
   // order of the Set (which JS preserves natively).
@@ -519,7 +494,7 @@ const PhotoPickerView: React.FC<PhotoPickerViewProps> = ({
     if (!loadingMore) return null;
     return (
       <View className="py-space-16 items-center">
-        <ActivityIndicator size="small" color="#FFFFFF" />
+        <SpinnerIcon size={16} color="#FFFFFF" />
       </View>
     );
   }, [loadingMore]);
@@ -560,34 +535,7 @@ const PhotoPickerView: React.FC<PhotoPickerViewProps> = ({
               descriptionColor="rgba(255,255,255,0.7)"
             />
           </View>
-        ) : isEmpty && loading ? (
-          /* Loading skeleton — the picker's OWN shape: shimmer tiles laid
-                       out with the SAME placement-aware geometry the real grid uses
-                       (`computePhotoGridLayout(effectiveWidth)`), edge-to-edge under
-                       the floating bar. `flexWrap` breaks rows exactly at `columns`
-                       because the last tile in each row carries no right margin (a
-                       full row + gutters fits the measured width by construction). */
-          <View
-            style={{ flexDirection: 'row', flexWrap: 'wrap', pointerEvents: 'none' }}
-            accessibilityElementsHidden
-            importantForAccessibility="no-hide-descendants"
-          >
-            {Array.from({ length: skeletonTileCount }, (_, index) => (
-              <Skeleton.Box
-                // biome-ignore lint/suspicious/noArrayIndexKey: fixed-size skeleton grid, order never changes
-                key={`skeleton-${index}`}
-                width={cellSize}
-                height={cellSize}
-                borderRadius={CELL_CORNER_RADIUS}
-                style={{
-                  marginRight: (index + 1) % columns === 0 ? 0 : gutter,
-                  marginBottom: gutter,
-                  backgroundColor: SKELETON_TILE_COLOR,
-                }}
-              />
-            ))}
-          </View>
-        ) : isEmpty ? (
+        ) : isEmpty && !loading ? (
           <View className="flex-1 items-center justify-center px-space-32">
             <View className="opacity-30 mb-space-16">
               <MaterialCommunityIcons name="image-outline" size={64} color="#FFFFFF" />
@@ -599,26 +547,15 @@ const PhotoPickerView: React.FC<PhotoPickerViewProps> = ({
               {t('fileManagement.photoPicker.emptySubtitle')}
             </Text>
             {isOwner && allowUpload && (
-              <TouchableOpacity
-                className="flex-row items-center gap-space-8 px-[22px] py-space-12 rounded-full"
-                style={{ backgroundColor: primaryColor }}
+              <Button
+                appearance="solid"
+                tone="accent"
                 onPress={onUpload}
-                disabled={uploading || isPickingDocument}
-                accessibilityRole="button"
-                accessibilityLabel={t('fileManagement.uploadPhoto')}
-                accessibilityState={{ busy: uploading || isPickingDocument }}
+                loading={uploading || isPickingDocument}
+                icon={<Ionicons name="cloud-upload" size={18} />}
               >
-                {uploading || isPickingDocument ? (
-                  <ActivityIndicator size="small" color="#FFFFFF" />
-                ) : (
-                  <>
-                    <Ionicons name="cloud-upload" size={18} color="#FFFFFF" />
-                    <Text className="text-white text-[15px] font-semibold">
-                      {t('fileManagement.uploadPhoto')}
-                    </Text>
-                  </>
-                )}
-              </TouchableOpacity>
+                {t('fileManagement.uploadPhoto')}
+              </Button>
             )}
           </View>
         ) : (

package/src/ui/screens/fileManagement/UploadBar.tsx

@@ -12,7 +12,10 @@ export interface UploadBarProps {
 
 /** Upload state is app-owned; surface, spinner and determinate meter are Bloom. */
 const UploadBar: React.FC<UploadBarProps> = ({ uploadProgress, t }) => (
-  <View pointerEvents="none" className="absolute top-[72px] left-0 right-0 items-center z-50">
+  <View
+    style={{ pointerEvents: 'none' }}
+    className="absolute top-[72px] left-0 right-0 items-center z-50"
+  >
     <Card
       appearance="solid"
       elevation="s"

package/src/ui/screens/index.ts

@@ -17,3 +17,4 @@ export { default as AccountMembersScreen } from './AccountMembersScreen';
 export { default as AccountSettingsScreen } from './AccountSettingsScreen';
 
 export { default as SupervisionScreen } from './SupervisionScreen';
+export { default as OxyOneScreen } from './OxyOneScreen';

package/src/ui/screens/trust/TrustCenterScreen.tsx

@@ -6,13 +6,12 @@ import Ionicons from '../../icons/Ionicons';
 import { Chip } from '@oxy.so/bloom/chip';
 import { useTheme } from '@oxy.so/bloom/theme';
 import { H1, Text } from '@oxy.so/bloom/typography';
-import { SettingsListGroup, SettingsListItem } from '@oxy.so/bloom/settings-list';
+import { GroupedSection, GroupedSectionItem } from '@oxy.so/bloom/grouped-section';
 import type { BaseScreenProps } from '../../types/navigation';
 import { SettingsIcon } from '../../components/SettingsIcon';
-import { Loading } from '@oxy.so/bloom/loading';
 import { useI18n } from '../../hooks/useI18n';
 import { useSurfaceHeader } from '../../hooks/useSurfaceHeader';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { trustTierLabel } from '@oxy.so/core';
 import { queryKeys } from '../../hooks/queries/queryKeys';
 
@@ -66,14 +65,6 @@ const TrustCenterScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
     );
   }
 
-  if (isLoading) {
-    return (
-      <View className="items-center py-space-40">
-        <Loading size="lg" color={primaryColor} />
-      </View>
-    );
-  }
-
   return (
     <View className="px-screen-margin pt-space-16 pb-space-24">
       {/* Balance hero card */}
@@ -101,38 +92,38 @@ const TrustCenterScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
       </View>
 
       {/* Trust actions */}
-      <SettingsListGroup title={t('trust.center.actions.title') || 'Explore'}>
-        <SettingsListItem
+      <GroupedSection title={t('trust.center.actions.title') || 'Explore'}>
+        <GroupedSectionItem
           icon={<SettingsIcon name="trophy" color={bloomTheme.colors.warning} />}
           title={t('trust.center.actions.leaderboard') || 'Leaderboard'}
           onPress={() => navigate?.('TrustLeaderboard')}
         />
-        <SettingsListItem
+        <GroupedSectionItem
           icon={<SettingsIcon name="file-document" color={bloomTheme.colors.info} />}
           title={t('trust.center.actions.rules') || 'Rules'}
           onPress={() => navigate?.('TrustRules')}
         />
-        <SettingsListItem
+        <GroupedSectionItem
           icon={<SettingsIcon name="gift" color={bloomTheme.colors.success} />}
           title={t('trust.center.actions.rewards') || 'Rewards'}
           onPress={() => navigate?.('TrustRewards')}
         />
-        <SettingsListItem
+        <GroupedSectionItem
           icon={<SettingsIcon name="star" color={bloomTheme.colors.primary} />}
           title={t('trust.center.actions.about') || 'About'}
           onPress={() => navigate?.('AboutTrust')}
         />
-        <SettingsListItem
+        <GroupedSectionItem
           icon={<SettingsIcon name="help-circle" color={bloomTheme.colors.secondary} />}
           title={t('trust.center.actions.faq') || 'FAQ'}
           onPress={() => navigate?.('TrustFAQ')}
         />
-      </SettingsListGroup>
+      </GroupedSection>
 
       {/* Reputation history */}
-      <SettingsListGroup title={t('trust.center.history') || 'Reputation History'}>
+      <GroupedSection title={t('trust.center.history') || 'Reputation History'}>
         {transactions.length === 0 ? (
-          <SettingsListItem
+          <GroupedSectionItem
             icon={<SettingsIcon name="history" color={bloomTheme.colors.textTertiary} />}
             title={t('trust.center.noHistory') || 'No reputation history yet.'}
             showChevron={false}
@@ -140,7 +131,7 @@ const TrustCenterScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
           />
         ) : (
           transactions.map((entry) => (
-            <SettingsListItem
+            <GroupedSectionItem
               key={entry.id}
               icon={
                 <SettingsIcon
@@ -166,7 +157,7 @@ const TrustCenterScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
             />
           ))
         )}
-      </SettingsListGroup>
+      </GroupedSection>
 
       {error ? (
         <Text

package/src/ui/screens/trust/TrustLeaderboardScreen.tsx

@@ -1,6 +1,7 @@
+import { GroupedSection, GroupedSectionItem } from '@oxy.so/bloom/grouped-section';
 import type React from 'react';
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { View, StyleSheet, ActivityIndicator, FlatList, TouchableOpacity } from 'react-native';
+import { View, StyleSheet, FlatList } from 'react-native';
 import type { ReputationLeaderboardEntry } from '@oxy.so/contracts';
 import { getNormalizedUserHandle, logger, trustTierLabel } from '@oxy.so/core';
 import { useTheme } from '@oxy.so/bloom/theme';
@@ -12,7 +13,7 @@ import type { BaseScreenProps } from '../../types/navigation';
 import { Avatar } from '@oxy.so/bloom/avatar';
 import { useI18n } from '../../hooks/useI18n';
 import { useSurfaceHeader } from '../../hooks/useSurfaceHeader';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 
 const AVATAR_SIZE = 40;
 const EMPTY_ICON_SIZE = 64;
@@ -69,45 +70,39 @@ const TrustLeaderboardScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
       const isViewer = currentUserId !== '' && item.user.id === currentUserId;
       const isPodium = item.rank <= PODIUM_RANK;
       // Viewer's own row and podium ranks get a subtle highlighted surface.
-      const highlightClass = isViewer || isPodium ? 'bg-fill-secondary' : '';
 
       return (
-        <TouchableOpacity
-          style={styles.row}
-          className={`px-screen-margin py-space-12 gap-space-12 rounded-radius-12 ${highlightClass}`}
-          onPress={() => handleEntryPress(item)}
-          activeOpacity={0.7}
-          accessibilityRole="button"
-          accessibilityLabel={`${displayName}, ${t('trust.leaderboard.rankLabel', { rank: item.rank }) || `rank ${item.rank}`}`}
-        >
-          <Text
-            className="text-text-secondary font-bold text-subtitle text-center"
-            style={styles.rank}
-            numberOfLines={1}
-          >
-            {item.rank}
-          </Text>
-          <Avatar
-            source={
-              item.user.avatar ? oxyServices.assets.publicUrl(item.user.avatar, 'thumb') : undefined
+        <GroupedSection>
+          <GroupedSectionItem
+            title={displayName}
+            description={trustTierLabel(locale, item.trustTier)}
+            onPress={() => handleEntryPress(item)}
+            accessibilityLabel={`${displayName}, ${t('trust.leaderboard.rankLabel', { rank: item.rank }) || `rank ${item.rank}`}`}
+            accessibilityState={{ selected: isViewer }}
+            icon={
+              <View style={styles.tierRow}>
+                <Text className="text-text-secondary font-bold" style={styles.rank}>
+                  {item.rank}
+                </Text>
+                <Avatar
+                  source={
+                    item.user.avatar
+                      ? oxyServices.assets.publicUrl(item.user.avatar, 'thumb')
+                      : undefined
+                  }
+                  name={displayName}
+                  size={AVATAR_SIZE}
+                />
+              </View>
             }
-            name={displayName}
-            size={AVATAR_SIZE}
-          />
-          <View style={styles.userColumn}>
-            <Text className="text-text font-medium text-base" numberOfLines={1}>
-              {displayName}
-            </Text>
-            <View style={styles.tierRow} className="mt-space-4">
+            rightElement={
               <Chip size="sm" variant="subtle" color={isPodium ? 'primary' : 'default'}>
-                {trustTierLabel(locale, item.trustTier)}
+                {item.total}
               </Chip>
-            </View>
-          </View>
-          <Text className="text-text font-bold text-base" numberOfLines={1}>
-            {item.total}
-          </Text>
-        </TouchableOpacity>
+            }
+            showChevron={false}
+          />
+        </GroupedSection>
       );
     },
     [oxyServices, currentUserId, handleEntryPress, locale, t],
@@ -118,20 +113,7 @@ const TrustLeaderboardScreen: React.FC<BaseScreenProps> = ({ navigate }) => {
     [],
   );
 
-  const ItemSeparator = useMemo(
-    () => () => <View style={styles.separator} className="border-b border-border-image" />,
-    [],
-  );
-
-  if (isLoading) {
-    return (
-      <View className="flex-1 bg-bg">
-        <View style={styles.center}>
-          <ActivityIndicator size="large" color={bloomTheme.colors.primary} />
-        </View>
-      </View>
-    );
-  }
+  const ItemSeparator = useMemo(() => () => <View style={{ height: 2 }} />, []);
 
   if (error) {
     return (
@@ -192,25 +174,13 @@ const styles = StyleSheet.create({
     flexGrow: 1,
     paddingBottom: 40,
   },
-  row: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
   rank: {
     width: 28,
   },
-  userColumn: {
-    flex: 1,
-  },
   tierRow: {
     flexDirection: 'row',
     alignItems: 'flex-start',
   },
-  // Inset the hairline separator to align with the start of the entry's text
-  // content (rank column + avatar + screen margin + gaps).
-  separator: {
-    marginLeft: 80,
-  },
   emptyContainer: {
     flex: 1,
     justifyContent: 'center',

package/src/ui/screens/trust/TrustRewardsScreen.tsx

@@ -1,14 +1,14 @@
 import type React from 'react';
 import { useMemo } from 'react';
 import { useQuery } from '@tanstack/react-query';
-import { View, StyleSheet } from 'react-native';
+import { Platform, View, StyleSheet } from 'react-native';
 import type { BaseScreenProps } from '../../types/navigation';
 import { useSurfaceHeader } from '../../hooks/useSurfaceHeader';
 import Ionicons from '../../icons/Ionicons';
 import { useTheme } from '@oxy.so/bloom/theme';
 import { H1, H4, H5, Text } from '@oxy.so/bloom/typography';
 import { useI18n } from '../../hooks/useI18n';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { queryKeys } from '../../hooks/queries/queryKeys';
 import { darkenColor, lightenColor } from '../../utils/colorUtils';
 
@@ -310,7 +310,10 @@ const TrustRewardsScreen: React.FC<BaseScreenProps> = () => {
                     styles.badgeValueText,
                     {
                       color: lightTone,
-                      textShadowColor: darkTone,
+                      ...Platform.select({
+                        web: { textShadow: `0px 2px 4px ${darkTone}` },
+                        default: { textShadowColor: darkTone },
+                      }),
                     },
                   ]}
                 >
@@ -541,8 +544,10 @@ const styles = StyleSheet.create({
   badgeValueText: {
     fontSize: 32,
     fontWeight: 'bold',
-    textShadowOffset: { width: 0, height: 2 },
-    textShadowRadius: 4,
+    ...Platform.select({
+      web: {},
+      default: { textShadowOffset: { width: 0, height: 2 }, textShadowRadius: 4 },
+    }),
     letterSpacing: -1,
   },
   rarityBadge: {

package/src/ui/screens/trust/TrustRulesScreen.tsx

@@ -3,16 +3,15 @@ import { useMemo } from 'react';
 import { useQuery } from '@tanstack/react-query';
 import { View } from 'react-native';
 import { Text } from '@oxy.so/bloom/typography';
-import { SettingsListGroup, SettingsListItem } from '@oxy.so/bloom/settings-list';
+import { GroupedSection, GroupedSectionItem } from '@oxy.so/bloom/grouped-section';
 import { Chip } from '@oxy.so/bloom/chip';
 import { useTheme } from '@oxy.so/bloom/theme';
 import { reputationCategoryLabel } from '@oxy.so/core';
 import type { ReputationRule, ReputationCategory } from '@oxy.so/contracts';
 import type { BaseScreenProps } from '../../types/navigation';
 import { useSurfaceHeader } from '../../hooks/useSurfaceHeader';
-import { Loading } from '@oxy.so/bloom/loading';
 import { useI18n } from '../../hooks/useI18n';
-import { useOxy } from '../../context/OxyContext';
+import { useOxy } from '../../context/oxyRuntimeContext';
 import { queryKeys } from '../../hooks/queries/queryKeys';
 
 /** Stable display order for rule category sections. */
@@ -71,9 +70,7 @@ const TrustRulesScreen: React.FC<BaseScreenProps> = () => {
 
   return (
     <>
-      {isLoading ? (
-        <Loading size="lg" color={bloomTheme.colors.primary} />
-      ) : error ? (
+      {isLoading ? null : error ? (
         <Text className="text-text-secondary text-base text-center px-screen-margin pt-space-40">
           {error}
         </Text>
@@ -84,9 +81,9 @@ const TrustRulesScreen: React.FC<BaseScreenProps> = () => {
       ) : (
         <View className="px-screen-margin pb-space-24 pt-space-12">
           {groupedRules.map(({ category, items }) => (
-            <SettingsListGroup key={category} title={reputationCategoryLabel(locale, category)}>
+            <GroupedSection key={category} title={reputationCategoryLabel(locale, category)}>
               {items.map((rule) => (
-                <SettingsListItem
+                <GroupedSectionItem
                   key={rule.actionType}
                   title={rule.description}
                   showChevron={false}
@@ -102,7 +99,7 @@ const TrustRulesScreen: React.FC<BaseScreenProps> = () => {
                   accessibilityLabel={`${rule.description}, ${rule.points > 0 ? '+' : ''}${rule.points} ${t('trust.center.balance') || 'reputation points'}`}
                 />
               ))}
-            </SettingsListGroup>
+            </GroupedSection>
           ))}
         </View>
       )}

package/src/ui/types/navigation.ts

@@ -62,6 +62,18 @@ export interface OxyProviderProps {
   oxyServices?: unknown;
   children?: ReactNode;
   onAuthStateChange?: (user: unknown) => void;
+  /** Opens the app's embedded Alia UI from Help & Support. The account dialog
+   * stays mounted so Bloom can stack Alia above it. The host owns sign-in
+   * and the Alia sheet/route.
+   * Omitted, support keeps the email action for apps without Alia.
+   */
+  onAskAlia?: () => void | Promise<void>;
+  /** App-specific documentation; defaults to https://oxy.so/developers/docs/. */
+  documentationUrl?: string;
+  /** Official AliaAvatar supplied by hosts that integrate Alia. */
+  aliaAvatar?: ReactNode;
+  /** Optional animated Oxy One artwork, e.g. OxyOneVideo from /ui/one-video. */
+  oxyOneArtwork?: ReactNode;
   /** Optional, non-blocking product analytics sink. Receives no profile data. */
   productAnalytics?: ProductAnalytics;
   storageKeyPrefix?: string;

package/lib/commonjs/ui/screens/UserLinksScreen.js

@@ -1,61 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _reactNative = require("react-native");
-var _settingsList = require("@oxy.so/bloom/settings-list");
-var _SettingsIcon = require("../components/SettingsIcon.js");
-var _theme = require("@oxy.so/bloom/theme");
-var _useI18n = require("../hooks/useI18n.js");
-var _useSurfaceHeader = require("../hooks/useSurfaceHeader.js");
-var _jsxRuntime = require("react/jsx-runtime");
-const UserLinksScreen = ({
-  userId,
-  links = [],
-  theme,
-  goBack,
-  navigate
-}) => {
-  const bloomTheme = (0, _theme.useTheme)();
-  const {
-    t
-  } = (0, _useI18n.useI18n)();
-  (0, _useSurfaceHeader.useSurfaceHeader)({
-    title: t('userLinks.title'),
-    subtitle: links.length !== 1 ? t('userLinks.linkCount_plural', {
-      count: links.length
-    }) : t('userLinks.linkCount', {
-      count: links.length
-    })
-  });
-  const handleLinkPress = async url => {
-    try {
-      await _reactNative.Linking.openURL(url);
-    } catch (error) {
-      if (__DEV__) {
-        console.error('Error opening link:', error);
-      }
-    }
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      className: "px-screen-margin pb-space-24",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListGroup, {
-        title: t('userLinks.title'),
-        children: links.map(link => /*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListItem, {
-          icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SettingsIcon.SettingsIcon, {
-            name: "link",
-            color: bloomTheme.colors.success
-          }),
-          title: link.title || link.url,
-          description: link.description || link.url,
-          onPress: () => handleLinkPress(link.url)
-        }, link.id))
-      })
-    })
-  });
-};
-var _default = exports.default = UserLinksScreen;
-//# sourceMappingURL=UserLinksScreen.js.map

package/lib/commonjs/ui/screens/UserLinksScreen.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_reactNative","require","_settingsList","_SettingsIcon","_theme","_useI18n","_useSurfaceHeader","_jsxRuntime","UserLinksScreen","userId","links","theme","goBack","navigate","bloomTheme","useTheme","t","useI18n","useSurfaceHeader","title","subtitle","length","count","handleLinkPress","url","Linking","openURL","error","__DEV__","console","jsx","Fragment","children","View","className","SettingsListGroup","map","link","SettingsListItem","icon","SettingsIcon","name","color","colors","success","description","onPress","id","_default","exports","default"],"sourceRoot":"../../../../src","sources":["ui/screens/UserLinksScreen.tsx"],"mappings":";;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAEA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,iBAAA,GAAAL,OAAA;AAA6D,IAAAM,WAAA,GAAAN,OAAA;AAa7D,MAAMO,eAA+C,GAAGA,CAAC;EACvDC,MAAM;EACNC,KAAK,GAAG,EAAE;EACVC,KAAK;EACLC,MAAM;EACNC;AACF,CAAC,KAAK;EACJ,MAAMC,UAAU,GAAG,IAAAC,eAAQ,EAAC,CAAC;EAC7B,MAAM;IAAEC;EAAE,CAAC,GAAG,IAAAC,gBAAO,EAAC,CAAC;EAEvB,IAAAC,kCAAgB,EAAC;IACfC,KAAK,EAAEH,CAAC,CAAC,iBAAiB,CAAC;IAC3BI,QAAQ,EACNV,KAAK,CAACW,MAAM,KAAK,CAAC,GACdL,CAAC,CAAC,4BAA4B,EAAE;MAAEM,KAAK,EAAEZ,KAAK,CAACW;IAAO,CAAC,CAAC,GACxDL,CAAC,CAAC,qBAAqB,EAAE;MAAEM,KAAK,EAAEZ,KAAK,CAACW;IAAO,CAAC;EACxD,CAAC,CAAC;EAEF,MAAME,eAAe,GAAG,MAAOC,GAAW,IAAK;IAC7C,IAAI;MACF,MAAMC,oBAAO,CAACC,OAAO,CAACF,GAAG,CAAC;IAC5B,CAAC,CAAC,OAAOG,KAAK,EAAE;MACd,IAAIC,OAAO,EAAE;QACXC,OAAO,CAACF,KAAK,CAAC,qBAAqB,EAAEA,KAAK,CAAC;MAC7C;IACF;EACF,CAAC;EAED,oBACE,IAAApB,WAAA,CAAAuB,GAAA,EAAAvB,WAAA,CAAAwB,QAAA;IAAAC,QAAA,eACE,IAAAzB,WAAA,CAAAuB,GAAA,EAAC9B,YAAA,CAAAiC,IAAI;MAACC,SAAS,EAAC,8BAA8B;MAAAF,QAAA,eAC5C,IAAAzB,WAAA,CAAAuB,GAAA,EAAC5B,aAAA,CAAAiC,iBAAiB;QAAChB,KAAK,EAAEH,CAAC,CAAC,iBAAiB,CAAE;QAAAgB,QAAA,EAC5CtB,KAAK,CAAC0B,GAAG,CAAEC,IAAI,iBACd,IAAA9B,WAAA,CAAAuB,GAAA,EAAC5B,aAAA,CAAAoC,gBAAgB;UAEfC,IAAI,eAAE,IAAAhC,WAAA,CAAAuB,GAAA,EAAC3B,aAAA,CAAAqC,YAAY;YAACC,IAAI,EAAC,MAAM;YAACC,KAAK,EAAE5B,UAAU,CAAC6B,MAAM,CAACC;UAAQ,CAAE,CAAE;UACrEzB,KAAK,EAAEkB,IAAI,CAAClB,KAAK,IAAIkB,IAAI,CAACb,GAAI;UAC9BqB,WAAW,EAAER,IAAI,CAACQ,WAAW,IAAIR,IAAI,CAACb,GAAI;UAC1CsB,OAAO,EAAEA,CAAA,KAAMvB,eAAe,CAACc,IAAI,CAACb,GAAG;QAAE,GAJpCa,IAAI,CAACU,EAKX,CACF;MAAC,CACe;IAAC,CAChB;EAAC,CACP,CAAC;AAEP,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEa1C,eAAe","ignoreList":[]}

package/lib/module/ui/screens/UserLinksScreen.js

@@ -1,57 +0,0 @@
-"use strict";
-
-import { View, Linking } from 'react-native';
-import { SettingsListGroup, SettingsListItem } from '@oxy.so/bloom/settings-list';
-import { SettingsIcon } from "../components/SettingsIcon.js";
-import { useTheme } from '@oxy.so/bloom/theme';
-import { useI18n } from "../hooks/useI18n.js";
-import { useSurfaceHeader } from "../hooks/useSurfaceHeader.js";
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-const UserLinksScreen = ({
-  userId,
-  links = [],
-  theme,
-  goBack,
-  navigate
-}) => {
-  const bloomTheme = useTheme();
-  const {
-    t
-  } = useI18n();
-  useSurfaceHeader({
-    title: t('userLinks.title'),
-    subtitle: links.length !== 1 ? t('userLinks.linkCount_plural', {
-      count: links.length
-    }) : t('userLinks.linkCount', {
-      count: links.length
-    })
-  });
-  const handleLinkPress = async url => {
-    try {
-      await Linking.openURL(url);
-    } catch (error) {
-      if (__DEV__) {
-        console.error('Error opening link:', error);
-      }
-    }
-  };
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsx(View, {
-      className: "px-screen-margin pb-space-24",
-      children: /*#__PURE__*/_jsx(SettingsListGroup, {
-        title: t('userLinks.title'),
-        children: links.map(link => /*#__PURE__*/_jsx(SettingsListItem, {
-          icon: /*#__PURE__*/_jsx(SettingsIcon, {
-            name: "link",
-            color: bloomTheme.colors.success
-          }),
-          title: link.title || link.url,
-          description: link.description || link.url,
-          onPress: () => handleLinkPress(link.url)
-        }, link.id))
-      })
-    })
-  });
-};
-export default UserLinksScreen;
-//# sourceMappingURL=UserLinksScreen.js.map