feat(addon-commerce): ThumbnailCard add <img> support (#8789)

projects/addon-commerce/components/thumbnail-card/thumbnail-card.template.html

@@ -17,6 +17,9 @@
             [icon]="iconEnd"
         />
     </div>
+    <div class="t-left t-icon">
+        <ng-content select="img" />
+    </div>
     <ng-content />
     <ng-container *ngIf="paymentSystem">
         <tui-icon

projects/demo/src/modules/components/thumbnail-card/examples/4/index.html

@@ -0,0 +1,7 @@
+<tui-thumbnail-card
+    iconEnd="@tui.user"
+    paymentSystem="visa"
+>
+    <img src="https://brands-prod.cdn-tinkoff.ru/general_logo/sber.png" />
+    1234
+</tui-thumbnail-card>

projects/demo/src/modules/components/thumbnail-card/examples/4/index.less

@@ -0,0 +1,4 @@
+:host {
+    display: flex;
+    gap: 1rem;
+}

projects/demo/src/modules/components/thumbnail-card/examples/4/index.ts

@@ -0,0 +1,15 @@
+import {NgFor} from '@angular/common';
+import {Component} from '@angular/core';
+import {changeDetection} from '@demo/emulate/change-detection';
+import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiThumbnailCard} from '@taiga-ui/addon-commerce';
+
+@Component({
+    standalone: true,
+    imports: [TuiThumbnailCard, NgFor],
+    templateUrl: './index.html',
+    styleUrls: ['./index.less'],
+    encapsulation,
+    changeDetection,
+})
+export default class Example {}

projects/demo/src/modules/components/thumbnail-card/index.ts

@@ -14,7 +14,13 @@ import type {TuiSizeL, TuiSizeS} from '@taiga-ui/core';
     changeDetection,
 })
 export default class Example {
-    protected readonly examples = ['Sizes', 'A cool one', 'Backgrounds'];
+    protected readonly examples = [
+        'Sizes',
+        'A cool one',
+        'Backgrounds',
+        'External colored icon',
+    ];
+
     protected readonly iconVariants = ['', '@tui.lock', '@tui.cloud', '@tui.user'];
     protected iconStart = this.iconVariants[0]!;
     protected iconEnd = this.iconVariants[0]!;