move ellipsis directive to the theme-shared

#7374

npm/ng-packs/packages/core/src/lib/core.module.ts

@@ -11,7 +11,6 @@ import { ReplaceableRouteContainerComponent } from './components/replaceable-rou
 import { RouterOutletComponent } from './components/router-outlet.component';
 import { AutofocusDirective } from './directives/autofocus.directive';
 import { InputEventDebounceDirective } from './directives/debounce.directive';
-import { EllipsisDirective } from './directives/ellipsis.directive';
 import { ForDirective } from './directives/for.directive';
 import { FormSubmitDirective } from './directives/form-submit.directive';
 import { InitDirective } from './directives/init.directive';
@@ -53,11 +52,9 @@ export function storageFactory(): OAuthStorage {
     ReactiveFormsModule,
     RouterModule,
     LocalizationModule,
-
     AbstractNgModelComponent,
     AutofocusDirective,
     DynamicLayoutComponent,
-    EllipsisDirective,
     ForDirective,
     FormSubmitDirective,
     InitDirective,
@@ -83,7 +80,6 @@ export function storageFactory(): OAuthStorage {
     AbstractNgModelComponent,
     AutofocusDirective,
     DynamicLayoutComponent,
-    EllipsisDirective,
     ForDirective,
     FormSubmitDirective,
     InitDirective,

npm/ng-packs/packages/core/src/lib/directives/index.ts

@@ -1,6 +1,5 @@
 export * from './autofocus.directive';
 export * from './debounce.directive';
-export * from './ellipsis.directive';
 export * from './for.directive';
 export * from './form-submit.directive';
 export * from './init.directive';

npm/ng-packs/packages/theme-shared/src/lib/directives/ellipsis.directive.ts

@@ -0,0 +1,46 @@
+import {
+  AfterViewInit,
+  ChangeDetectorRef,
+  Directive,
+  ElementRef,
+  HostBinding,
+  Input,
+  NgModule,
+} from '@angular/core';
+
+@Directive({
+  selector: '[abpEllipsis]',
+})
+export class EllipsisDirective implements AfterViewInit {
+  @Input('abpEllipsis')
+  width: string;
+
+  @HostBinding('title')
+  @Input()
+  title: string;
+
+  @Input('abpEllipsisEnabled')
+  enabled = true;
+
+  @HostBinding('class.abp-ellipsis-inline')
+  get inlineClass() {
+    return this.enabled && this.width;
+  }
+
+  @HostBinding('class.abp-ellipsis')
+  get class() {
+    return this.enabled && !this.width;
+  }
+
+  @HostBinding('style.max-width')
+  get maxWidth() {
+    return this.enabled && this.width ? this.width || '170px' : undefined;
+  }
+
+  constructor(private cdRef: ChangeDetectorRef, private elRef: ElementRef) {}
+
+  ngAfterViewInit() {
+    this.title = this.title || (this.elRef.nativeElement as HTMLElement).innerText;
+    this.cdRef.detectChanges();
+  }
+}

npm/ng-packs/packages/theme-shared/src/lib/directives/index.ts

@@ -2,3 +2,4 @@ export * from './loading.directive';
 export * from './ngx-datatable-default.directive';
 export * from './ngx-datatable-list.directive';
 export * from './table-sort.directive';
+export * from './ellipsis.directive';