neptune-web-wallet/src/views/Auth/components/LoginTab.vue

<script setup lang="ts">
import { ref } from 'vue'
import { ImportWalletComponent, OpenWalletComponent } from '.'

const emit = defineEmits<{ goToCreate: [] }>()

const stage = ref<'import' | 'password'>('import')
const importData = ref<any>(null)

const handleImported = (payload: {
    type: 'seed' | 'keystore'
    value: string | string[]
}) => {
    importData.value = payload
    stage.value = 'password'
}

const handleNavigateToCreate = () => {
    emit('goToCreate')
}
</script>
<template>
    <div class="login-tab">
        <ImportWalletComponent v-if="stage === 'import'" @import-success="handleImported" />
        <OpenWalletComponent 
            v-else 
            :import-data="importData"
            @navigateToCreate="handleNavigateToCreate"
            @back="stage = 'import'"
        />
    </div>
</template>
<style lang="scss" scoped>
.login-tab {
    padding: var(--spacing-lg);
}
</style>