@one_deploy/sdk 1.0.3 → 1.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@one_deploy/sdk",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "ONE Ecosystem SDK - Shared services, types, utilities, and React providers",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/components/OneSwapWidget.tsx

@@ -102,7 +102,7 @@ const TOKENS_BY_CHAIN: Record<number, SwapToken[]> = {
     { address: '0x0000000000000000000000000000000000000000', symbol: 'ETH', name: 'Ethereum', decimals: 18, chainId: 1 },
     { address: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48', symbol: 'USDC', name: 'USD Coin', decimals: 6, chainId: 1 },
     { address: '0xdAC17F958D2ee523a2206206994597C13D831ec7', symbol: 'USDT', name: 'Tether', decimals: 6, chainId: 1 },
-    { address: '0x6B175474E89094C44Da98b954EescdeCB5', symbol: 'DAI', name: 'Dai', decimals: 18, chainId: 1 },
+    { address: '0x6B175474E89094C44Da98b954EedeAC495271d0F', symbol: 'DAI', name: 'Dai', decimals: 18, chainId: 1 },
     { address: '0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2', symbol: 'WETH', name: 'Wrapped Ether', decimals: 18, chainId: 1 },
   ],
   // Base

package/src/components/ai/OneChainSelector.tsx

@@ -0,0 +1,183 @@
+/**
+ * OneChainSelector - Multi-chain selection component for AI trading
+ * Part of ONE Ecosystem SDK - can be used by any ecosystem partner
+ */
+
+import React from 'react';
+import { View, Text, StyleSheet, TouchableOpacity, ViewStyle, TextStyle } from 'react-native';
+
+// Chain configuration with branding
+export const CHAIN_CONFIG: Record<string, { name: string; icon: string; color: string }> = {
+  ethereum: { name: 'Ethereum', icon: 'Ξ', color: '#627EEA' },
+  arbitrum: { name: 'Arbitrum', icon: '◆', color: '#28A0F0' },
+  bsc: { name: 'BSC', icon: '◆', color: '#F3BA2F' },
+  base: { name: 'Base', icon: '●', color: '#0052FF' },
+  polygon: { name: 'Polygon', icon: '⬡', color: '#8247E5' },
+  optimism: { name: 'Optimism', icon: '◉', color: '#FF0420' },
+  avalanche: { name: 'Avalanche', icon: '▲', color: '#E84142' },
+  linea: { name: 'Linea', icon: '═', color: '#121212' },
+  zksync: { name: 'zkSync', icon: '⬢', color: '#8C8DFC' },
+  scroll: { name: 'Scroll', icon: '◎', color: '#FFEEDA' },
+};
+
+export interface OneChainSelectorProps {
+  /** List of supported chain IDs */
+  supportedChains: string[];
+  /** Currently selected chains */
+  selectedChains: string[];
+  /** Callback when chain selection changes */
+  onSelectChain: (chain: string) => void;
+  /** Enable multi-select (default: true) */
+  multiSelect?: boolean;
+  /** Accent color for selected state */
+  accentColor?: string;
+  /** Section title */
+  title?: string;
+  /** Section subtitle */
+  subtitle?: string;
+  /** Minimum required selections (for multi-select) */
+  minSelections?: number;
+  /** Custom styles */
+  style?: ViewStyle;
+  /** Custom title style */
+  titleStyle?: TextStyle;
+}
+
+export const OneChainSelector: React.FC<OneChainSelectorProps> = ({
+  supportedChains,
+  selectedChains,
+  onSelectChain,
+  multiSelect = true,
+  accentColor = '#188775',
+  title,
+  subtitle,
+  minSelections = 1,
+  style,
+  titleStyle,
+}) => {
+  const handleSelect = (chain: string) => {
+    if (multiSelect) {
+      // In multi-select, prevent deselecting if at minimum
+      if (selectedChains.includes(chain) && selectedChains.length <= minSelections) {
+        return;
+      }
+      onSelectChain(chain);
+    } else {
+      // Single select - always allow selection
+      if (!selectedChains.includes(chain)) {
+        onSelectChain(chain);
+      }
+    }
+  };
+
+  return (
+    <View style={[styles.container, style]}>
+      {title && <Text style={[styles.title, titleStyle]}>{title}</Text>}
+      {subtitle && <Text style={styles.subtitle}>{subtitle}</Text>}
+
+      <View style={styles.chainsContainer}>
+        {supportedChains.map((chain) => {
+          const chainInfo = CHAIN_CONFIG[chain] || { name: chain, icon: '●', color: '#888' };
+          const isSelected = selectedChains.includes(chain);
+
+          return (
+            <TouchableOpacity
+              key={chain}
+              style={[
+                styles.chainChip,
+                isSelected && styles.chainChipSelected,
+                isSelected && { borderColor: accentColor, backgroundColor: accentColor + '15' }
+              ]}
+              onPress={() => handleSelect(chain)}
+              activeOpacity={0.7}
+            >
+              <View style={[styles.chainIconBg, { backgroundColor: chainInfo.color + '20' }]}>
+                <Text style={[styles.chainIcon, { color: chainInfo.color }]}>{chainInfo.icon}</Text>
+              </View>
+              <Text style={[
+                styles.chainText,
+                isSelected && { color: accentColor, fontWeight: '600' }
+              ]}>
+                {chainInfo.name}
+              </Text>
+              {isSelected && (
+                <Text style={[styles.checkmark, { color: accentColor }]}>✓</Text>
+              )}
+            </TouchableOpacity>
+          );
+        })}
+      </View>
+
+      {multiSelect && selectedChains.length > 0 && (
+        <View style={styles.selectedInfo}>
+          <Text style={styles.selectedText}>
+            {selectedChains.length} chain{selectedChains.length > 1 ? 's' : ''} selected
+          </Text>
+        </View>
+      )}
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    marginBottom: 16,
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: '600',
+    color: '#1a1a1a',
+    marginBottom: 4,
+  },
+  subtitle: {
+    fontSize: 12,
+    color: '#666',
+    marginBottom: 12,
+  },
+  chainsContainer: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: 8,
+  },
+  chainChip: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    backgroundColor: '#fff',
+    borderRadius: 12,
+    borderWidth: 2,
+    borderColor: '#e5e5e5',
+    gap: 8,
+  },
+  chainChipSelected: {
+    borderWidth: 2,
+  },
+  chainIconBg: {
+    width: 28,
+    height: 28,
+    borderRadius: 14,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  chainIcon: {
+    fontSize: 14,
+    fontWeight: '700',
+  },
+  chainText: {
+    fontSize: 14,
+    color: '#666',
+  },
+  checkmark: {
+    fontSize: 16,
+    fontWeight: '700',
+  },
+  selectedInfo: {
+    marginTop: 8,
+    paddingVertical: 4,
+  },
+  selectedText: {
+    fontSize: 12,
+    color: '#888',
+  },
+});

package/src/components/ai/OneCycleSelector.tsx

@@ -0,0 +1,187 @@
+/**
+ * OneCycleSelector - Investment cycle selection component for AI trading
+ * Part of ONE Ecosystem SDK - can be used by any ecosystem partner
+ */
+
+import React from 'react';
+import { View, Text, StyleSheet, TouchableOpacity, ViewStyle, TextStyle } from 'react-native';
+
+// Default share rates by cycle (platform takes this percentage)
+export const DEFAULT_SHARE_RATES: Record<number, number> = {
+  7: 25,
+  14: 22,
+  30: 18,
+  60: 15,
+  90: 12,
+};
+
+export interface OneCycleSelectorProps {
+  /** List of supported cycle days */
+  supportedCycles: number[];
+  /** Currently selected cycle */
+  selectedCycle: number;
+  /** Callback when cycle selection changes */
+  onSelectCycle: (cycle: number) => void;
+  /** Accent color for selected state */
+  accentColor?: string;
+  /** Section title */
+  title?: string;
+  /** Section subtitle */
+  subtitle?: string;
+  /** Custom share rates by cycle (overrides defaults) */
+  shareRates?: Record<number, number>;
+  /** Days label */
+  daysLabel?: string;
+  /** Your share label */
+  yourShareLabel?: string;
+  /** Platform fee label */
+  platformFeeLabel?: string;
+  /** Custom styles */
+  style?: ViewStyle;
+  /** Custom title style */
+  titleStyle?: TextStyle;
+}
+
+export const OneCycleSelector: React.FC<OneCycleSelectorProps> = ({
+  supportedCycles,
+  selectedCycle,
+  onSelectCycle,
+  accentColor = '#188775',
+  title,
+  subtitle,
+  shareRates = DEFAULT_SHARE_RATES,
+  daysLabel = 'days',
+  yourShareLabel = 'Your share',
+  platformFeeLabel = 'Platform fee',
+  style,
+  titleStyle,
+}) => {
+  return (
+    <View style={[styles.container, style]}>
+      {title && <Text style={[styles.title, titleStyle]}>{title}</Text>}
+      {subtitle && <Text style={styles.subtitle}>{subtitle}</Text>}
+
+      <View style={styles.cyclesContainer}>
+        {supportedCycles.map((cycle) => {
+          const isSelected = selectedCycle === cycle;
+          const shareRate = shareRates[cycle] || 20;
+          const userRate = 100 - shareRate;
+
+          return (
+            <TouchableOpacity
+              key={cycle}
+              style={[
+                styles.cycleOption,
+                isSelected && styles.cycleOptionSelected,
+                isSelected && { borderColor: accentColor, backgroundColor: accentColor + '10' }
+              ]}
+              onPress={() => onSelectCycle(cycle)}
+              activeOpacity={0.7}
+            >
+              <Text style={[
+                styles.cycleDays,
+                isSelected && { color: accentColor }
+              ]}>
+                {cycle}
+              </Text>
+              <Text style={styles.cycleDaysLabel}>{daysLabel}</Text>
+
+              <View style={styles.cycleEarnings}>
+                <Text style={[
+                  styles.cycleEarningsValue,
+                  isSelected && { color: accentColor }
+                ]}>
+                  {userRate}%
+                </Text>
+                <Text style={styles.cycleEarningsLabel}>{yourShareLabel}</Text>
+              </View>
+
+              <Text style={styles.cycleFee}>
+                {shareRate}% {platformFeeLabel}
+              </Text>
+            </TouchableOpacity>
+          );
+        })}
+      </View>
+
+      <View style={styles.infoBox}>
+        <Text style={styles.infoText}>
+          Longer cycles = higher user share
+        </Text>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    marginBottom: 16,
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: '600',
+    color: '#1a1a1a',
+    marginBottom: 4,
+  },
+  subtitle: {
+    fontSize: 12,
+    color: '#666',
+    marginBottom: 12,
+  },
+  cyclesContainer: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: 8,
+  },
+  cycleOption: {
+    flex: 1,
+    minWidth: '45%',
+    padding: 16,
+    borderRadius: 12,
+    borderWidth: 2,
+    borderColor: '#e5e5e5',
+    backgroundColor: '#fff',
+    alignItems: 'center',
+  },
+  cycleOptionSelected: {
+    borderWidth: 2,
+  },
+  cycleDays: {
+    fontSize: 28,
+    fontWeight: '700',
+    color: '#1a1a1a',
+  },
+  cycleDaysLabel: {
+    fontSize: 12,
+    color: '#666',
+    marginBottom: 8,
+  },
+  cycleEarnings: {
+    alignItems: 'center',
+  },
+  cycleEarningsValue: {
+    fontSize: 18,
+    fontWeight: '700',
+    color: '#10B981',
+  },
+  cycleEarningsLabel: {
+    fontSize: 11,
+    color: '#666',
+  },
+  cycleFee: {
+    fontSize: 11,
+    color: '#888',
+    marginTop: 4,
+  },
+  infoBox: {
+    marginTop: 12,
+    padding: 8,
+    backgroundColor: '#f5f5f5',
+    borderRadius: 8,
+  },
+  infoText: {
+    fontSize: 12,
+    color: '#666',
+    textAlign: 'center',
+  },
+});

package/src/components/ai/OnePairSelector.tsx

@@ -0,0 +1,181 @@
+/**
+ * OnePairSelector - Trading pair selection component for AI trading
+ * Part of ONE Ecosystem SDK - can be used by any ecosystem partner
+ */
+
+import React from 'react';
+import { View, Text, StyleSheet, TouchableOpacity, ViewStyle, TextStyle } from 'react-native';
+
+// Common trading pairs with icons
+export const PAIR_ICONS: Record<string, string> = {
+  'BTC/USDT': '₿',
+  'ETH/USDT': 'Ξ',
+  'SOL/USDT': '◎',
+  'BNB/USDT': '◆',
+  'XRP/USDT': '✕',
+  'DOGE/USDT': 'Ð',
+  'ADA/USDT': '◈',
+  'AVAX/USDT': '▲',
+  'DOT/USDT': '●',
+  'MATIC/USDT': '⬡',
+  'LINK/USDT': '◇',
+  'UNI/USDT': '🦄',
+  'ATOM/USDT': '⚛',
+  'LTC/USDT': 'Ł',
+  'ARB/USDT': '◆',
+  'OP/USDT': '◉',
+};
+
+export interface OnePairSelectorProps {
+  /** List of supported trading pairs */
+  supportedPairs: string[];
+  /** Currently selected pairs */
+  selectedPairs: string[];
+  /** Callback when pair selection changes */
+  onTogglePair: (pair: string) => void;
+  /** Accent color for selected state */
+  accentColor?: string;
+  /** Section title */
+  title?: string;
+  /** Section subtitle */
+  subtitle?: string;
+  /** Minimum required selections */
+  minSelections?: number;
+  /** Maximum allowed selections (0 = unlimited) */
+  maxSelections?: number;
+  /** Custom styles */
+  style?: ViewStyle;
+  /** Custom title style */
+  titleStyle?: TextStyle;
+}
+
+export const OnePairSelector: React.FC<OnePairSelectorProps> = ({
+  supportedPairs,
+  selectedPairs,
+  onTogglePair,
+  accentColor = '#188775',
+  title,
+  subtitle,
+  minSelections = 1,
+  maxSelections = 0,
+  style,
+  titleStyle,
+}) => {
+  const handleToggle = (pair: string) => {
+    const isSelected = selectedPairs.includes(pair);
+
+    // Prevent deselecting below minimum
+    if (isSelected && selectedPairs.length <= minSelections) {
+      return;
+    }
+
+    // Prevent selecting above maximum
+    if (!isSelected && maxSelections > 0 && selectedPairs.length >= maxSelections) {
+      return;
+    }
+
+    onTogglePair(pair);
+  };
+
+  return (
+    <View style={[styles.container, style]}>
+      {title && <Text style={[styles.title, titleStyle]}>{title}</Text>}
+      {subtitle && <Text style={styles.subtitle}>{subtitle}</Text>}
+
+      <View style={styles.pairsContainer}>
+        {supportedPairs.map((pair) => {
+          const isSelected = selectedPairs.includes(pair);
+          const icon = PAIR_ICONS[pair] || '●';
+          const baseSymbol = pair.split('/')[0];
+
+          return (
+            <TouchableOpacity
+              key={pair}
+              style={[
+                styles.pairChip,
+                isSelected && styles.pairChipSelected,
+                isSelected && { backgroundColor: accentColor + '15', borderColor: accentColor }
+              ]}
+              onPress={() => handleToggle(pair)}
+              activeOpacity={0.7}
+            >
+              <Text style={styles.pairIcon}>{icon}</Text>
+              <Text style={[
+                styles.pairText,
+                isSelected && { color: accentColor, fontWeight: '600' }
+              ]}>
+                {baseSymbol}
+              </Text>
+              {isSelected && (
+                <Text style={[styles.checkmark, { color: accentColor }]}>✓</Text>
+              )}
+            </TouchableOpacity>
+          );
+        })}
+      </View>
+
+      <View style={styles.selectedInfo}>
+        <Text style={styles.selectedText}>
+          {selectedPairs.length} pair{selectedPairs.length !== 1 ? 's' : ''} selected
+          {minSelections > 0 && ` (min: ${minSelections})`}
+          {maxSelections > 0 && ` (max: ${maxSelections})`}
+        </Text>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    marginBottom: 16,
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: '600',
+    color: '#1a1a1a',
+    marginBottom: 4,
+  },
+  subtitle: {
+    fontSize: 12,
+    color: '#666',
+    marginBottom: 12,
+  },
+  pairsContainer: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: 8,
+  },
+  pairChip: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    backgroundColor: '#fff',
+    borderRadius: 8,
+    borderWidth: 1,
+    borderColor: '#e5e5e5',
+    gap: 6,
+  },
+  pairChipSelected: {
+    borderWidth: 2,
+  },
+  pairIcon: {
+    fontSize: 14,
+  },
+  pairText: {
+    fontSize: 14,
+    color: '#666',
+  },
+  checkmark: {
+    fontSize: 14,
+    fontWeight: '700',
+  },
+  selectedInfo: {
+    marginTop: 8,
+    paddingVertical: 4,
+  },
+  selectedText: {
+    fontSize: 12,
+    color: '#888',
+  },
+});