@inkline/inkline/src/components/IInput/examples/prepend-append-text.html

Inkline is the Vue.js UI/UX Library built for creating your next design system

<i-input v-model="value" placeholder="Type something..">
    <template #prepend>
        <span>https://</span>
    </template>
</i-input>

<i-input v-model="value" placeholder="Type something..">
    <template #append>
        <span>.com</span>
    </template>
</i-input>

<i-input v-model="value" placeholder="Type something..">
    <template #prepend>
        <span>https://</span>
    </template>
    <template #append>
        <span>.com</span>
    </template>
</i-input>