feat: [avatar] - create getInitialLetter func

packages/components/avatar/src/avatar.vue

@@ -29,6 +29,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
+import { getInitialLetter } from '@puik/utils'
 import PuikIcon from '../../icon'
 import {
   avatarProps,
@@ -45,34 +46,21 @@ const props = defineProps(avatarProps)
 
 const initials = computed(() => {
   const firstInitial = props.firstname
-    ? props.firstname
-        .replace(/[^a-zA-Z0-9]/g, '')
-        .charAt(0)
-        .toUpperCase()
-    : ''
-  const lastInitial = props.lastname
-    ? props.lastname
-        .replace(/[^a-zA-Z0-9]/g, '')
-        .charAt(0)
-        .toUpperCase()
+    ? getInitialLetter(props.firstname, 0)
     : ''
+
+  const lastInitial = props.lastname ? getInitialLetter(props.lastname, 0) : ''
+
   const initialsValue = props.singleInitial
     ? firstInitial || lastInitial || 'P'
     : firstInitial && lastInitial
     ? firstInitial + lastInitial
     : firstInitial && props.firstname.length > 1
-    ? firstInitial +
-      props.firstname
-        .replace(/[^a-zA-Z0-9]/g, '')
-        .charAt(1)
-        .toUpperCase()
+    ? firstInitial + getInitialLetter(props.firstname, 1)
     : lastInitial && props.lastname.length > 1
-    ? lastInitial +
-      props.lastname
-        .replace(/[^a-zA-Z0-9]/g, '')
-        .charAt(1)
-        .toUpperCase()
+    ? lastInitial + getInitialLetter(props.lastname, 1)
     : 'PS'
+
   return initialsValue
 })
 </script>

packages/utils/getInitialLetter.ts

@@ -0,0 +1,13 @@
+/**
+ * Retrieves a letter from a string.
+ *
+ * @param {string} str - The string to process (with removal of special characters + uppercase process).
+ * @param {number} index - The index of the letter to retrieve.
+ * @returns {string} The letter at the specified index.
+ */
+export const getInitialLetter = (str: string, index: number): string => {
+  return str
+    .replace(/[^a-zA-Z0-9]/g, '')
+    .charAt(index)
+    .toUpperCase()
+}

packages/utils/index.ts

@@ -7,3 +7,4 @@ export * from './types'
 export * from './typescript'
 export * from './isEllipsisActive'
 export * from './clamp'
+export * from './getInitialLetter'