zelune 1.6.3 → 1.6.4

package/src/screens/CheckoutScreen.tsx

@@ -1,229 +0,0 @@
-import React from 'react';
-import {
-  View,
-  Text,
-  TouchableOpacity,
-  StyleSheet,
-} from 'react-native';
-import { useNavigation } from '../runtime/MockNavigationContext';
-
-export default function CheckoutScreen() {
-  const navigation = useNavigation();
-
-  return (
-    <View style={styles.container}>
-      <View style={styles.headerRow}>
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.backButton}
-          onPress={() => navigation.navigate('ProductDetail')}
-        >
-          <Text style={styles.backButtonText}>← Spec Sheet</Text>
-        </TouchableOpacity>
-        <Text style={styles.headerTitle}>Dispatch &amp; Settlement</Text>
-      </View>
-
-      <View style={styles.orderCard}>
-        <Text style={styles.sectionHeading}>MANIFEST // ORDER #CH-8841</Text>
-        <View style={styles.itemRow}>
-          <View>
-            <Text style={styles.itemName}>Chronos Studio Pro</Text>
-            <Text style={styles.itemVariant}>Obsidian Anodized · Unit 01</Text>
-          </View>
-          <Text style={styles.itemPrice}>$349.00</Text>
-        </View>
-
-        <View style={styles.divider} />
-
-        <View style={styles.summaryRow}>
-          <Text style={styles.summaryLabel}>Priority Courier Dispatch</Text>
-          <Text style={styles.summaryFree}>INCLUDED</Text>
-        </View>
-        <View style={styles.summaryRow}>
-          <Text style={styles.summaryLabel}>Import &amp; Acoustic Levy</Text>
-          <Text style={styles.summaryValue}>$28.80</Text>
-        </View>
-        <View style={styles.totalRow}>
-          <Text style={styles.totalLabel}>Total Settlement</Text>
-          <Text style={styles.totalAmount}>$377.80</Text>
-        </View>
-      </View>
-
-      <View style={styles.paymentCard}>
-        <Text style={styles.sectionHeading}>CRYPTOGRAPHIC AUTHORIZATION</Text>
-        <View style={styles.cardMethodRow}>
-          <View style={styles.cardBrandBadge}>
-            <Text style={styles.cardBrandText}>G-PAY</Text>
-          </View>
-          <View>
-            <Text style={styles.cardNumber}>Hardware Token ·••• 4829</Text>
-            <Text style={styles.cardSub}>Biometric enclave signature ready</Text>
-          </View>
-        </View>
-      </View>
-
-      <TouchableOpacity
-        activeOpacity={0.78}
-        style={styles.confirmButton}
-        onPress={() => navigation.navigate('Home')}
-      >
-        <Text style={styles.confirmButtonText}>Authorize $377.80 Settlement</Text>
-      </TouchableOpacity>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: '#0A0B0E',
-    padding: 20,
-    justifyContent: 'space-between',
-  },
-  headerRow: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    marginTop: 6,
-  },
-  backButton: {
-    backgroundColor: '#13161E',
-    paddingHorizontal: 12,
-    paddingVertical: 9,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: '#222836',
-  },
-  backButtonText: {
-    color: '#E2E8F0',
-    fontSize: 12,
-    fontWeight: '600',
-  },
-  headerTitle: {
-    color: '#F8FAFC',
-    fontSize: 16,
-    fontWeight: '700',
-    letterSpacing: -0.2,
-  },
-  orderCard: {
-    backgroundColor: '#11141C',
-    borderRadius: 16,
-    padding: 18,
-    gap: 12,
-    borderWidth: 1,
-    borderColor: '#1E2433',
-  },
-  sectionHeading: {
-    color: '#38BDF8',
-    fontSize: 10,
-    fontWeight: '700',
-    letterSpacing: 1,
-  },
-  itemRow: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-  },
-  itemName: {
-    color: '#F8FAFC',
-    fontSize: 15,
-    fontWeight: '600',
-  },
-  itemVariant: {
-    color: '#64748B',
-    fontSize: 12,
-    marginTop: 2,
-  },
-  itemPrice: {
-    color: '#F8FAFC',
-    fontSize: 15,
-    fontWeight: '700',
-  },
-  divider: {
-    height: 1,
-    backgroundColor: '#1E2433',
-    marginVertical: 4,
-  },
-  summaryRow: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-  },
-  summaryLabel: {
-    color: '#94A3B8',
-    fontSize: 13,
-  },
-  summaryFree: {
-    color: '#10B981',
-    fontSize: 11,
-    fontWeight: '700',
-    letterSpacing: 0.6,
-  },
-  summaryValue: {
-    color: '#E2E8F0',
-    fontSize: 13,
-    fontWeight: '600',
-  },
-  totalRow: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    marginTop: 4,
-  },
-  totalLabel: {
-    color: '#F8FAFC',
-    fontSize: 14,
-    fontWeight: '700',
-  },
-  totalAmount: {
-    color: '#38BDF8',
-    fontSize: 20,
-    fontWeight: '700',
-  },
-  paymentCard: {
-    backgroundColor: '#11141C',
-    borderRadius: 14,
-    padding: 16,
-    gap: 10,
-    borderWidth: 1,
-    borderColor: '#1E2433',
-  },
-  cardMethodRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: 12,
-  },
-  cardBrandBadge: {
-    backgroundColor: '#161A26',
-    borderWidth: 1,
-    borderColor: '#262D3D',
-    paddingHorizontal: 10,
-    paddingVertical: 8,
-    borderRadius: 7,
-  },
-  cardBrandText: {
-    color: '#38BDF8',
-    fontSize: 10,
-    fontWeight: '700',
-    letterSpacing: 0.8,
-  },
-  cardNumber: {
-    color: '#F8FAFC',
-    fontSize: 14,
-    fontWeight: '600',
-  },
-  cardSub: {
-    color: '#64748B',
-    fontSize: 12,
-  },
-  confirmButton: {
-    backgroundColor: '#F8FAFC',
-    borderRadius: 10,
-    paddingVertical: 15,
-    alignItems: 'center',
-  },
-  confirmButtonText: {
-    color: '#08090C',
-    fontSize: 14,
-    fontWeight: '700',
-  },
-});

package/src/screens/HomeScreen.tsx

@@ -1,288 +0,0 @@
-import React, { useState } from 'react';
-import {
-  View,
-  Text,
-  TouchableOpacity,
-  ScrollView,
-  StyleSheet,
-} from 'react-native';
-import { useNavigation } from '../runtime/MockNavigationContext';
-
-export default function HomeScreen() {
-  const navigation = useNavigation();
-  const [activeTab, setActiveTab] = useState<'Featured' | 'Hardware' | 'Audio'>('Featured');
-
-  return (
-    <ScrollView style={styles.container} contentContainerStyle={styles.content}>
-      <View style={styles.topBar}>
-        <View>
-          <Text style={styles.greetingLabel}>CHRONOS ACOUSTIC DIVISION</Text>
-          <Text style={styles.headerTitle}>Reference Hardware</Text>
-        </View>
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.avatarButton}
-          onPress={() => navigation.navigate('Profile')}
-        >
-          <Text style={styles.avatarButtonText}>AX</Text>
-        </TouchableOpacity>
-      </View>
-
-      <View style={styles.heroBanner}>
-        <View style={styles.heroMetaRow}>
-          <Text style={styles.heroBadge}>SERIES 04 // BERYLLIUM</Text>
-          <Text style={styles.heroSerial}>48H DAC</Text>
-        </View>
-        <Text style={styles.heroTitle}>Chronos Spatial Studio Reference</Text>
-        <Text style={styles.heroSubtitle}>
-          Planar-magnetic acoustic architecture with zero-latency DSP room calibration.
-        </Text>
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.heroCta}
-          onPress={() => navigation.navigate('ProductDetail')}
-        >
-          <Text style={styles.heroCtaText}>Inspect Spec Sheet — $349</Text>
-        </TouchableOpacity>
-      </View>
-
-      <View style={styles.categoryRow}>
-        {(['Featured', 'Hardware', 'Audio'] as const).map((cat) => (
-          <TouchableOpacity
-            key={cat}
-            activeOpacity={0.78}
-            style={activeTab === cat ? styles.categoryPillActive : styles.categoryPill}
-            onPress={() => setActiveTab(cat)}
-          >
-            <Text
-              style={
-                activeTab === cat ? styles.categoryTextActive : styles.categoryText
-              }
-            >
-              {cat}
-            </Text>
-          </TouchableOpacity>
-        ))}
-      </View>
-
-      <View style={styles.productList}>
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.productCard}
-          onPress={() => navigation.navigate('ProductDetail')}
-        >
-          <View style={styles.productIconBox}>
-            <Text style={styles.productMonogram}>CH-01</Text>
-          </View>
-          <View style={styles.productInfo}>
-            <Text style={styles.productName}>Chronos Studio Pro</Text>
-            <Text style={styles.productMeta}>45mm Beryllium · Titanium Matte</Text>
-          </View>
-          <Text style={styles.productPrice}>$349</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.productCard}
-          onPress={() => navigation.navigate('Checkout')}
-        >
-          <View style={styles.productIconBoxAlt}>
-            <Text style={styles.productMonogramAlt}>KS-75</Text>
-          </View>
-          <View style={styles.productInfo}>
-            <Text style={styles.productName}>Keystone Field Controller</Text>
-            <Text style={styles.productMeta}>CNC Aluminum · Optical Hall Switches</Text>
-          </View>
-          <Text style={styles.productPrice}>$219</Text>
-        </TouchableOpacity>
-      </View>
-    </ScrollView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: '#0A0B0E',
-  },
-  content: {
-    padding: 20,
-    gap: 20,
-  },
-  topBar: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    marginTop: 6,
-  },
-  greetingLabel: {
-    color: '#38BDF8',
-    fontSize: 10,
-    fontWeight: '700',
-    letterSpacing: 1.1,
-  },
-  headerTitle: {
-    color: '#F8FAFC',
-    fontSize: 24,
-    fontWeight: '700',
-    letterSpacing: -0.4,
-    marginTop: 2,
-  },
-  avatarButton: {
-    width: 42,
-    height: 42,
-    borderRadius: 10,
-    backgroundColor: '#13161E',
-    alignItems: 'center',
-    justifyContent: 'center',
-    borderWidth: 1,
-    borderColor: '#222836',
-  },
-  avatarButtonText: {
-    color: '#F8FAFC',
-    fontSize: 12,
-    fontWeight: '700',
-  },
-  heroBanner: {
-    backgroundColor: '#11141C',
-    borderRadius: 16,
-    padding: 20,
-    gap: 10,
-    borderWidth: 1,
-    borderColor: '#262D3D',
-  },
-  heroMetaRow: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-  },
-  heroBadge: {
-    color: '#38BDF8',
-    fontSize: 10,
-    fontWeight: '700',
-    letterSpacing: 1,
-  },
-  heroSerial: {
-    color: '#10B981',
-    fontSize: 10,
-    fontWeight: '700',
-    letterSpacing: 0.8,
-  },
-  heroTitle: {
-    color: '#F8FAFC',
-    fontSize: 22,
-    fontWeight: '700',
-    letterSpacing: -0.3,
-  },
-  heroSubtitle: {
-    color: '#94A3B8',
-    fontSize: 13,
-    lineHeight: 19,
-  },
-  heroCta: {
-    backgroundColor: '#F8FAFC',
-    borderRadius: 9,
-    paddingVertical: 12,
-    paddingHorizontal: 16,
-    alignSelf: 'flex-start',
-    marginTop: 6,
-  },
-  heroCtaText: {
-    color: '#08090C',
-    fontSize: 13,
-    fontWeight: '700',
-  },
-  categoryRow: {
-    flexDirection: 'row',
-    gap: 8,
-  },
-  categoryPillActive: {
-    backgroundColor: '#191D28',
-    paddingHorizontal: 16,
-    paddingVertical: 10,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: '#38BDF8',
-  },
-  categoryPill: {
-    backgroundColor: '#11141C',
-    paddingHorizontal: 16,
-    paddingVertical: 10,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: '#1E2433',
-  },
-  categoryTextActive: {
-    color: '#F8FAFC',
-    fontSize: 12,
-    fontWeight: '700',
-  },
-  categoryText: {
-    color: '#94A3B8',
-    fontSize: 12,
-    fontWeight: '500',
-  },
-  productList: {
-    gap: 12,
-  },
-  productCard: {
-    backgroundColor: '#11141C',
-    borderRadius: 14,
-    padding: 14,
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: 14,
-    borderWidth: 1,
-    borderColor: '#1E2433',
-  },
-  productIconBox: {
-    width: 52,
-    height: 52,
-    borderRadius: 10,
-    backgroundColor: '#161A26',
-    borderWidth: 1,
-    borderColor: '#262D3D',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  productIconBoxAlt: {
-    width: 52,
-    height: 52,
-    borderRadius: 10,
-    backgroundColor: '#131720',
-    borderWidth: 1,
-    borderColor: '#222836',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  productMonogram: {
-    color: '#38BDF8',
-    fontSize: 11,
-    fontWeight: '700',
-    letterSpacing: 0.5,
-  },
-  productMonogramAlt: {
-    color: '#10B981',
-    fontSize: 11,
-    fontWeight: '700',
-    letterSpacing: 0.5,
-  },
-  productInfo: {
-    flex: 1,
-    gap: 3,
-  },
-  productName: {
-    color: '#F8FAFC',
-    fontSize: 15,
-    fontWeight: '600',
-  },
-  productMeta: {
-    color: '#64748B',
-    fontSize: 12,
-  },
-  productPrice: {
-    color: '#F8FAFC',
-    fontSize: 15,
-    fontWeight: '700',
-  },
-});

package/src/screens/LoginScreen.tsx

@@ -1,176 +0,0 @@
-import React, { useState } from 'react';
-import {
-  View,
-  Text,
-  TextInput,
-  TouchableOpacity,
-  StyleSheet,
-} from 'react-native';
-import { useNavigation } from '../runtime/MockNavigationContext';
-
-export default function LoginScreen() {
-  const navigation = useNavigation();
-  const [email, setEmail] = useState('alex@zelune.studio');
-  const [password, setPassword] = useState('••••••••••••');
-
-  return (
-    <View style={styles.container}>
-      <View style={styles.brandSection}>
-        <View style={styles.logoBadge}>
-          <Text style={styles.logoText}>CH//01</Text>
-        </View>
-        <Text style={styles.title}>Welcome back</Text>
-        <Text style={styles.subtitle}>
-          Authenticate to access Chronos Acoustic Lab &amp; hardware telemetry
-        </Text>
-      </View>
-
-      <View style={styles.formCard}>
-        <View style={styles.fieldGroup}>
-          <Text style={styles.fieldLabel}>OPERATOR ID / EMAIL</Text>
-          <TextInput
-            style={styles.input}
-            value={email}
-            onChangeText={setEmail}
-            placeholder="operator@chronos.audio"
-            placeholderTextColor="#64748B"
-          />
-        </View>
-
-        <View style={styles.fieldGroup}>
-          <Text style={styles.fieldLabel}>SECURITY KEY</Text>
-          <TextInput
-            style={styles.input}
-            value={password}
-            onChangeText={setPassword}
-            secureTextEntry
-            placeholderTextColor="#64748B"
-          />
-        </View>
-
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.primaryButton}
-          onPress={() => navigation.navigate('Home')}
-        >
-          <Text style={styles.primaryButtonText}>Enter Acoustic Studio</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity
-          activeOpacity={0.78}
-          style={styles.secondaryButton}
-          onPress={() => navigation.navigate('Profile')}
-        >
-          <Text style={styles.secondaryButtonText}>Hardware Passkey Handshake</Text>
-        </TouchableOpacity>
-      </View>
-
-      <View style={styles.footerRow}>
-        <Text style={styles.footerHint}>SYS-AUTH · ENCRYPTED SESSION 256-GCM</Text>
-      </View>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: '#0A0B0E',
-    paddingHorizontal: 24,
-    paddingVertical: 38,
-    justifyContent: 'space-between',
-  },
-  brandSection: {
-    marginTop: 22,
-    gap: 10,
-  },
-  logoBadge: {
-    alignSelf: 'flex-start',
-    paddingHorizontal: 12,
-    paddingVertical: 8,
-    borderRadius: 8,
-    backgroundColor: '#13161E',
-    borderWidth: 1,
-    borderColor: '#262D3D',
-    marginBottom: 6,
-  },
-  logoText: {
-    color: '#38BDF8',
-    fontSize: 12,
-    fontWeight: '700',
-    letterSpacing: 1.2,
-  },
-  title: {
-    color: '#F8FAFC',
-    fontSize: 28,
-    fontWeight: '700',
-    letterSpacing: -0.5,
-  },
-  subtitle: {
-    color: '#94A3B8',
-    fontSize: 14,
-    lineHeight: 20,
-  },
-  formCard: {
-    backgroundColor: '#11141C',
-    borderRadius: 16,
-    padding: 20,
-    gap: 16,
-    borderWidth: 1,
-    borderColor: '#1E2433',
-  },
-  fieldGroup: {
-    gap: 6,
-  },
-  fieldLabel: {
-    color: '#64748B',
-    fontSize: 10,
-    fontWeight: '700',
-    letterSpacing: 1,
-  },
-  input: {
-    backgroundColor: '#08090C',
-    borderWidth: 1,
-    borderColor: '#222836',
-    borderRadius: 10,
-    paddingHorizontal: 14,
-    paddingVertical: 13,
-    color: '#F8FAFC',
-    fontSize: 14,
-  },
-  primaryButton: {
-    backgroundColor: '#F8FAFC',
-    borderRadius: 10,
-    paddingVertical: 15,
-    alignItems: 'center',
-    marginTop: 4,
-  },
-  primaryButtonText: {
-    color: '#08090C',
-    fontSize: 14,
-    fontWeight: '700',
-  },
-  secondaryButton: {
-    backgroundColor: '#161A24',
-    borderRadius: 10,
-    paddingVertical: 14,
-    alignItems: 'center',
-    borderWidth: 1,
-    borderColor: '#262D3D',
-  },
-  secondaryButtonText: {
-    color: '#CBD5E1',
-    fontSize: 13,
-    fontWeight: '600',
-  },
-  footerRow: {
-    alignItems: 'center',
-    paddingBottom: 6,
-  },
-  footerHint: {
-    color: '#475569',
-    fontSize: 10,
-    fontWeight: '600',
-    letterSpacing: 1,
-  },
-});