diff --git a/doc/datatable/ContextMenuDoc.vue b/doc/datatable/ContextMenuDoc.vue
index 245d79125..078663432 100644
--- a/doc/datatable/ContextMenuDoc.vue
+++ b/doc/datatable/ContextMenuDoc.vue
@@ -5,7 +5,7 @@
         </p>
     </DocSectionText>
     <div class="card">
-        <ContextMenu ref="cm" :model="menuModel" />
+        <ContextMenu ref="cm" :model="menuModel" @hide="selectedProduct = null" />
         <DataTable v-model:contextMenuSelection="selectedProduct" :value="products" contextMenu @row-contextmenu="onRowContextMenu" tableStyle="min-width: 50rem">
             <Column field="code" header="Code"></Column>
             <Column field="name" header="Name"></Column>
@@ -34,7 +34,7 @@ export default {
             ],
             code: {
                 basic: `
-<ContextMenu ref="cm" :model="menuModel" />
+<ContextMenu ref="cm" :model="menuModel" @hide="selectedProduct = null" />
 <DataTable v-model:contextMenuSelection="selectedProduct" :value="products" contextMenu
         @row-contextmenu="onRowContextMenu" tableStyle="min-width: 50rem">
     <Column field="code" header="Code"></Column>
@@ -49,8 +49,8 @@ export default {
 `,
                 options: `
 <template>
-    <div>
-        <ContextMenu ref="cm" :model="menuModel" />
+    <div class="card">
+        <ContextMenu ref="cm" :model="menuModel" @hide="selectedProduct = null" />
         <DataTable :value="products" contextMenu v-model:contextMenuSelection="selectedProduct" 
                 @rowContextmenu="onRowContextMenu" tableStyle="min-width: 50rem">
             <Column field="code" header="Code"></Column>
@@ -105,8 +105,8 @@ export default {
 `,
                 composition: `
 <template>
-    <div>
-        <ContextMenu ref="cm" :model="menuModel" />
+    <div class="card">
+        <ContextMenu ref="cm" :model="menuModel" @hide="selectedProduct = null" />
         <DataTable :value="products" contextMenu v-model:contextMenuSelection="selectedProduct"
                 @rowContextmenu="onRowContextMenu" tableStyle="min-width: 50rem">
             <Column field="code" header="Code"></Column>
diff --git a/public/themes/lara-light-blue/theme.css b/public/themes/lara-light-blue/theme.css
index 5f0008e2a..7ec7aea8d 100644
--- a/public/themes/lara-light-blue/theme.css
+++ b/public/themes/lara-light-blue/theme.css
@@ -4176,7 +4176,7 @@
   }
 
   .p-contextmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 0 none;
@@ -4188,7 +4188,7 @@
     outline: 0 none;
   }
   .p-contextmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4407,7 +4407,7 @@
     border-top-left-radius: 6px;
   }
   .p-megamenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     width: 12.5rem;
   }
   .p-megamenu .p-submenu-list .p-menuitem-separator {
@@ -4416,7 +4416,7 @@
   }
   .p-megamenu.p-megamenu-vertical {
     width: 12.5rem;
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
   }
   .p-megamenu.p-megamenu-horizontal .p-megamenu-root-list > .p-menuitem > .p-menuitem-content {
     color: #4b5563;
@@ -4450,7 +4450,7 @@
   }
 
   .p-menu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4623,7 +4623,7 @@
     color: #6b7280;
   }
   .p-menubar .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4661,7 +4661,7 @@
     .p-menubar .p-menubar-root-list {
       position: absolute;
       display: none;
-      padding: 0.25rem 0;
+      padding: 0.5rem 0;
       background: #ffffff;
       border: 0 none;
       box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4770,7 +4770,7 @@
     color: #374151;
   }
   .p-panelmenu .p-panelmenu-content {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     border: 1px solid #e5e7eb;
     background: #ffffff;
     color: #4b5563;
@@ -4936,7 +4936,7 @@
   }
 
   .p-tieredmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4952,7 +4952,7 @@
     outline: 0 none;
   }
   .p-tieredmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
diff --git a/public/themes/lara-light-indigo/theme.css b/public/themes/lara-light-indigo/theme.css
index b30bc17bd..37ed2672f 100644
--- a/public/themes/lara-light-indigo/theme.css
+++ b/public/themes/lara-light-indigo/theme.css
@@ -4176,7 +4176,7 @@
   }
 
   .p-contextmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 0 none;
@@ -4188,7 +4188,7 @@
     outline: 0 none;
   }
   .p-contextmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4407,7 +4407,7 @@
     border-top-left-radius: 6px;
   }
   .p-megamenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     width: 12.5rem;
   }
   .p-megamenu .p-submenu-list .p-menuitem-separator {
@@ -4416,7 +4416,7 @@
   }
   .p-megamenu.p-megamenu-vertical {
     width: 12.5rem;
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
   }
   .p-megamenu.p-megamenu-horizontal .p-megamenu-root-list > .p-menuitem > .p-menuitem-content {
     color: #4b5563;
@@ -4450,7 +4450,7 @@
   }
 
   .p-menu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4623,7 +4623,7 @@
     color: #6b7280;
   }
   .p-menubar .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4661,7 +4661,7 @@
     .p-menubar .p-menubar-root-list {
       position: absolute;
       display: none;
-      padding: 0.25rem 0;
+      padding: 0.5rem 0;
       background: #ffffff;
       border: 0 none;
       box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4770,7 +4770,7 @@
     color: #374151;
   }
   .p-panelmenu .p-panelmenu-content {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     border: 1px solid #e5e7eb;
     background: #ffffff;
     color: #4b5563;
@@ -4936,7 +4936,7 @@
   }
 
   .p-tieredmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4952,7 +4952,7 @@
     outline: 0 none;
   }
   .p-tieredmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
diff --git a/public/themes/lara-light-purple/theme.css b/public/themes/lara-light-purple/theme.css
index 9cfd4ba8e..800c57e49 100644
--- a/public/themes/lara-light-purple/theme.css
+++ b/public/themes/lara-light-purple/theme.css
@@ -4176,7 +4176,7 @@
   }
 
   .p-contextmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 0 none;
@@ -4188,7 +4188,7 @@
     outline: 0 none;
   }
   .p-contextmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4407,7 +4407,7 @@
     border-top-left-radius: 6px;
   }
   .p-megamenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     width: 12.5rem;
   }
   .p-megamenu .p-submenu-list .p-menuitem-separator {
@@ -4416,7 +4416,7 @@
   }
   .p-megamenu.p-megamenu-vertical {
     width: 12.5rem;
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
   }
   .p-megamenu.p-megamenu-horizontal .p-megamenu-root-list > .p-menuitem > .p-menuitem-content {
     color: #4b5563;
@@ -4450,7 +4450,7 @@
   }
 
   .p-menu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4623,7 +4623,7 @@
     color: #6b7280;
   }
   .p-menubar .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4661,7 +4661,7 @@
     .p-menubar .p-menubar-root-list {
       position: absolute;
       display: none;
-      padding: 0.25rem 0;
+      padding: 0.5rem 0;
       background: #ffffff;
       border: 0 none;
       box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4770,7 +4770,7 @@
     color: #374151;
   }
   .p-panelmenu .p-panelmenu-content {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     border: 1px solid #e5e7eb;
     background: #ffffff;
     color: #4b5563;
@@ -4936,7 +4936,7 @@
   }
 
   .p-tieredmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4952,7 +4952,7 @@
     outline: 0 none;
   }
   .p-tieredmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
diff --git a/public/themes/lara-light-teal/theme.css b/public/themes/lara-light-teal/theme.css
index 679cf30db..e1330eba0 100644
--- a/public/themes/lara-light-teal/theme.css
+++ b/public/themes/lara-light-teal/theme.css
@@ -4176,7 +4176,7 @@
   }
 
   .p-contextmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 0 none;
@@ -4188,7 +4188,7 @@
     outline: 0 none;
   }
   .p-contextmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4407,7 +4407,7 @@
     border-top-left-radius: 6px;
   }
   .p-megamenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     width: 12.5rem;
   }
   .p-megamenu .p-submenu-list .p-menuitem-separator {
@@ -4416,7 +4416,7 @@
   }
   .p-megamenu.p-megamenu-vertical {
     width: 12.5rem;
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
   }
   .p-megamenu.p-megamenu-horizontal .p-megamenu-root-list > .p-menuitem > .p-menuitem-content {
     color: #4b5563;
@@ -4450,7 +4450,7 @@
   }
 
   .p-menu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4623,7 +4623,7 @@
     color: #6b7280;
   }
   .p-menubar .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4661,7 +4661,7 @@
     .p-menubar .p-menubar-root-list {
       position: absolute;
       display: none;
-      padding: 0.25rem 0;
+      padding: 0.5rem 0;
       background: #ffffff;
       border: 0 none;
       box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
@@ -4770,7 +4770,7 @@
     color: #374151;
   }
   .p-panelmenu .p-panelmenu-content {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     border: 1px solid #e5e7eb;
     background: #ffffff;
     color: #4b5563;
@@ -4936,7 +4936,7 @@
   }
 
   .p-tieredmenu {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     color: #4b5563;
     border: 1px solid #e5e7eb;
@@ -4952,7 +4952,7 @@
     outline: 0 none;
   }
   .p-tieredmenu .p-submenu-list {
-    padding: 0.25rem 0;
+    padding: 0.5rem 0;
     background: #ffffff;
     border: 0 none;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);