@ifsworld/granite-components 16.1.2 → 17.0.0

package/README.md

@@ -44,8 +44,6 @@ Finally, add them in `src/styles.scss`:
 
 [StackBlitz Example](https://stackblitz.com/edit/angular-ivy-zcgdkv?file=src/app/app.component.html)
 
-**Note: currrently there's an issue with the _Ivy compiler_. To get the project to work, the Ivy Compiler must be set to disabled in `tsconfig.json`!**
-
 ### Support
 
 _Note: we only support our latest release. Beyond that we make no guarantees of continued support. Make sure to stay up to date._

package/carousel/index.d.ts

@@ -1,2 +1,45 @@
-export * from './lib/carousel.module';
-export * from './lib/carousel.component';
+import * as i0 from '@angular/core';
+import { OnChanges, AfterViewInit, OnDestroy, TemplateRef, SimpleChanges } from '@angular/core';
+import * as i3 from 'primeng/carousel';
+import { CarouselResponsiveOptions, Carousel } from 'primeng/carousel';
+import * as i2 from '@angular/common';
+import * as i4 from '@ifsworld/granite-components';
+
+declare class GraniteCarouselComponent<T> implements OnChanges, AfterViewInit, OnDestroy {
+    items: T[];
+    responsiveOptions: CarouselResponsiveOptions[];
+    numVisible: number;
+    numScroll: number;
+    circular: boolean;
+    prevButtonAriaLabel: string;
+    nextButtonAriaLabel: string;
+    shrinkToContent: boolean;
+    itemTemplateRef: TemplateRef<any>;
+    carousel: Carousel;
+    visibleItems: T[];
+    isOneItemVisible: boolean;
+    private cdr;
+    private resizeObserver;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    onResize(): void;
+    onKeyDown(event: KeyboardEvent): void;
+    navForward(event: MouseEvent): void;
+    navBackward(event: MouseEvent): void;
+    ngOnDestroy(): void;
+    private triggerUpdate;
+    private handleResize;
+    private getDisplayItems;
+    private updateVisibleItems;
+    private updateNumVisibleBasedOnWidth;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GraniteCarouselComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GraniteCarouselComponent<any>, "granite-carousel", never, { "items": { "alias": "items"; "required": false; }; "responsiveOptions": { "alias": "responsiveOptions"; "required": false; }; "numVisible": { "alias": "numVisible"; "required": false; }; "numScroll": { "alias": "numScroll"; "required": false; }; "circular": { "alias": "circular"; "required": false; }; "prevButtonAriaLabel": { "alias": "prevButtonAriaLabel"; "required": false; }; "nextButtonAriaLabel": { "alias": "nextButtonAriaLabel"; "required": false; }; "shrinkToContent": { "alias": "shrinkToContent"; "required": false; }; }, {}, ["itemTemplateRef"], never, false, never>;
+}
+
+declare class GraniteCarouselModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<GraniteCarouselModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<GraniteCarouselModule, [typeof GraniteCarouselComponent], [typeof i2.CommonModule, typeof i3.CarouselModule, typeof i4.GraniteButtonModule, typeof i4.GraniteIconModule], [typeof GraniteCarouselComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<GraniteCarouselModule>;
+}
+
+export { GraniteCarouselComponent, GraniteCarouselModule };

package/date-picker/index.d.ts

@@ -1,4 +1,123 @@
-export * from './lib/date-picker.module';
-export * from './lib/date-picker.component';
-export * from './lib/date-range-picker.component';
-export * from './lib/date-picker-trigger-for.directive';
+import * as i0 from '@angular/core';
+import { OnInit, EventEmitter, TemplateRef, ElementRef, OnChanges, SimpleChanges, AfterContentInit, OnDestroy } from '@angular/core';
+import { Direction } from '@angular/cdk/bidi';
+import * as i8 from '@ifsworld/granite-components';
+import { ClientInputInterface, ClientOutputInterface } from '@ifsworld/granite-components';
+import { PrimeNG } from 'primeng/config';
+import * as i9 from '@angular/cdk/a11y';
+import { FocusOrigin } from '@angular/cdk/a11y';
+import * as i4 from '@angular/common';
+import * as i5 from '@angular/cdk/overlay';
+import * as i6 from 'primeng/datepicker';
+import * as i7 from '@angular/forms';
+
+type PositionX = 'before' | 'after';
+type PositionY = 'above' | 'below';
+/** Base class with common functionality for date/date-range pickers. */
+declare class _DatePickerBase implements OnInit {
+    minDate: Date | null;
+    maxDate: Date | null;
+    firstDayOfWeek: number;
+    readonly pickerClosed: EventEmitter<any>;
+    templateRef: TemplateRef<any>;
+    _elementRef: ElementRef<any>;
+    primeNG: PrimeNG;
+    xPosition: PositionX;
+    yPosition: PositionY;
+    direction: Direction;
+    /**
+     * Used for locating the panel in tests and setting the aria-control attribute
+     * for the picker trigger.
+     */
+    readonly panelId: string;
+    /** Client input device information */
+    clientInput: ClientInputInterface;
+    /** Client output device information */
+    clientOutput: ClientOutputInterface;
+    ngOnInit(): void;
+    _handleKeydown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<_DatePickerBase, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_DatePickerBase, never, never, { "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; }; }, { "pickerClosed": "pickerClosed"; }, never, never, false, never>;
+}
+
+declare class GraniteDatePickerComponent extends _DatePickerBase {
+    selectedDate: Date | undefined;
+    readonly selectionChanged: EventEmitter<Date>;
+    dateSelectionChanged(newDate: Date): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GraniteDatePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GraniteDatePickerComponent, "granite-date-picker", never, { "selectedDate": { "alias": "selectedDate"; "required": false; }; }, { "selectionChanged": "selectionChanged"; }, never, never, false, never>;
+}
+
+declare class GraniteDateRangePickerComponent extends _DatePickerBase implements OnChanges {
+    selectedDateRange: Date[];
+    readonly selectionChanged: EventEmitter<Date[]>;
+    _selectedDateRangeInternal: Date[];
+    ngOnChanges(changes: SimpleChanges): void;
+    dateRangeSelectionChanged(date: Date): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GraniteDateRangePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GraniteDateRangePickerComponent, "granite-date-range-picker", never, { "selectedDateRange": { "alias": "selectedDateRange"; "required": false; }; }, { "selectionChanged": "selectionChanged"; }, never, never, false, never>;
+}
+
+declare class GraniteDatePickerTriggerForDirective implements AfterContentInit, OnDestroy {
+    /** References the picker instance that the trigger is associated with. */
+    picker: GraniteDatePickerComponent | GraniteDateRangePickerComponent;
+    _clientInput: ClientInputInterface;
+    _clientOutput: ClientOutputInterface;
+    /** Whether the associated picker is open */
+    _isPickerOpen: boolean;
+    private _overlay;
+    private _element;
+    private _viewContainerRef;
+    private _outsideClickDispatcher;
+    private _dir;
+    private _focusMonitor;
+    private _pickerCloseSubscription;
+    private _portal;
+    private _overlayRef;
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
+    isOpen(): boolean;
+    openPicker(): void;
+    /** Toggles the picker between the open and closed states. */
+    togglePicker(): void;
+    /** Close the associated picker */
+    closePicker(): void;
+    /** Handles key presses on the trigger. */
+    _handleKeydown(event: KeyboardEvent): void;
+    /** Handles click events on the trigger. */
+    _handleClick(): void;
+    /**
+     * Restores focus to the element that was focused before the picker was open.
+     */
+    _restoreFocus(origin?: FocusOrigin, options?: FocusOptions): void;
+    /**
+     * Returns strategy for positioning the overlay for desktop devices:
+     */
+    private _desktopPositionStrategy;
+    /**
+     * Sets the appropriate positions on a position strategy
+     * so the overlay connects with the trigger correctly.
+     * @param positionStrategy Strategy whose position to update.
+     */
+    private _setPosition;
+    /**
+     * Returns strategy for positioning the overlay depending on what type of
+     * device the picker is being shown on
+     */
+    private _positionStrategy;
+    /**
+     * Returns strategy for positioning the overlay for touch devices:
+     * Place centered in the screen.
+     */
+    private _touchPositionStrategy;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GraniteDatePickerTriggerForDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<GraniteDatePickerTriggerForDirective, "[graniteDatePickerTriggerFor]", never, { "picker": { "alias": "graniteDatePickerTriggerFor"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+declare class GraniteDatePickerModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<GraniteDatePickerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<GraniteDatePickerModule, [typeof GraniteDatePickerComponent, typeof GraniteDateRangePickerComponent, typeof GraniteDatePickerTriggerForDirective], [typeof i4.CommonModule, typeof i5.OverlayModule, typeof i6.DatePickerModule, typeof i7.FormsModule, typeof i8.GraniteIconModule, typeof i8.GraniteButtonModule, typeof i9.A11yModule], [typeof GraniteDatePickerComponent, typeof GraniteDateRangePickerComponent, typeof GraniteDatePickerTriggerForDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<GraniteDatePickerModule>;
+}
+
+export { GraniteDatePickerComponent, GraniteDatePickerModule, GraniteDatePickerTriggerForDirective, GraniteDateRangePickerComponent };

package/fesm2022/ifsworld-granite-components-carousel.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { HostListener, ViewChild, ContentChild, Input, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { inject, ChangeDetectorRef, HostListener, ViewChild, ContentChild, Input, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2 from 'primeng/carousel';
@@ -9,8 +9,7 @@ import * as i4 from '@ifsworld/granite-components';
 import { GraniteButtonModule, GraniteIconModule } from '@ifsworld/granite-components';
 
 class GraniteCarouselComponent {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
         this.items = [];
         this.responsiveOptions = [
             {
@@ -37,6 +36,7 @@ class GraniteCarouselComponent {
         this.shrinkToContent = false;
         this.visibleItems = [];
         this.isOneItemVisible = false;
+        this.cdr = inject(ChangeDetectorRef);
     }
     ngOnChanges(changes) {
         if (changes['items'] && changes['items'].currentValue) {
@@ -124,13 +124,13 @@ class GraniteCarouselComponent {
         }
         this.updateVisibleItems();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCarouselComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCarouselComponent, isStandalone: false, selector: "granite-carousel", inputs: { items: "items", responsiveOptions: "responsiveOptions", numVisible: "numVisible", numScroll: "numScroll", circular: "circular", prevButtonAriaLabel: "prevButtonAriaLabel", nextButtonAriaLabel: "nextButtonAriaLabel", shrinkToContent: "shrinkToContent" }, host: { listeners: { "window:resize": "onResize()" } }, queries: [{ propertyName: "itemTemplateRef", first: true, predicate: ["itemTemplate"], descendants: true }], viewQueries: [{ propertyName: "carousel", first: true, predicate: ["carousel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"carousel-wrapper\">\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isBackwardNavDisabled()\"\n    [attr.aria-label]=\"prevButtonAriaLabel\"\n    (click)=\"navBackward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-left\"></granite-icon>\n  </button>\n\n  <p-carousel\n    #carousel\n    [value]=\"visibleItems\"\n    [numVisible]=\"numVisible\"\n    [numScroll]=\"numScroll\"\n    [circular]=\"circular\"\n    [responsiveOptions]=\"responsiveOptions\"\n    [showNavigators]=\"false\"\n    [showIndicators]=\"false\"\n    [class.auto-width]=\"shrinkToContent\"\n    [class.is-one-item]=\"isOneItemVisible\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n  >\n    <ng-template let-item pTemplate=\"item\">\n      <div class=\"item-template-wrapper\" *ngIf=\"!item.placeholder\">\n        <ng-container\n          *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item }\"\n        ></ng-container>\n      </div>\n    </ng-template>\n  </p-carousel>\n\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isForwardNavDisabled()\"\n    [attr.aria-label]=\"nextButtonAriaLabel\"\n    (click)=\"navForward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-right\"></granite-icon>\n  </button>\n</div>\n", styles: [":host{width:100%;overflow:hidden}.carousel-wrapper{display:flex;justify-content:center;align-items:center;gap:var(--granite-spacing-8);padding:var(--granite-spacing-8);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}p-carousel{flex:1;min-width:0}p-carousel .item-template-wrapper{margin:var(--granite-spacing-4)}.arrow-btn{width:calc(var(--granite-size-base-rem) * 2);height:calc(var(--granite-size-base-rem) * 2)}.arrow-btn granite-icon{font-size:var(--granite-font-size-body);position:relative;top:0}::ng-deep .auto-width .p-carousel-item{flex:0 0 auto!important}::ng-deep .is-one-item .p-carousel-item{flex:1 0 100%!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass", "prevButtonProps", "nextButtonProps"], outputs: ["onPage"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.GraniteButtonComponent, selector: "button[graniteButton],    button[granitePrimaryButton],    button[graniteFlatButton],    button[graniteToolbarButton]  ", inputs: ["disabled", "toggled"], exportAs: ["graniteButton"] }, { kind: "component", type: i4.GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: GraniteCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.9", type: GraniteCarouselComponent, isStandalone: false, selector: "granite-carousel", inputs: { items: "items", responsiveOptions: "responsiveOptions", numVisible: "numVisible", numScroll: "numScroll", circular: "circular", prevButtonAriaLabel: "prevButtonAriaLabel", nextButtonAriaLabel: "nextButtonAriaLabel", shrinkToContent: "shrinkToContent" }, host: { listeners: { "window:resize": "onResize()" } }, queries: [{ propertyName: "itemTemplateRef", first: true, predicate: ["itemTemplate"], descendants: true }], viewQueries: [{ propertyName: "carousel", first: true, predicate: ["carousel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"carousel-wrapper\">\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isBackwardNavDisabled()\"\n    [attr.aria-label]=\"prevButtonAriaLabel\"\n    (click)=\"navBackward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-left\"></granite-icon>\n  </button>\n\n  <p-carousel\n    #carousel\n    [value]=\"visibleItems\"\n    [numVisible]=\"numVisible\"\n    [numScroll]=\"numScroll\"\n    [circular]=\"circular\"\n    [responsiveOptions]=\"responsiveOptions\"\n    [showNavigators]=\"false\"\n    [showIndicators]=\"false\"\n    [class.auto-width]=\"shrinkToContent\"\n    [class.is-one-item]=\"isOneItemVisible\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n  >\n    <ng-template let-item pTemplate=\"item\">\n      <div class=\"item-template-wrapper\" *ngIf=\"!item.placeholder\">\n        <ng-container\n          *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item }\"\n        ></ng-container>\n      </div>\n    </ng-template>\n  </p-carousel>\n\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isForwardNavDisabled()\"\n    [attr.aria-label]=\"nextButtonAriaLabel\"\n    (click)=\"navForward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-right\"></granite-icon>\n  </button>\n</div>\n", styles: [":host{width:100%;overflow:hidden}.carousel-wrapper{display:flex;justify-content:center;align-items:center;gap:var(--granite-spacing-8);padding:var(--granite-spacing-8);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}p-carousel{flex:1;min-width:0}p-carousel .item-template-wrapper{margin:var(--granite-spacing-4)}.arrow-btn{width:calc(var(--granite-size-base-rem) * 2);height:calc(var(--granite-size-base-rem) * 2)}.arrow-btn granite-icon{font-size:var(--granite-font-size-body);position:relative;top:0}::ng-deep .auto-width .p-carousel-item{flex:0 0 auto!important}::ng-deep .is-one-item .p-carousel-item{flex:1 0 100%!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "styleClass", "prevButtonProps", "nextButtonProps"], outputs: ["onPage"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.GraniteButtonComponent, selector: "button[graniteButton],    button[granitePrimaryButton],    button[graniteFlatButton],    button[graniteToolbarButton]  ", inputs: ["disabled", "toggled"], exportAs: ["graniteButton"] }, { kind: "component", type: i4.GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCarouselComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: GraniteCarouselComponent, decorators: [{
             type: Component,
             args: [{ selector: 'granite-carousel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"carousel-wrapper\">\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isBackwardNavDisabled()\"\n    [attr.aria-label]=\"prevButtonAriaLabel\"\n    (click)=\"navBackward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-left\"></granite-icon>\n  </button>\n\n  <p-carousel\n    #carousel\n    [value]=\"visibleItems\"\n    [numVisible]=\"numVisible\"\n    [numScroll]=\"numScroll\"\n    [circular]=\"circular\"\n    [responsiveOptions]=\"responsiveOptions\"\n    [showNavigators]=\"false\"\n    [showIndicators]=\"false\"\n    [class.auto-width]=\"shrinkToContent\"\n    [class.is-one-item]=\"isOneItemVisible\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n  >\n    <ng-template let-item pTemplate=\"item\">\n      <div class=\"item-template-wrapper\" *ngIf=\"!item.placeholder\">\n        <ng-container\n          *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item }\"\n        ></ng-container>\n      </div>\n    </ng-template>\n  </p-carousel>\n\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isForwardNavDisabled()\"\n    [attr.aria-label]=\"nextButtonAriaLabel\"\n    (click)=\"navForward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-right\"></granite-icon>\n  </button>\n</div>\n", styles: [":host{width:100%;overflow:hidden}.carousel-wrapper{display:flex;justify-content:center;align-items:center;gap:var(--granite-spacing-8);padding:var(--granite-spacing-8);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}p-carousel{flex:1;min-width:0}p-carousel .item-template-wrapper{margin:var(--granite-spacing-4)}.arrow-btn{width:calc(var(--granite-size-base-rem) * 2);height:calc(var(--granite-size-base-rem) * 2)}.arrow-btn granite-icon{font-size:var(--granite-font-size-body);position:relative;top:0}::ng-deep .auto-width .p-carousel-item{flex:0 0 auto!important}::ng-deep .is-one-item .p-carousel-item{flex:1 0 100%!important}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { items: [{
+        }], propDecorators: { items: [{
                 type: Input
             }], responsiveOptions: [{
                 type: Input
@@ -158,17 +158,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImpor
             }] } });
 
 class GraniteCarouselModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteCarouselModule, declarations: [GraniteCarouselComponent], imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: GraniteCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.9", ngImport: i0, type: GraniteCarouselModule, declarations: [GraniteCarouselComponent], imports: [CommonModule,
             CarouselModule,
             GraniteButtonModule,
             GraniteIconModule], exports: [GraniteCarouselComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCarouselModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: GraniteCarouselModule, imports: [CommonModule,
             CarouselModule,
             GraniteButtonModule,
             GraniteIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCarouselModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: GraniteCarouselModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [GraniteCarouselComponent],

package/fesm2022/ifsworld-granite-components-carousel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ifsworld-granite-components-carousel.mjs","sources":["../../../../libs/granite-components/carousel/src/lib/carousel.component.ts","../../../../libs/granite-components/carousel/src/lib/carousel.component.html","../../../../libs/granite-components/carousel/src/lib/carousel.module.ts","../../../../libs/granite-components/carousel/src/ifsworld-granite-components-carousel.ts"],"sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ContentChild,\n  HostListener,\n  Input,\n  OnChanges,\n  OnDestroy,\n  SimpleChanges,\n  TemplateRef,\n  ViewChild,\n} from '@angular/core';\nimport { Carousel, CarouselResponsiveOptions } from 'primeng/carousel';\n\n@Component({\n  selector: 'granite-carousel',\n  templateUrl: './carousel.component.html',\n  styleUrl: './carousel.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  standalone: false,\n})\nexport class GraniteCarouselComponent<T>\n  implements OnChanges, AfterViewInit, OnDestroy\n{\n  @Input()\n  items: T[] = [];\n\n  @Input()\n  responsiveOptions: CarouselResponsiveOptions[] = [\n    {\n      breakpoint: '1024px',\n      numVisible: 3,\n      numScroll: 1,\n    },\n    {\n      breakpoint: '768px',\n      numVisible: 2,\n      numScroll: 1,\n    },\n    {\n      breakpoint: '560px',\n      numVisible: 1,\n      numScroll: 1,\n    },\n  ];\n\n  @Input()\n  numVisible: number = 1;\n\n  @Input()\n  numScroll: number = 1;\n\n  @Input()\n  circular: boolean = false;\n\n  @Input()\n  prevButtonAriaLabel: string = 'Previous page';\n\n  @Input()\n  nextButtonAriaLabel: string = 'Next page';\n\n  @Input()\n  shrinkToContent: boolean = false;\n\n  @ContentChild('itemTemplate', { static: false })\n  itemTemplateRef: TemplateRef<any>;\n\n  @ViewChild('carousel')\n  carousel: Carousel;\n\n  visibleItems: T[] = [];\n  isOneItemVisible: boolean = false;\n\n  private resizeObserver: ResizeObserver;\n\n  constructor(private cdr: ChangeDetectorRef) {}\n\n  ngOnChanges(changes: SimpleChanges): void {\n    if (changes['items'] && changes['items'].currentValue) {\n      this.items = changes['items'].currentValue;\n      this.triggerUpdate();\n    }\n  }\n\n  ngAfterViewInit(): void {\n    if (typeof ResizeObserver !== 'undefined') {\n      this.resizeObserver = new ResizeObserver((entries) => {\n        this.handleResize(entries);\n      });\n\n      this.resizeObserver.observe(this.carousel?.el?.nativeElement);\n    }\n  }\n\n  @HostListener('window:resize')\n  onResize(): void {\n    this.triggerUpdate();\n  }\n\n  onKeyDown(event: KeyboardEvent): void {\n    const mouseEvent = new MouseEvent('click', { cancelable: true });\n    if (event.key === 'ArrowRight') {\n      this.navForward(mouseEvent);\n    } else if (event.key === 'ArrowLeft') {\n      this.navBackward(mouseEvent);\n    }\n  }\n\n  navForward(event: MouseEvent): void {\n    this.carousel?.navForward(event);\n  }\n\n  navBackward(event: MouseEvent): void {\n    this.carousel?.navBackward(event);\n  }\n\n  ngOnDestroy(): void {\n    this.resizeObserver?.disconnect();\n  }\n\n  private triggerUpdate(): void {\n    if (this.carousel?.el?.nativeElement) {\n      const containerWidth = this.carousel.el.nativeElement.offsetWidth;\n      this.updateNumVisibleBasedOnWidth(containerWidth);\n    } else {\n      this.updateVisibleItems();\n    }\n  }\n\n  private handleResize(entries: ResizeObserverEntry[]): void {\n    entries.forEach((entry) => {\n      if (entry.contentRect) {\n        const containerWidth = entry.contentRect.width;\n        this.updateNumVisibleBasedOnWidth(containerWidth);\n      }\n    });\n  }\n\n  private getDisplayItems(items: T[], numVisible: number): T[] {\n    const placeholders = Array(Math.max(0, numVisible - items.length)).fill({\n      placeholder: true,\n    });\n\n    return [...items, ...placeholders];\n  }\n\n  private updateVisibleItems(): void {\n    if (!this.items || !this.carousel) return;\n\n    const numVisible = this.carousel.numVisible || this.numVisible;\n    this.visibleItems = this.getDisplayItems(this.items, numVisible);\n    this.cdr.markForCheck();\n  }\n\n  private updateNumVisibleBasedOnWidth(containerWidth: number): void {\n    if (!this.carousel) return;\n\n    let matched: boolean = false;\n    const sortedResponsiveOptions = [...this.responsiveOptions].sort(\n      (a, b) => parseInt(a.breakpoint) - parseInt(b.breakpoint)\n    );\n\n    if (containerWidth) {\n      for (const option of sortedResponsiveOptions) {\n        const breakpoint = parseInt(option.breakpoint);\n\n        if (containerWidth <= breakpoint) {\n          this.carousel.numVisible = option.numVisible;\n          this.isOneItemVisible = option.numVisible === 1;\n          matched = true;\n          break;\n        }\n      }\n    }\n\n    if (!matched) {\n      this.carousel.numVisible = this.numVisible;\n    }\n\n    this.updateVisibleItems();\n  }\n}\n","<div class=\"carousel-wrapper\">\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isBackwardNavDisabled()\"\n    [attr.aria-label]=\"prevButtonAriaLabel\"\n    (click)=\"navBackward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-left\"></granite-icon>\n  </button>\n\n  <p-carousel\n    #carousel\n    [value]=\"visibleItems\"\n    [numVisible]=\"numVisible\"\n    [numScroll]=\"numScroll\"\n    [circular]=\"circular\"\n    [responsiveOptions]=\"responsiveOptions\"\n    [showNavigators]=\"false\"\n    [showIndicators]=\"false\"\n    [class.auto-width]=\"shrinkToContent\"\n    [class.is-one-item]=\"isOneItemVisible\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n  >\n    <ng-template let-item pTemplate=\"item\">\n      <div class=\"item-template-wrapper\" *ngIf=\"!item.placeholder\">\n        <ng-container\n          *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item }\"\n        ></ng-container>\n      </div>\n    </ng-template>\n  </p-carousel>\n\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isForwardNavDisabled()\"\n    [attr.aria-label]=\"nextButtonAriaLabel\"\n    (click)=\"navForward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-right\"></granite-icon>\n  </button>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { GraniteCarouselComponent } from './carousel.component';\nimport { CarouselModule } from 'primeng/carousel';\nimport {\n  GraniteIconModule,\n  GraniteButtonModule,\n} from '@ifsworld/granite-components';\n\n@NgModule({\n  declarations: [GraniteCarouselComponent],\n  exports: [GraniteCarouselComponent],\n  imports: [\n    CommonModule,\n    CarouselModule,\n    GraniteButtonModule,\n    GraniteIconModule,\n  ],\n})\nexport class GraniteCarouselModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ifsworld-granite-components-carousel.mjs","sources":["../../../../libs/granite-components/carousel/src/lib/carousel.component.ts","../../../../libs/granite-components/carousel/src/lib/carousel.component.html","../../../../libs/granite-components/carousel/src/lib/carousel.module.ts","../../../../libs/granite-components/carousel/src/ifsworld-granite-components-carousel.ts"],"sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ContentChild,\n  HostListener,\n  Input,\n  OnChanges,\n  OnDestroy,\n  SimpleChanges,\n  TemplateRef,\n  ViewChild,\n  inject,\n} from '@angular/core';\nimport { Carousel, CarouselResponsiveOptions } from 'primeng/carousel';\n\n@Component({\n  selector: 'granite-carousel',\n  templateUrl: './carousel.component.html',\n  styleUrl: './carousel.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  standalone: false,\n})\nexport class GraniteCarouselComponent<T>\n  implements OnChanges, AfterViewInit, OnDestroy\n{\n  @Input()\n  items: T[] = [];\n\n  @Input()\n  responsiveOptions: CarouselResponsiveOptions[] = [\n    {\n      breakpoint: '1024px',\n      numVisible: 3,\n      numScroll: 1,\n    },\n    {\n      breakpoint: '768px',\n      numVisible: 2,\n      numScroll: 1,\n    },\n    {\n      breakpoint: '560px',\n      numVisible: 1,\n      numScroll: 1,\n    },\n  ];\n\n  @Input()\n  numVisible: number = 1;\n\n  @Input()\n  numScroll: number = 1;\n\n  @Input()\n  circular: boolean = false;\n\n  @Input()\n  prevButtonAriaLabel: string = 'Previous page';\n\n  @Input()\n  nextButtonAriaLabel: string = 'Next page';\n\n  @Input()\n  shrinkToContent: boolean = false;\n\n  @ContentChild('itemTemplate', { static: false })\n  itemTemplateRef: TemplateRef<any>;\n\n  @ViewChild('carousel')\n  carousel: Carousel;\n\n  visibleItems: T[] = [];\n  isOneItemVisible: boolean = false;\n\n  private cdr = inject(ChangeDetectorRef);\n  private resizeObserver: ResizeObserver;\n\n  ngOnChanges(changes: SimpleChanges): void {\n    if (changes['items'] && changes['items'].currentValue) {\n      this.items = changes['items'].currentValue;\n      this.triggerUpdate();\n    }\n  }\n\n  ngAfterViewInit(): void {\n    if (typeof ResizeObserver !== 'undefined') {\n      this.resizeObserver = new ResizeObserver((entries) => {\n        this.handleResize(entries);\n      });\n\n      this.resizeObserver.observe(this.carousel?.el?.nativeElement);\n    }\n  }\n\n  @HostListener('window:resize')\n  onResize(): void {\n    this.triggerUpdate();\n  }\n\n  onKeyDown(event: KeyboardEvent): void {\n    const mouseEvent = new MouseEvent('click', { cancelable: true });\n    if (event.key === 'ArrowRight') {\n      this.navForward(mouseEvent);\n    } else if (event.key === 'ArrowLeft') {\n      this.navBackward(mouseEvent);\n    }\n  }\n\n  navForward(event: MouseEvent): void {\n    this.carousel?.navForward(event);\n  }\n\n  navBackward(event: MouseEvent): void {\n    this.carousel?.navBackward(event);\n  }\n\n  ngOnDestroy(): void {\n    this.resizeObserver?.disconnect();\n  }\n\n  private triggerUpdate(): void {\n    if (this.carousel?.el?.nativeElement) {\n      const containerWidth = this.carousel.el.nativeElement.offsetWidth;\n      this.updateNumVisibleBasedOnWidth(containerWidth);\n    } else {\n      this.updateVisibleItems();\n    }\n  }\n\n  private handleResize(entries: ResizeObserverEntry[]): void {\n    entries.forEach((entry) => {\n      if (entry.contentRect) {\n        const containerWidth = entry.contentRect.width;\n        this.updateNumVisibleBasedOnWidth(containerWidth);\n      }\n    });\n  }\n\n  private getDisplayItems(items: T[], numVisible: number): T[] {\n    const placeholders = Array(Math.max(0, numVisible - items.length)).fill({\n      placeholder: true,\n    });\n\n    return [...items, ...placeholders];\n  }\n\n  private updateVisibleItems(): void {\n    if (!this.items || !this.carousel) return;\n\n    const numVisible = this.carousel.numVisible || this.numVisible;\n    this.visibleItems = this.getDisplayItems(this.items, numVisible);\n    this.cdr.markForCheck();\n  }\n\n  private updateNumVisibleBasedOnWidth(containerWidth: number): void {\n    if (!this.carousel) return;\n\n    let matched: boolean = false;\n    const sortedResponsiveOptions = [...this.responsiveOptions].sort(\n      (a, b) => parseInt(a.breakpoint) - parseInt(b.breakpoint)\n    );\n\n    if (containerWidth) {\n      for (const option of sortedResponsiveOptions) {\n        const breakpoint = parseInt(option.breakpoint);\n\n        if (containerWidth <= breakpoint) {\n          this.carousel.numVisible = option.numVisible;\n          this.isOneItemVisible = option.numVisible === 1;\n          matched = true;\n          break;\n        }\n      }\n    }\n\n    if (!matched) {\n      this.carousel.numVisible = this.numVisible;\n    }\n\n    this.updateVisibleItems();\n  }\n}\n","<div class=\"carousel-wrapper\">\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isBackwardNavDisabled()\"\n    [attr.aria-label]=\"prevButtonAriaLabel\"\n    (click)=\"navBackward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-left\"></granite-icon>\n  </button>\n\n  <p-carousel\n    #carousel\n    [value]=\"visibleItems\"\n    [numVisible]=\"numVisible\"\n    [numScroll]=\"numScroll\"\n    [circular]=\"circular\"\n    [responsiveOptions]=\"responsiveOptions\"\n    [showNavigators]=\"false\"\n    [showIndicators]=\"false\"\n    [class.auto-width]=\"shrinkToContent\"\n    [class.is-one-item]=\"isOneItemVisible\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n  >\n    <ng-template let-item pTemplate=\"item\">\n      <div class=\"item-template-wrapper\" *ngIf=\"!item.placeholder\">\n        <ng-container\n          *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item }\"\n        ></ng-container>\n      </div>\n    </ng-template>\n  </p-carousel>\n\n  <button\n    graniteFlatButton\n    class=\"arrow-btn\"\n    [disabled]=\"carousel.isForwardNavDisabled()\"\n    [attr.aria-label]=\"nextButtonAriaLabel\"\n    (click)=\"navForward($event)\"\n  >\n    <granite-icon fontIcon=\"icon-caret-right\"></granite-icon>\n  </button>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { GraniteCarouselComponent } from './carousel.component';\nimport { CarouselModule } from 'primeng/carousel';\nimport {\n  GraniteIconModule,\n  GraniteButtonModule,\n} from '@ifsworld/granite-components';\n\n@NgModule({\n  declarations: [GraniteCarouselComponent],\n  exports: [GraniteCarouselComponent],\n  imports: [\n    CommonModule,\n    CarouselModule,\n    GraniteButtonModule,\n    GraniteIconModule,\n  ],\n})\nexport class GraniteCarouselModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}