migrate to nx 18.0.5

apps/demo/src/app/database/database.page.html

@@ -1,8 +1,7 @@
 <sio-page [title]="'Task ('+this.taskState.localTotals+'/'+this.taskState.remoteTotals+') index' + this.taskState.remoteIndex">
-  <sio-list [sioData]="this.taskState"
+  <sio-datalist [data]="this.taskState"
     header="name"
     label="description"
-    [data]="this.taskState.selectAll()"
     thumbnail="thumbnail"
     LeftSwipe
     [infinite]="this.taskState.localTotals < this.taskState.remoteTotals"

apps/demo/src/app/database/database.page.ts

@@ -45,12 +45,9 @@ export class DatabasePageComponent {
 
   public load(event: Record<string, number | string>):void {
     this.sioCoreLoggerService.debug('[DatabasePageComponent][load]', event);
-    this.taskState.load();
   }
 
   public refresh(event: Event): void {
     this.sioCoreLoggerService.debug('[DatabasePageComponent][refresh]', event);
-    this.taskState.setRemoteIndex('');
-    this.taskState.load();
   }
 }

libs/core/src/lib/components/list/list.component.ts

@@ -23,13 +23,13 @@ export class SioCoreListComponent implements OnInit {
   @Input() public desktop = false;
 
   @AttributeBoolean()
-  @Input() public infinite: InputBoolean = false;
+  @Input() public enableInfinite: InputBoolean = false;
 
   @AttributeBoolean()
-  @Input() public LeftSwipe: InputBoolean;
+  @Input() public enableLeftSwipe: InputBoolean;
 
   @AttributeBoolean()
-  @Input() public RightSwipe: InputBoolean = true;
+  @Input() public enableRightSwipe: InputBoolean = true;
 
   @Input() public header = 'name';
   @Input() public label = 'description';
@@ -39,11 +39,11 @@ export class SioCoreListComponent implements OnInit {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   @Input() public data: any[] | undefined;
 
-  @Output() sioCoreListItemClick = new EventEmitter<Record<string, number | string>>();
-  @Output() sioCoreListItemLeftSwipe  = new EventEmitter<Record<string, number | string>>();
-  @Output() sioCoreListItemRightSwipe = new EventEmitter<Record<string, number | string>>();
-  @Output() sioCoreListInfinite = new EventEmitter<Record<string, number | string>>();
-  @Output() sioCoreRefreshList = new EventEmitter<void>();
+  @Output() clickItem = new EventEmitter<Record<string, number | string>>();
+  @Output() leftSwipe  = new EventEmitter<Record<string, number | string>>();
+  @Output() rightSwipe = new EventEmitter<Record<string, number | string>>();
+  @Output() infinite = new EventEmitter<Record<string, number | string>>();
+  @Output() refresh = new EventEmitter<void>();
 
   // @Output() public sioCoreMenuDidChange = new EventEmitter();
 
@@ -74,26 +74,26 @@ export class SioCoreListComponent implements OnInit {
     return itemObject.id;
   }
 
-  public receiveListLeftSwipe(data: Record<string, number | string>) {
+  public onLeftSwipe(data: Record<string, number | string>) {
     this.sioCoreLoggerService.debug('[sioCoreListItemComponent][receiveListLeftSwipe]', data);
-    this.sioCoreListItemLeftSwipe.emit(data);
+    this.leftSwipe.emit(data);
   }
-  public receiveListRighSwipe(data: Record<string, number | string>) {
+  public onRighSwipe(data: Record<string, number | string>) {
     this.sioCoreLoggerService.debug('[sioCoreListItemComponent][receiveListRightSwipe]', data);
-    this.sioCoreListItemRightSwipe.emit(data);
+    this.rightSwipe.emit(data);
   }
 
   public onRefresh(data: Event) {
     this.sioCoreLoggerService.debug('[sioCoreListItemComponent][onRefresh]', data);
-    this.sioCoreRefreshList.emit();
+    this.refresh.emit();
     setTimeout(() => {
       (data as RefresherCustomEvent).target.complete();
     }, 500);
   }
 
-  public onListInfinite(data: Event) {
+  public onInfinite(data: Event) {
     this.sioCoreLoggerService.debug('[sioCoreListItemComponent][receiveListInfinite]', data);
-    this.sioCoreListInfinite.emit({ LastId : this.data!.pop().$id });
+    this.infinite.emit({ LastId : this.data!.pop().$id });
     setTimeout(() => {
       (data as InfiniteScrollCustomEvent).target.complete();
     }, 500);

libs/database/src/lib/components/data-list/data-list.component.html

@@ -0,0 +1,12 @@
+<sio-list
+  [data]="this.store.selectAll()"
+  [header]="this.header"
+  [label]="this.label"
+  [thumbnail]="this.thumbnail"
+  [LeftSwipe]="this.LeftSwipe"
+  [infinite]="this.infinite"
+  (sioCoreListItemLeftSwipe)="this.sioCoreItemLeftSwipe($event)"
+  (sioCoreListItemRightSwipe)="this.sioCoreItemRightSwipe($event)"
+  (sioCoreListInfinite)="this.sioCoreListInfinite($event)"
+  (sioRefreshList)="(this.re)"
+></sio-list>

libs/database/src/lib/components/data-list/data-list.component.ts

@@ -0,0 +1,106 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { SioCoreLoggerService, SioColorType } from '@silicia/core';
+import { AttributeBoolean } from '@angular-ru/cdk/decorators';
+import { InputBoolean } from '@angular-ru/cdk/typings';
+import {
+  InfiniteScrollCustomEvent,
+  RefresherCustomEvent,
+} from '@ionic/angular';
+import { SioDatabaseState } from '../../store';
+
+@Component({
+  selector: 'sio-datalist',
+  templateUrl: './list.component.html',
+  styleUrls: ['./list.component.scss'],
+})
+export class SioDatabaseListComponent implements OnInit {
+  // input related to this component
+  @Input() public store: SioDatabaseState<never> | undefined = undefined;
+
+  // Wrapped input for subcomponents
+
+  @Input() public id = 'main';
+  @Input() public lines: 'full' | 'inset' | 'none' = 'none';
+  //@Input() public shape: 'line' | 'dot' | 'rounded' = 'line';
+  @Input() public position: 'side' | 'bottom' | 'top' = 'side';
+  @Input() public color: SioColorType;
+  @Input() public toggleIconSlot: 'start' | 'end' = 'end';
+  @Input() public toggleIcon = 'chevron-up-outline';
+  @Input() public shape: 'compact' | 'inset' = 'compact';
+  @Input() public style: 'default' | 'rounded' | 'custom' = 'default';
+  @Input() public desktop = false;
+
+  @AttributeBoolean()
+  @Input()
+  public infinite: InputBoolean = false;
+
+  @AttributeBoolean()
+  @Input()
+  public enableLeftSwipe: InputBoolean;
+
+  @AttributeBoolean()
+  @Input()
+  public enableRightSwipe: InputBoolean = true;
+
+  @Input() public header = 'name';
+  @Input() public label = 'description';
+  @Input() public icon: string | undefined;
+  @Input() public avatar: string | undefined;
+  @Input() public thumbnail: string | undefined;
+
+  @Output() Click = new EventEmitter<Record<string, number | string>>();
+  @Output() LeftSwipe = new EventEmitter<Record<string, number | string>>();
+  @Output() RightSwipe = new EventEmitter<Record<string, number | string>>();
+  @Output() Infinite = new EventEmitter<Record<string, number | string>>();
+  @Output() Refresh = new EventEmitter<Record<string, number | string>>();
+
+  constructor(private sioCoreLoggerService: SioCoreLoggerService) {
+    this.sioCoreLoggerService.debug('[SioDatabaseListComponent][constructor]');
+  }
+
+  ngOnInit(): void {
+    this.sioCoreLoggerService.debug('[SioDatabaseListComponent][ngOnInit]');
+  }
+
+  public onLeftSwipe(data: Record<string, number | string>) {
+    this.sioCoreLoggerService.debug(
+      '[SioDatabaseListComponent][onLeftSwipe]',
+      data,
+    );
+    this.LeftSwipe.emit(data);
+  }
+  public onRighSwipe(data: Record<string, number | string>) {
+    this.sioCoreLoggerService.debug(
+      '[SioDatabaseListComponent][onRightSwipe]',
+      data,
+    );
+    this.RightSwipe.emit(data);
+  }
+
+  public onRefresh(data: Event) {
+    this.sioCoreLoggerService.debug(
+      '[SioDatabaseListComponent][onRefresh]',
+      data,
+    );
+    if (this.store) this.store.load();
+    this.Refresh.emit();
+    setTimeout(() => {
+      (data as RefresherCustomEvent).target.complete();
+    }, 500);
+  }
+
+  public onInfinite(data: Event) {
+    this.sioCoreLoggerService.debug(
+      '[sioDatabaseListComponent][onInfinite]',
+      data,
+    );
+    this.Infinite.emit({ LastId: this.store!.pop().$id });
+    if (this.store) {
+      this.store.setRemoteIndex('');
+      this.store.load();
+    }
+    setTimeout(() => {
+      (data as InfiniteScrollCustomEvent).target.complete();
+    }, 500);
+  }
+}

libs/database/src/lib/components/data-list/index.ts

@@ -0,0 +1 @@
+export * from './data-list.component';