@usssa/component-library 1.0.0-alpha.27 → 1.0.0-alpha.29

package/README.md

@@ -1,4 +1,4 @@
-# Component Library v1.0.0-alpha.27
+# Component Library v1.0.0-alpha.29
 
 This library provides custom UI components for USSSA applications.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usssa/component-library",
-  "version": "1.0.0-alpha.27",
+  "version": "1.0.0-alpha.29",
   "description": "A Quasar component library project",
   "productName": "Quasar component library App",
   "author": "Troy Moreland <troy.moreland@usssa.com>",

package/src/components/core/UAvatar.vue

@@ -1,6 +1,7 @@
 <script setup>
 import { computed } from 'vue'
 import UBadgeStd from './UBadgeStd.vue'
+
 const props = defineProps({
   color: {
     type: String,
@@ -59,6 +60,19 @@ const labelSize = computed(() => {
 
   return props.size
 })
+
+const initials = computed(() => {
+  if (props.name) {
+    const parts = props.name.split(' ')
+
+    if (parts.length === 1) return parts[0].substring(0, 2).toUpperCase()
+
+    return `${parts[0].substring(0, 1).toUpperCase()}${parts[1]
+      .substring(0, 1)
+      .toUpperCase()}`
+  }
+  return props?.name
+})
 </script>
 
 <template>
@@ -77,7 +91,7 @@ const labelSize = computed(() => {
       class="name"
       :class="`text-${color} text-caption-${labelSize}`"
     >
-      {{ name }}
+      {{ initials }}
     </span>
     <UBadgeStd
       v-if="showIndicator"

package/src/components/core/UDialogStd.vue

@@ -57,14 +57,12 @@ const headerClass = computed(() => {
                 tabindex="-1"
                 class="dialog-action-icons"
                 :flat="true"
-                :aria-label="leftIconLabel"
                 @click="handleBackClick()"
               >
                 <q-icon
                   class="icon-back"
                   :class="leftIcon"
                   size="1.5rem"
-                  @click="handleBackClick()"
                   :aria-label="leftIconLabel"
                   tabindex="0"
                 />
@@ -83,10 +81,10 @@ const headerClass = computed(() => {
               </div>
             </div>
           </div>
+
           <UBtnStd
             class="dialog-action-icons"
             :flat="true"
-            :aria-label="closeIconLabel"
             tabindex="-1"
             @click="dialogRef.hide()"
           >
@@ -95,9 +93,7 @@ const headerClass = computed(() => {
               class="icon-close"
               :class="closeIcon"
               size="1.5rem"
-              @click="dialogRef.hide()"
               :aria-label="closeIconLabel"
-              :aria-hidden="false"
               tabindex="0"
             />
           </UBtnStd>
@@ -223,4 +219,10 @@ const headerClass = computed(() => {
 
   .q-focus-helper
     background: transparent !important
+
+#closeIconLabelRef
+  display: none
+
+#leftIconLabelRef
+  display: none
 </style>