diff --git a/apps/e2e/karma-ci.conf.js b/apps/e2e/karma-ci.conf.js index 8e4754b..698a642 100644 --- a/apps/e2e/karma-ci.conf.js +++ b/apps/e2e/karma-ci.conf.js @@ -1,7 +1,3 @@ module.exports = function (config) { - require('../../karma.conf')( - config, - require('path').join(__dirname, '../../coverage/e2e'), - true - ); + require('../../karma.conf')(config, 'e2e', true); }; diff --git a/apps/e2e/karma.conf.js b/apps/e2e/karma.conf.js index 4d6a0cc..3238eb9 100644 --- a/apps/e2e/karma.conf.js +++ b/apps/e2e/karma.conf.js @@ -1,7 +1,3 @@ module.exports = function (config) { - require('../../karma.conf')( - config, - require('path').join(__dirname, '../../coverage/e2e'), - false - ); + require('../../karma.conf')(config, 'e2e', false); }; diff --git a/apps/e2e/src/app/app.component.html b/apps/e2e/src/app/app.component.html index 18abd26..aeba865 100644 --- a/apps/e2e/src/app/app.component.html +++ b/apps/e2e/src/app/app.component.html @@ -1,12 +1,14 @@
diff --git a/apps/e2e/src/app/example-with-handles/example-with-handles.component.html b/apps/e2e/src/app/example-with-handles/example-with-handles.component.html index 59cdf31..3f60745 100644 --- a/apps/e2e/src/app/example-with-handles/example-with-handles.component.html +++ b/apps/e2e/src/app/example-with-handles/example-with-handles.component.html @@ -19,14 +19,12 @@

Keyboard Sort Example With Handles

kbdSortListOrientation="vertical" [cdkDropListData]="items" [kbdSortListData]="items"> -
  • -
    {{ item }}
    -
    🐶
    - 😇 active! - 😊 focused. -
  • + @for (item of items; track item; let i = $index) { +
  • +
    {{ item }}
    +
    🐶
    + 😇 active! + 😊 focused. +
  • + } diff --git a/apps/e2e/src/app/example-with-handles/example-with-handles.component.ts b/apps/e2e/src/app/example-with-handles/example-with-handles.component.ts index 73335d5..5a0878b 100644 --- a/apps/e2e/src/app/example-with-handles/example-with-handles.component.ts +++ b/apps/e2e/src/app/example-with-handles/example-with-handles.component.ts @@ -45,8 +45,6 @@ export class ExampleWithHandlesComponent { public drop($event: CdkDragDrop) { moveItemInArray(this.items, $event.previousIndex, $event.currentIndex); } - - protected trackByFn = (_: number, item: string) => item; } export default ExampleWithHandlesComponent; diff --git a/apps/e2e/src/app/example/example.component.html b/apps/e2e/src/app/example/example.component.html index edf93ab..0179883 100644 --- a/apps/e2e/src/app/example/example.component.html +++ b/apps/e2e/src/app/example/example.component.html @@ -13,17 +13,15 @@

    Keyboard Sort Example

    kbdSortListOrientation="horizontal" [cdkDropListData]="items" [kbdSortListData]="items"> -
  • - {{ item }} - 🤌 - 🫴 -
  • + @for (item of items; track item; let i = $index) { +
  • + {{ item }} + 🤌 + 🫴 +
  • + } diff --git a/apps/e2e/src/app/example/example.component.ts b/apps/e2e/src/app/example/example.component.ts index fc97a65..db11bce 100644 --- a/apps/e2e/src/app/example/example.component.ts +++ b/apps/e2e/src/app/example/example.component.ts @@ -34,8 +34,6 @@ export class ExampleComponent { public drop($event: CdkDragDrop) { moveItemInArray(this.items, $event.previousIndex, $event.currentIndex); } - - protected trackByFn = (_: number, item: string) => item; } export default ExampleComponent; diff --git a/karma.conf.js b/karma.conf.js index 40729d8..7bbf37d 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -27,7 +27,7 @@ module.exports = function (config, coverageDir, isCi) { suppressAll: true, // removes the duplicated traces }, coverageReporter: { - dir: coverageDir, + dir: __dirname + '/coverage/' + coverageDir, subdir: '.', reporters: isCi ? [{ type: 'text' }] diff --git a/libs/ng-keyboard-sort/karma-ci.conf.js b/libs/ng-keyboard-sort/karma-ci.conf.js index f958bd3..a42259f 100644 --- a/libs/ng-keyboard-sort/karma-ci.conf.js +++ b/libs/ng-keyboard-sort/karma-ci.conf.js @@ -1,7 +1,3 @@ module.exports = function (config) { - require('../../karma.conf')( - config, - require('path').join(__dirname, '../../coverage/ng-keyboard-sort'), - true - ); + require('../../karma.conf')(config, 'ng-keyboard-sort', true); }; diff --git a/libs/ng-keyboard-sort/karma.conf.js b/libs/ng-keyboard-sort/karma.conf.js index 65dc755..eb93458 100644 --- a/libs/ng-keyboard-sort/karma.conf.js +++ b/libs/ng-keyboard-sort/karma.conf.js @@ -1,7 +1,3 @@ module.exports = function (config) { - require('../../karma.conf')( - config, - require('path').join(__dirname, '../../coverage/ng-keyboard-sort'), - false - ); + require('../../karma.conf')(config, 'ng-keyboard-sort', false); }; diff --git a/libs/ng-keyboard-sort/src/lib/fixtures/keyboard-sort-list-fixture.component.ts b/libs/ng-keyboard-sort/src/lib/fixtures/keyboard-sort-list-fixture.component.ts index b969ce0..d85ee55 100644 --- a/libs/ng-keyboard-sort/src/lib/fixtures/keyboard-sort-list-fixture.component.ts +++ b/libs/ng-keyboard-sort/src/lib/fixtures/keyboard-sort-list-fixture.component.ts @@ -23,14 +23,13 @@ import { KeyboardSortEventDrop } from '../keyboard-sort-event-drop'; [kbdSortListOrientation]="direction" [kbdSortListDisabled]="disabled" (kdbSortDrop)="sortDrop($event)"> -
  • - {{ item }} - {{ ' ' }}Active - {{ ' ' }}Focused -
  • + @for (item of data || []; track item; let i = $index) { +
  • + {{ item }} + {{ ' ' }}Active + {{ ' ' }}Focused +
  • + }
    @@ -55,6 +54,4 @@ export class KeyboardSortListFixtureComponent { public sortDrop($event: KeyboardSortEventDrop) { this.drops.push($event); } - - protected trackByFn = (_: number, item: string) => item; } diff --git a/libs/ng-keyboard-sort/src/lib/keyboard-sort-item.directive.ts b/libs/ng-keyboard-sort/src/lib/keyboard-sort-item.directive.ts index 19b92c7..152ac66 100644 --- a/libs/ng-keyboard-sort/src/lib/keyboard-sort-item.directive.ts +++ b/libs/ng-keyboard-sort/src/lib/keyboard-sort-item.directive.ts @@ -12,7 +12,7 @@ import { Output, QueryList, } from '@angular/core'; -import { concatWith, of, Subscription } from 'rxjs'; +import { Subscription } from 'rxjs'; import { KeyboardSortHandleDirective } from './keyboard-sort-handle.directive'; import { KeyboardSortListService } from './keyboard-sort-list.service'; import { KeyboardSortItemService } from './keyboard-sort-item.service'; @@ -50,11 +50,13 @@ export class KeyboardSortItemDirective return this.#activated; } public set activated(value: boolean) { - if (value && this.focused) { - this.focused = false; + if (this.#activated !== value) { + if (value && this.focused) { + this.focused = false; + } + this.#activated = value; + this.kbdSortItemActivated.emit(value); } - this.#activated = value; - this.kbdSortItemActivated.emit(value); } public get focused(): boolean { @@ -102,7 +104,6 @@ export class KeyboardSortItemDirective #kbdSortItemDisabled = false; #activated = false; #focused = false; - #hasHandles = false; constructor() { this.#itemService.item = this; @@ -112,15 +113,6 @@ export class KeyboardSortItemDirective if (this.activated) { this.activated = true; } - if (this.handles) { - this.#subscriptions.add( - of(this.handles) - .pipe(concatWith(this.handles.changes)) - .subscribe((handles: QueryList) => { - this.#hasHandles = handles.length > 0; - }) - ); - } } public ngOnDestroy(): void { diff --git a/libs/ng-keyboard-sort/src/lib/keyboard-sort-list.directive.ts b/libs/ng-keyboard-sort/src/lib/keyboard-sort-list.directive.ts index 7d9bfeb..185caaa 100644 --- a/libs/ng-keyboard-sort/src/lib/keyboard-sort-list.directive.ts +++ b/libs/ng-keyboard-sort/src/lib/keyboard-sort-list.directive.ts @@ -1,6 +1,5 @@ import { AfterViewInit, - ApplicationRef, ChangeDetectorRef, ContentChildren, Directive, @@ -57,7 +56,6 @@ export class KeyboardSortListDirective @Output() public readonly kdbSortDrop = new EventEmitter(); - readonly #appRef = inject(ApplicationRef); readonly #changeDetectorRef = inject(ChangeDetectorRef); #focusKeyManager: FocusKeyManager | undefined; readonly #focusMonitor = inject(FocusMonitor); @@ -193,12 +191,8 @@ export class KeyboardSortListDirective public deactivateAll(except?: number): void { this.items?.forEach((item) => { if (item.position !== except) { - if (item.activated) { - item.activated = false; - } - if (item.focused) { - item.focused = false; - } + item.activated = false; + item.focused = false; } }); }