Merge pull request #17218 from abpframework/issue/17217

Add overflow hidden on tree component

npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html

@@ -23,7 +23,7 @@
     <ng-container *ngTemplateOutlet="nodeTemplate; context: { $implicit: node }"></ng-container>
 
     <ng-template #nodeTemplate let-node>
-      <div class="d-inline-block">
+      <div class="d-inline-flex align-items-center abp-ellipsis-inline">
         <ng-container
           *ngTemplateOutlet="
             customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate;

npm/ng-packs/packages/components/tree/src/lib/components/tree.component.scss

@@ -15,8 +15,14 @@ abp-tree .ant-tree {
   .ant-tree-node-content-wrapper {
     width: 100%;
     padding: 0;
+     > div {
+      display: flex;
+      padding-right: 0.5rem;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+     }
   }
-
   .node-wrapper {
     width: 100%;
     position: relative;