From 49e6b69b88596eed174189fc3c4ff1f0d4df026d Mon Sep 17 00:00:00 2001
From: byronogis <byronogis@outlook.com>
Date: Sat, 21 Dec 2024 17:19:29 +0800
Subject: [PATCH] chore(nuxt-layer-primo): sidebar text truncate

---
 .../components/Primo/PrimoMenuItem.vue                 | 10 +++++-----
 .../nuxt-layer-primo/components/Primo/PrimoSidebar.vue |  4 +++-
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/nuxt-layer-primo/components/Primo/PrimoMenuItem.vue b/packages/nuxt-layer-primo/components/Primo/PrimoMenuItem.vue
index fb3996d..7a328dd 100644
--- a/packages/nuxt-layer-primo/components/Primo/PrimoMenuItem.vue
+++ b/packages/nuxt-layer-primo/components/Primo/PrimoMenuItem.vue
@@ -79,7 +79,7 @@ function checkActiveRoute(item: PrimoSidebarMenuItem) {
     }"
   >
     <template v-if="!item.hidden">
-      <div v-if="root" class="layout-menuitem-root-text">
+      <div v-if="root" class="layout-menuitem-root-text truncate">
         {{ item.label }}
       </div>
 
@@ -91,8 +91,8 @@ function checkActiveRoute(item: PrimoSidebarMenuItem) {
         tabindex="0"
         @click="itemClick($event, item, index)"
       >
-        <i :class="item.icon" class="layout-menuitem-icon" />
-        <span class="layout-menuitem-text">{{ item.label }}</span>
+        <NuxtIcon v-if="item.icon" :name="item.icon" class="layout-menuitem-icon size-5 flex-none" />
+        <span class="layout-menuitem-text truncate">{{ item.label }}</span>
         <NuxtIcon v-if="item.items" name="i-prime:angle-down" class="layout-submenu-toggler size-5" />
       </a>
 
@@ -106,8 +106,8 @@ function checkActiveRoute(item: PrimoSidebarMenuItem) {
         :to="item.to"
         @click="itemClick($event, item, index)"
       >
-        <NuxtIcon v-if="item.icon" :name="item.icon" class="layout-menuitem-icon size-5" />
-        <span class="layout-menuitem-text">{{ item.label }}</span>
+        <NuxtIcon v-if="item.icon" :name="item.icon" class="layout-menuitem-icon size-5 flex-none" />
+        <span class="layout-menuitem-text truncate">{{ item.label }}</span>
         <NuxtIcon v-if="item.items" name="i-prime:angle-down" class="layout-submenu-toggler size-5" />
       </NuxtLink>
 
diff --git a/packages/nuxt-layer-primo/components/Primo/PrimoSidebar.vue b/packages/nuxt-layer-primo/components/Primo/PrimoSidebar.vue
index 6431961..5ce235f 100644
--- a/packages/nuxt-layer-primo/components/Primo/PrimoSidebar.vue
+++ b/packages/nuxt-layer-primo/components/Primo/PrimoSidebar.vue
@@ -3,7 +3,9 @@
 
 <template>
   <div class="layout-sidebar component-primo-sidebar">
-    <PrimoMenu />
+    <PrimeScrollPanel class="h-full max-w-full">
+      <PrimoMenu />
+    </PrimeScrollPanel>
   </div>
 </template>