create-sitecore-jss 22.2.0-canary.30 → 22.2.0-canary.31

package/dist/templates/angular-xmcloud/src/app/components/link-list/link-list.component.html

@@ -0,0 +1,17 @@
+<div class="component link-list {{ styles }}" [attr.id]="id">
+  <div class="component-content">
+    <ng-container *ngIf="title; else defaultTitle">
+      <h3 *scText="title"></h3>
+    </ng-container>    
+    <ul>
+      <li *ngFor="let fieldLink of fieldLinks;index as i" [ngClass]="getFieldLinkClass(i)" >
+        <div class="field-link">
+          <a *scLink="fieldLink"></a>
+        </div>
+      </li>
+    </ul>
+  </div>
+  <ng-template #defaultTitle>
+    <span class="is-empty-hint">Link list</span>
+  </ng-template>
+</div>

package/dist/templates/angular-xmcloud/src/app/components/link-list/link-list.component.ts

@@ -0,0 +1,36 @@
+import { Component, OnInit } from '@angular/core';
+import { SxaComponent } from '../sxa.component';
+import { Field, LinkField, SxaLinkListFields } from '@sitecore-jss/sitecore-jss-angular';
+
+@Component({
+  selector: 'app-link-list',
+  templateUrl: './link-list.component.html',
+})
+export class LinkListComponent extends SxaComponent<SxaLinkListFields> implements OnInit {
+  title?: Field<string>;
+  fieldLinks: LinkField[] = [];
+
+  getFieldLinkClass(index: number): string {
+    let className = `item${index}`;
+    className += (index + 1) % 2 == 0 ? ' even' : ' odd';
+    if (index === 0) {
+      className += ' first';
+    }
+    if (index + 1 === this.fieldLinks.length) {
+      className += ' last';
+    }
+    return className;
+  }
+
+  ngOnInit() {
+    super.ngOnInit();
+    const datasource = this.rendering.fields?.data?.datasource;
+    if (datasource) {
+      this.title = datasource.field?.title as Field<string>;
+      datasource.children.results.forEach(item => {
+        if (item.field?.link)
+          this.fieldLinks.push(item.field.link as LinkField);
+      });
+    }
+  }
+}

package/dist/templates/angular-xmcloud/src/app/components/sxa.component.ts

@@ -1,9 +1,9 @@
 import { OnInit, Input, Directive } from '@angular/core';
-import { ComponentRendering } from '@sitecore-jss/sitecore-jss-angular';
+import { ComponentFields, ComponentRendering } from '@sitecore-jss/sitecore-jss-angular';
 
 @Directive()
-export abstract class SxaComponent implements OnInit {
-  @Input() rendering: ComponentRendering;
+export abstract class SxaComponent<FieldType = ComponentFields> implements OnInit {
+  @Input() rendering: ComponentRendering<FieldType>;
 
   id?: string;
   styles?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-sitecore-jss",
-  "version": "22.2.0-canary.30",
+  "version": "22.2.0-canary.31",
   "description": "Sitecore JSS initializer",
   "bin": "./dist/index.js",
   "scripts": {
@@ -63,5 +63,5 @@
     "ts-node": "^10.9.1",
     "typescript": "~4.9.5"
   },
-  "gitHead": "d08b137fb78470b40970e3d7210806f1c954d0e7"
+  "gitHead": "7fba0bcdf1dc62589ca6fe799ad6b307d4dd1672"
 }