fix: input-carousel

.gitignore

@@ -5,6 +5,7 @@
 /tmp
 /out-tsc
 /.angular
+/.firebase
 
 # dependencies
 /node_modules

apps/doc/src/app/components/input/input-carousel/examples/carousel-array-of-objects-example/carousel-array-of-objects-example.component.html

@@ -1,10 +1,10 @@
-<!--<prizm-input-layout [label]="'Карусель'" [size]="'l'" [outer]="true" [position]="'center'">-->
-<!-- <prizm-input-carousel-->
-<!-- [required]="true"-->
-<!-- [carouselContent]="arrayWithObjects"-->
-<!-- [ngModel]="arrayWithObjects.set[0]"-->
-<!-- >-->
-<!-- {{ arrayWithObjects.currentValue.title }}-->
-<!-- </prizm-input-carousel>-->
-<!-- <ng-template prizmInputStatusText>Текст статуса</ng-template>-->
-<!--</prizm-input-layout>-->
+<prizm-input-layout [label]="'Карусель'" [size]="'l'" [outer]="true" [position]="'center'">
+ <prizm-input-carousel
+ [required]="true"
+ [carouselContent]="arrayWithObjects"
+ [ngModel]="arrayWithObjects.set[0]"
+ >
+ {{ arrayWithObjects.currentValue?.title }}
+ </prizm-input-carousel>
+ <ng-template prizmInputStatusText>Текст статуса</ng-template>
+</prizm-input-layout>

apps/doc/src/app/components/input/input-carousel/examples/carousel-array-of-objects-example/carousel-array-of-objects-example.component.ts

@@ -32,6 +32,6 @@ export class PrizmInputCarouselArrayOfObjectsExampleComponent {
  description: 'description 3',
  },
  ],
- (item, el) => item.id === el.id
+ (item, el) => item?.id === el?.id
  );
 }

libs/components/src/lib/components/input/carousel/carousel-auxiliary-left.component.ts

@@ -1,7 +1,7 @@
 import { Component, Input } from '@angular/core';
 
 import { PrizmCarouselComponent } from './carousel.component';
-import { PrizmInputCarouselComponent } from './input-carousel.component';
+
 /**
  * @deprecated
  * use PrizmInputCarouselAuxiliaryLeftComponent

libs/components/src/lib/components/input/carousel/input-carousel-auxiliary-left.component.ts

@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core';
-import { PrizmInputCarouselComponent } from './input-carousel.component';
+import { PrizmInputCarousel } from './types';
 
 @Component({
  selector: 'prizm-input-carousel-auxiliary-left',
@@ -29,5 +29,5 @@ import { PrizmInputCarouselComponent } from './input-carousel.component';
  ],
 })
 export class PrizmInputCarouselAuxiliaryLeftComponent {
- @Input() carousel: PrizmInputCarouselComponent;
+ @Input() carousel: PrizmInputCarousel;
 }

libs/components/src/lib/components/input/carousel/input-carousel-auxiliary-right.component.ts

@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core';
-import { PrizmInputCarouselComponent } from './input-carousel.component';
+import { PrizmInputCarousel } from './types';
 
 @Component({
  selector: 'prizm-input-carousel-auxiliary-right',
@@ -29,5 +29,5 @@ import { PrizmInputCarouselComponent } from './input-carousel.component';
  ],
 })
 export class PrizmInputCarouselAuxiliaryRightComponent {
- @Input() carousel: PrizmInputCarouselComponent;
+ @Input() carousel: PrizmInputCarousel;
 }

libs/components/src/lib/components/input/carousel/input-carousel.component.html

@@ -4,10 +4,10 @@
 
 <ng-template #emptyTpl>&nbsp;</ng-template>
 
-<!--<ng-container *prizmInputLayoutLeft>-->
-<!-- <prizm-input-carousel-auxiliary-left [carousel]="this"> </prizm-input-carousel-auxiliary-left>-->
-<!--</ng-container>-->
+<ng-container *prizmInputLayoutLeft>
+ <prizm-input-carousel-auxiliary-left [carousel]="this"> </prizm-input-carousel-auxiliary-left>
+</ng-container>
 
-<!--<ng-container *prizmInputLayoutRight>-->
-<!-- <prizm-input-carousel-auxiliary-right [carousel]="this"> </prizm-input-carousel-auxiliary-right>-->
-<!--</ng-container>-->
+<ng-container *prizmInputLayoutRight>
+ <prizm-input-carousel-auxiliary-right [carousel]="this"> </prizm-input-carousel-auxiliary-right>
+</ng-container>

libs/components/src/lib/components/input/carousel/input-carousel.component.ts

@@ -17,6 +17,7 @@ import { PrizmInputControl } from '../common/base/input-control.class';
 import { PrizmInputCarouselContent } from './carousel-content/carousel-content.interface';
 import { PrizmInputNgControl } from '../common';
 import { takeUntil, tap } from 'rxjs/operators';
+import { PrizmInputCarousel } from './types';
 
 @Component({
  selector: 'prizm-input-carousel',
@@ -42,7 +43,10 @@ import { takeUntil, tap } from 'rxjs/operators';
  '[attr.tabindex]': "disabled ? null : '0'",
  },
 })
-export class PrizmInputCarouselComponent extends PrizmInputNgControl<any> implements ControlValueAccessor {
+export class PrizmInputCarouselComponent
+ extends PrizmInputNgControl<any>
+ implements ControlValueAccessor, PrizmInputCarousel
+{
  @HostBinding('attr.data-testid')
  readonly testId = 'ui-area--carousel';
  @Input() carouselContent: PrizmInputCarouselContent;

libs/components/src/lib/components/input/carousel/types.ts

@@ -0,0 +1,11 @@
+import { PrizmInputCarouselContent } from './carousel-content';
+
+export interface PrizmInputCarousel {
+ carouselContent: PrizmInputCarouselContent;
+ lightMode: boolean;
+ disabled: boolean;
+ stepLeft(): void;
+ left(): void;
+ stepRight(): void;
+ right(): void;
+}