ikualo-ui-kit-mobile 0.0.2

package/.expo/devices.json

@@ -0,0 +1,3 @@
+{
+  "devices": []
+}

package/.github/workflows/deploy_dev.yaml

@@ -0,0 +1,45 @@
+name: Deployment to Expo Dev
+
+on:
+  push:
+    branches:
+      - develop
+
+env:
+  APP_ENV: dev
+  APP_NAME: app-mobile
+
+jobs:
+  deployment:
+    name: Build App && Push to Expo
+    runs-on: ubuntu-latest
+    environment: dev
+    steps:
+      - name: 🏗 Checkout code
+        uses: actions/checkout@v3
+
+      - name: 🏗 Make envfile
+        uses: SpicyPizza/create-envfile@v2.0
+        with:
+          envkey_PORT: 3000
+          #envkey_TEST: ${{ secrets.TEST }}
+          file_name: .env
+          fail_on_empty: true
+
+      - name: 🏗 Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20.x
+          cache: yarn
+
+      - name: 🏗 Setup EAS
+        uses: expo/expo-github-action@v8
+        with:
+          eas-version: latest
+          token: ${{ secrets.EXPO_TOKEN }}
+
+      - name: 📦 Install dependencies
+        run: yarn install
+
+      - name: 🚀 Create update
+        run: eas update --auto --non-interactive

package/.prettierrc.json

@@ -0,0 +1,12 @@
+{
+   "$schema": "https://json.schemastore.org/prettierrc",
+   "arrowParens": "always",
+   "bracketSpacing": true,
+   "jsxBracketSameLine": false,
+   "printWidth": 110,
+   "semi": true,
+   "singleQuote": true,
+   "tabWidth": 2,
+   "trailingComma": "es5",
+   "useTabs": false
+}

package/App.tsx

@@ -0,0 +1,23 @@
+import { PaperProvider, Text } from 'react-native-paper';
+
+import { theme } from './src/config/paper.config';
+import { useFonts } from 'expo-font';
+
+export default function App() {
+  const [fontsLoaded] = useFonts({
+    MontserratLight: require('./assets/fonts/MontserratLight.ttf'), //300
+    MontserratRegular: require('./assets/fonts/MontserratRegular.ttf'), //400
+    MontserratSemiBold: require('./assets/fonts/MontserratSemiBold.ttf'), //600
+    MontserratBold: require('./assets/fonts/MontserratBold.ttf'), //700
+    MontserratExtraBold: require('./assets/fonts/MontserratExtraBold.ttf'), //900
+  });
+  return (
+    <>
+      {fontsLoaded && (
+        <PaperProvider theme={theme}>
+          <Text>App</Text>
+        </PaperProvider>
+      )}
+    </>
+  );
+}

package/app.json

@@ -0,0 +1,63 @@
+{
+  "expo": {
+    "name": "ikualo-app-2.0",
+    "slug": "ikualo-app-20",
+    "owner": "ikualo",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "light",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "ios": {
+      "supportsTablet": true,
+      "infoPlist": {
+        "NSFaceIDUsageDescription": "This app uses Face ID for authentication purposes."
+      }
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      }
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    },
+    "extra": {
+      "eas": {
+        "projectId": "5c8b451c-3fd3-42d1-91fd-fc1190b6f425"
+      }
+    },
+    "runtimeVersion": {
+      "policy": "appVersion"
+    },
+    "updates": {
+      "url": "https://u.expo.dev/5c8b451c-3fd3-42d1-91fd-fc1190b6f425"
+    },
+    "plugins": [
+      "expo-localization",
+      [
+        "expo-local-authentication",
+        {
+          "faceIDPermission": "Allow Ikualo to use Face ID."
+        }
+      ],
+      [
+        "expo-secure-store",
+        {
+          "faceIDPermission": "Allow Ikualo to access your Face ID biometric data."
+        }
+      ],
+      [
+        "expo-location",
+        {
+          "locationAlwaysAndWhenInUsePermission": "Allow Ikualo to use your location."
+        }
+      ]
+    ]
+  }
+}

package/assets/icons/_icons.ts

@@ -0,0 +1,59 @@
+export const icons = {
+  arroba: require('./arroba.png'),
+  arrowBack: require('./arrowBack.png'),
+  arrowDown: require('./arrowDown.png'),
+  arrowRight: require('./arrowRight.png'),
+  call: require('./call.png'),
+  check: require('./check.png'),
+  checkShield: require('./checkShield.png'),
+  email: require('./email.png'),
+  error: require('./error.png'),
+  help: require('./help.png'),
+  info: require('./info.png'),
+  replay: require('./replay.png'),
+  success: require('./success.png'),
+  warning: require('./warning.png'),
+  whatsapp: require('./whatsapp.png'),
+  visibilityOn: require('./visibilityOn.png'),
+  visibilityOnWhite: require('./visibilityOnWhite.png'),
+  visibilityOff: require('./visibilityOff.png'),
+  visibilityOffWhite: require('./visibilityOffWhite.png'),
+  infoBlack: require('./infoBlack.png'),
+  infoWhite: require('./infoWhite.png'),
+  smartPhone: require('./smartPhone.png'),
+  signal: require('./signal.png'),
+  document: require('./documentIcon.png'),
+  dni: require('./dni.png'),
+  phoneSend: require('./phoneSend.png'),
+  visaCard: require('./visaCard.png'),
+  addCard: require('./addCard.png'),
+  upload: require('./upload.png'),
+  iconDetails: require('./iconDetails.png'),
+  download: require('./download.png'),
+  lang: require('./lang.png'),
+  arrowDropdown: require('./arrowDropdown.png'),
+  circle: require('./circle.png'),
+  checkbox: require('./checkbox.png'),
+  checkboxOutline: require('./checkboxOutline.png'),
+  fingerprint: require('./fingerprint.png'),
+  faceID: require('./faceID.png'),
+  blur: require('./blur.png'),
+  ikualoActiveLogo: require('./ikualoActiveLogo.png'),
+  multipleCards: require('./multipleCards.png'),
+  avatarProfile: require('./avatarProfile.png'),
+  purpleCheckCircle: require('./purpleCheckCircle.png'),
+  arrowRightBlack: require('./arrowRightBlack.png'),
+  ikualoLogo: require('./ikualoLogo.png'),
+  multipleActiveCards: require('./multipleActiveCards.png'),
+  avatarActiveProfile: require('./avatarActiveProfile.png'),
+  transfer: require('./transfer.png'),
+  location: require('./location.png'),
+  openNewWindow: require('./openNewWindow.png'),
+  freezeCardButton: require('./freezeCardButton.png'),
+  detailsCardButton: require('./detailsCardButton.png'),
+  listButton: require('./listButton.png'),
+  dialpad: require('./dialpad.png'),
+  cardReplace: require('./cardReplace.png'),
+  dialpadActive: require('./dialpadActive.png'),
+  cardReplaceActive: require('./cardReplaceActive.png'),
+};

package/assets/images/_images.ts

@@ -0,0 +1,48 @@
+export const images = {
+  logo: require('./logo.png'),
+  fiveCards: require('./fiveCards.png'),
+  world: require('./world.png'),
+  ornateCard: require('./ornateCard.png'),
+  logoSmallWhite: require('./logoSmallWhite.png'),
+  logoSmallBlack: require('./logoSmallBlack.png'),
+  biometric: require('./biometric.png'),
+  digitalCash: require('./digitalCash.png'),
+  identityValidation: require('./identityValidation.png'),
+  debitCardDisabled: require('./debitCardDisabled.png'),
+  cards: {
+    black: {
+      card: require('./cardBlack.png'),
+      color: require('./black.png'),
+    },
+    blue: {
+      card: require('./cardBlue.png'),
+      color: require('./blue.png'),
+    },
+    green: {
+      card: require('./cardGreen.png'),
+      color: require('./green.png'),
+    },
+    orange: {
+      card: require('./cardOrange.png'),
+      color: require('./orange.png'),
+    },
+    pink: {
+      card: require('./cardPink.png'),
+      color: require('./pink.png'),
+    },
+    fuchsia: {
+      card: require('./cardFuchsia.png'),
+      color: require('./fuchsia.png'),
+    },
+    gray: {
+      card: require('./cardGray.png'),
+      color: require('./gray.png'),
+    },
+    default: {
+      card: require('./cardDefault.png'),
+      color: require('./default.png'),
+    },
+  },
+  validateIdentity: require('./validateIdentity.png'),
+  validationFailed: require('./validationFailed.png'),
+};

package/assets/styles/elements/alert.ts

@@ -0,0 +1,38 @@
+import { StyleSheet } from 'react-native';
+import { theme } from '../../../src/config/paper.config';
+
+const styleAlerts = StyleSheet.create({
+  alert: {
+    position: 'absolute',
+    top: 56,
+    left: 16,
+    right: 16,
+    zIndex: 1000000,
+    width: '92%',
+    borderRadius: 4,
+    borderLeftWidth: 8,
+    minHeight: 102,
+    padding: 16,
+  },
+  'alert--info': {
+    backgroundColor: theme.colors.lightInfo,
+    borderLeftColor: theme.colors.darkInfo,
+  },
+  'alert--warning': {
+    backgroundColor: theme.colors.lightWarning,
+    borderLeftColor: theme.colors.darkWarning,
+  },
+  'alert--success': {
+    backgroundColor: theme.colors.lightSuccess,
+    borderLeftColor: theme.colors.darkSuccess,
+  },
+  'alert--error': {
+    backgroundColor: theme.colors.lightRed,
+    borderLeftColor: theme.colors.darkRed,
+  },
+  'alert-container-text': { flexDirection: 'row', gap: 8 },
+  'alert-container-title': { fontSize: 14, fontFamily: 'MontserratBold', color: theme.colors.text },
+  'alert-body': { marginTop: 8 },
+});
+
+export { styleAlerts };