Theme updates

app.json

@@ -19,6 +19,7 @@
       }
     },
     "android": {
+      "versionCode": 8,
       "adaptiveIcon": {
         "foregroundImage": "./assets/adaptive-icon.png",
         "backgroundColor": "#000000"

metro.config.js

@@ -1,26 +1,5 @@
 const {getDefaultConfig} = require('expo/metro-config');
-const path = require('path');
-
-const themePackagePath = path.resolve(__dirname, '../react-native-dt-theme');
-const appNodeModules = path.resolve(__dirname, 'node_modules');
 
 const config = getDefaultConfig(__dirname);
 
-// Watch the external theme package
-config.watchFolders = [themePackagePath];
-
-// Redirect all imports to use app's node_modules (avoids duplicates)
-config.resolver.extraNodeModules = {
-  'react': path.resolve(appNodeModules, 'react'),
-  'react-native': path.resolve(appNodeModules, 'react-native'),
-  'react-native-paper': path.resolve(appNodeModules, 'react-native-paper'),
-  'react-native-svg': path.resolve(appNodeModules, 'react-native-svg'),
-  'react-native-safe-area-context': path.resolve(appNodeModules, 'react-native-safe-area-context'),
-};
-
-// Block theme package's node_modules entirely
-config.resolver.blockList = [
-  new RegExp(`${themePackagePath.replace(/[/\\]/g, '[/\\\\]')}/node_modules/.*`),
-];
-
 module.exports = config;

package-lock.json

@@ -16,7 +16,7 @@
         "expo-status-bar": "^3.0.9",
         "react": "19.1.0",
         "react-native": "0.81.5",
-        "react-native-dt-theme": "file:../react-native-dt-theme",
+        "react-native-dt-theme": "file:react-native-dt-theme-0.2.0.tgz",
         "react-native-nfc-manager": "^3.17.2",
         "react-native-paper": "^5.14.5",
         "react-native-safe-area-context": "~5.6.0",
@@ -45,31 +45,6 @@
         "node": ">=20"
       }
     },
-    "../react-native-dt-theme": {
-      "version": "0.1.0",
-      "license": "MIT",
-      "devDependencies": {
-        "@types/react": "^18.2.0",
-        "@types/react-native": "^0.72.0",
-        "react-native-paper": "^5.14.5",
-        "react-native-safe-area-context": "^5.6.2",
-        "react-native-svg": "^15.0.0",
-        "typescript": "^5.0.0"
-      },
-      "peerDependencies": {
-        "expo-font": ">=11.0.0",
-        "react": ">=18.0.0",
-        "react-native": ">=0.72.0",
-        "react-native-paper": ">=5.0.0",
-        "react-native-safe-area-context": ">=4.0.0",
-        "react-native-svg": ">=13.0.0"
-      },
-      "peerDependenciesMeta": {
-        "expo-font": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/@0no-co/graphql.web": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/@0no-co/graphql.web/-/graphql.web-1.2.0.tgz",
@@ -11612,8 +11587,23 @@
       }
     },
     "node_modules/react-native-dt-theme": {
-      "resolved": "../react-native-dt-theme",
+      "version": "0.2.0",
-      "link": true
+      "resolved": "file:react-native-dt-theme-0.2.0.tgz",
+      "integrity": "sha512-hp+Pvezv7nzjW9guy50Dz1XFDU2/mFcxQPztBbZTFLwIJyqFspch9Czu/ACHrKw37ZDGop9mVnOTuJP+eP1aJw==",
+      "license": "MIT",
+      "peerDependencies": {
+        "expo-font": ">=11.0.0",
+        "react": ">=18.0.0",
+        "react-native": ">=0.72.0",
+        "react-native-paper": ">=5.0.0",
+        "react-native-safe-area-context": ">=4.0.0",
+        "react-native-svg": ">=13.0.0"
+      },
+      "peerDependenciesMeta": {
+        "expo-font": {
+          "optional": true
+        }
+      }
     },
     "node_modules/react-native-is-edge-to-edge": {
       "version": "1.2.1",

package.json

@@ -15,7 +15,6 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "react-native-dt-theme": "file:../react-native-dt-theme",
     "@react-navigation/native": "^7.1.27",
     "@react-navigation/native-stack": "^7.9.1",
     "babel-preset-expo": "~54.0.10",
@@ -24,6 +23,7 @@
     "expo-status-bar": "^3.0.9",
     "react": "19.1.0",
     "react-native": "0.81.5",
+    "react-native-dt-theme": "file:react-native-dt-theme-0.2.0.tgz",
     "react-native-nfc-manager": "^3.17.2",
     "react-native-paper": "^5.14.5",
     "react-native-safe-area-context": "~5.6.0",

src/screens/ResultScreen.tsx

@@ -1,7 +1,7 @@
 import React, { useMemo, useState } from 'react';
 import { StyleSheet, View, ScrollView, Linking, TouchableOpacity } from 'react-native';
 import { Button, Text, Surface, Divider, Chip } from 'react-native-paper';
-import { DTCard, DTButton, DTColors } from 'react-native-dt-theme';
+import { DTCard, DTButton, DTColors, DTLabel, DTChip } from 'react-native-dt-theme';
 import type { ResultScreenProps } from '../types/navigation';
 import { matchChipToProducts, getMatchSummary, getDesfireEvMismatchWarning, getMifareClassicCapacityWarning } from '../services/matching';
 import { Product } from '../types/products';
@@ -249,30 +249,33 @@ export function ResultScreen({ route, navigation }: ResultScreenProps) {
 
         {/* Product Matches Card - hide for payment devices */}
         {transponder && matchResult && (matchResult.exactMatches.length > 0 || matchResult.cloneTargets.length > 0) && !transponder.implantName?.includes('Payment Card') && (
-          <Surface style={styles.productsCard} elevation={1}>
+          // <Surface style={styles.productsCard} elevation={1}>
-            <Text variant="labelLarge" style={styles.productsLabel}>
+          <>
+            {/* <Text variant="labelLarge" style={styles.productsLabel}>
               COMPATIBLE IMPLANTS
-            </Text>
+            </Text> */}
-            <Divider style={[styles.divider, { backgroundColor: DTColors.modeEmphasis }]} />
+            <DTLabel mode='emphasis' primaryText="Compatible Implants" />
+            {/* <Divider style={[styles.divider, { backgroundColor: DTColors.modeEmphasis }]} /> */}
 
-            <Text variant="bodyMedium" style={styles.matchSummary}>
+            {/* <Text variant="bodyMedium" style={styles.matchSummary}>
               {getMatchSummary(matchResult, transponder.chipName)}
-            </Text>
+            </Text> */}
 
             {/* Exact Matches / Clone Targets */}
             {[...matchResult.exactMatches, ...matchResult.cloneTargets.filter(
               p => !matchResult.exactMatches.find(e => e.id === p.id)
             )].map(product => (
-              <Surface key={product.id} style={styles.productItem} elevation={0}>
+              // <Surface key={product.id} style={styles.productItem} elevation={0}>
+              <DTCard mode='emphasis' title={product.name} style={{ paddingBottom: 10 }}>
                 <View style={styles.productHeader}>
-                  <Text variant="titleMedium" style={styles.productName}>
+                  {/* <Text variant="titleMedium" style={styles.productName}>
                     {product.name}
-                  </Text>
+                  </Text> */}
-                  <Chip
+                  <DTChip
                     style={styles.formFactorChip}
                     textStyle={styles.formFactorChipText}>
                     {product.formFactor.replace('_', ' ')}
-                  </Chip>
+                  </DTChip>
                 </View>
 
                 <Text variant="bodySmall" style={styles.productDescription}>
@@ -307,17 +310,20 @@ export function ResultScreen({ route, navigation }: ResultScreenProps) {
                   ))}
                 </View>
 
-                <Button
+                <DTButton
                   mode="outlined"
                   onPress={() => handleProductLink(product)}
                   style={styles.productButton}
                   labelStyle={styles.productButtonLabel}
                   compact>
                   VIEW PRODUCT
-                </Button>
+
-              </Surface>
+                </DTButton>
+              </DTCard>
+
             ))}
-          </Surface>
+            {/* </Surface> */}
+          </>
         )}
 
         {/* No Match Card - show when chip detected but no products match */}