blob: ec543faf6d7a82c1fea5aca66b7a7595622f64e3 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<script setup lang="ts">
import { ref } from 'vue';
import { getStringSizeInBytes } from './text-statistics.service';
import { formatBytes } from '@/utils/convert';
const text = ref('');
</script>
<template>
<c-card>
<n-input v-model:value="text" type="textarea" placeholder="Your text..." rows="5" />
<div mt-5 flex>
<n-statistic label="Character count" :value="text.length" flex-1 />
<n-statistic label="Word count" :value="text === '' ? 0 : text.split(/\s+/).length" flex-1 />
<n-statistic label="Line count" :value="text === '' ? 0 : text.split(/\r\n|\r|\n/).length" flex-1 />
<n-statistic label="Byte size" :value="formatBytes(getStringSizeInBytes(text))" flex-1 />
</div>
</c-card>
</template>
|