@agnos-ui/angular-bootstrap 0.8.0-next.1 → 0.8.1

package/agnos-ui-angular.module.d.ts

@@ -9,10 +9,12 @@ import * as i7 from "./components/accordion/accordion.component";
 import * as i8 from "./components/slider/slider.component";
 import * as i9 from "./components/progressbar/progressbar.component";
 import * as i10 from "./components/toast/toast.component";
-import * as i11 from "./components/collapse/collapse.component";
-import * as i12 from "./components/tree/tree.component";
+import * as i11 from "./components/toast/toaster.component";
+import * as i12 from "./components/collapse/collapse.component";
+import * as i13 from "./components/tree/tree.component";
+import * as i14 from "./components/carousel/carousel.component";
 export declare class AgnosUIAngularModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<AgnosUIAngularModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AgnosUIAngularModule, never, [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemLabelDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i8.SliderTickDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i9.ProgressbarBodyDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective, typeof i11.CollapseDirective, typeof i11.CollapseTriggerDirective, typeof i12.TreeComponent, typeof i12.TreeStructureDirective, typeof i12.TreeItemToggleDirective, typeof i12.TreeItemContentDirective, typeof i12.TreeItemDirective], [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemLabelDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i8.SliderTickDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i9.ProgressbarBodyDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective, typeof i11.CollapseDirective, typeof i11.CollapseTriggerDirective, typeof i12.TreeComponent, typeof i12.TreeStructureDirective, typeof i12.TreeItemToggleDirective, typeof i12.TreeItemContentDirective, typeof i12.TreeItemDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AgnosUIAngularModule, never, [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemLabelDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i8.SliderTickDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i9.ProgressbarBodyDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective, typeof i11.ToasterComponent, typeof i12.CollapseDirective, typeof i12.CollapseTriggerDirective, typeof i13.TreeComponent, typeof i13.TreeStructureDirective, typeof i13.TreeItemToggleDirective, typeof i13.TreeItemContentDirective, typeof i13.TreeItemDirective, typeof i14.CarouselComponent, typeof i14.CarouselSlideDirective, typeof i14.CarouselStructureDirective, typeof i14.CarouselNavigationDirective], [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemLabelDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i8.SliderTickDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i9.ProgressbarBodyDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective, typeof i11.ToasterComponent, typeof i12.CollapseDirective, typeof i12.CollapseTriggerDirective, typeof i13.TreeComponent, typeof i13.TreeStructureDirective, typeof i13.TreeItemToggleDirective, typeof i13.TreeItemContentDirective, typeof i13.TreeItemDirective, typeof i14.CarouselComponent, typeof i14.CarouselSlideDirective, typeof i14.CarouselStructureDirective, typeof i14.CarouselNavigationDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<AgnosUIAngularModule>;
 }

package/components/carousel/carousel.component.d.ts

@@ -0,0 +1,207 @@
+import { BaseWidgetDirective, type SlotContent } from '@agnos-ui/angular-headless';
+import type { CarouselContext, CarouselSlideContext, CarouselWidget } from './carousel.gen';
+import type { InputSignal } from '@angular/core';
+import { TemplateRef } from '@angular/core';
+import type { EmblaPluginType } from 'embla-carousel';
+import * as i0 from "@angular/core";
+/**
+ * Directive that provides a template reference for the carousel structure using the {@link CarouselContext}.
+ */
+export declare class CarouselStructureDirective<SlideData extends {
+    id: string;
+}> {
+    templateRef: TemplateRef<any>;
+    static ngTemplateContextGuard<SlideData extends {
+        id: string;
+    }>(_dir: CarouselStructureDirective<SlideData>, context: unknown): context is CarouselContext<SlideData>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CarouselStructureDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CarouselStructureDirective<any>, "ng-template[auCarouselStructure]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Directive that provides a template reference for the carousel navigation using the {@link CarouselContext}.
+ */
+export declare class CarouselNavigationDirective<SlideData extends {
+    id: string;
+}> {
+    templateRef: TemplateRef<any>;
+    static ngTemplateContextGuard<SlideData extends {
+        id: string;
+    }>(_dir: CarouselNavigationDirective<SlideData>, context: unknown): context is CarouselContext<SlideData>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CarouselNavigationDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CarouselNavigationDirective<any>, "ng-template[auCarouselNavigation]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Directive that provides a template reference for the carousel slide  using the {@link CarouselSlideContext}.
+ */
+export declare class CarouselSlideDirective<SlideData extends {
+    id: string;
+}> {
+    templateRef: TemplateRef<any>;
+    static ngTemplateContextGuard<SlideData extends {
+        id: string;
+    }>(_dir: CarouselSlideDirective<SlideData>, context: unknown): context is CarouselSlideContext<SlideData>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CarouselSlideDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CarouselSlideDirective<any>, "ng-template[auCarouselSlide]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * The default slot for the structure
+ */
+export declare const carouselDefaultSlotStructure: SlotContent<CarouselContext<any>>;
+/**
+ * The default slot for the navigation
+ */
+export declare const carouselDefaultSlotNavigation: SlotContent<CarouselContext<any>>;
+/**
+ * CarouselComponent is an Angular Component that extends {@link BaseWidgetDirective}<{@link CarouselWidget}>
+ * to create a customizable carousel widget. It provides various inputs (see {@link CarouselProps})
+ * to configure the appearance and behavior of the carousel.
+ */
+export declare class CarouselComponent<SlideData extends {
+    id: string;
+}> extends BaseWidgetDirective<CarouselWidget<SlideData>> {
+    /**
+     * Aria label for navigation indicators
+     */
+    readonly ariaIndicatorLabel: InputSignal<((index: number) => string) | undefined>;
+    /**
+     * Aria label for previous button
+     */
+    readonly ariaPrevLabel: InputSignal<string | undefined>;
+    /**
+     * Aria label for next button
+     */
+    readonly ariaNextLabel: InputSignal<string | undefined>;
+    /**
+     * Choose content direction between `ltr` and `rtl`
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#direction}
+     * @defaultValue `'ltr'`
+     */
+    readonly direction: InputSignal<"ltr" | "rtl" | undefined>;
+    /**
+     * Enables momentum scrolling
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#dragFree}
+     * @defaultValue `false`
+     */
+    readonly dragFree: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Drag threshold in pixels
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#dragThreshold}
+     * @defaultValue `10`
+     */
+    readonly dragThreshold: import("@angular/core").InputSignalWithTransform<number | undefined, unknown>;
+    /**
+     * Set scroll duration when triggered by any of the API methods
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#duration}
+     * @defaultValue `25`
+     */
+    readonly duration: import("@angular/core").InputSignalWithTransform<number | undefined, unknown>;
+    /**
+     * Enables infinite looping
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#loop}
+     * @defaultValue `false`
+     */
+    readonly loop: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Allow the carousel to skip scroll snaps if it's dragged vigorously
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#skipsnaps}
+     * @defaultValue `false`
+     */
+    readonly skipSnaps: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * If `true`, 'previous' and 'next' navigation arrows will be visible.
+     */
+    readonly showNavigationArrows: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * If `true`, navigation indicators at the bottom of the slide will be visible.
+     */
+    readonly showNavigationIndicators: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Plugins to extend the carousel with additional features
+     * @defaultValue `[]`
+     */
+    readonly plugins: InputSignal<EmblaPluginType[] | undefined>;
+    /**
+     * Align the slides relative to the carousel viewport
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#align}
+     * @defaultValue `'center'`
+     */
+    readonly align: InputSignal<"start" | "center" | "end" | undefined>;
+    /**
+     * Enables choosing a custom container element which holds the slides. By default, Embla will choose the first direct child element of the root element. Provide a valid CSS selector string.
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#container}
+     */
+    readonly container: InputSignal<string | null | undefined>;
+    /**
+     * Clear leading and trailing empty space that causes excessive scrolling
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#containScroll}
+     * @defaultValue `'trimSnaps'`
+     */
+    readonly containScroll: InputSignal<false | "trimSnaps" | "keepSnaps" | undefined>;
+    /**
+     * CSS classes to be applied on the widget main container
+     *
+     * @defaultValue `''`
+     */
+    readonly className: InputSignal<string | undefined>;
+    /**
+     * Class name to apply to the container of the carousel.
+     *
+     * @defaultValue `''`
+     */
+    readonly containerClass: InputSignal<string | undefined>;
+    /**
+     * Class name to apply to each slide in the carousel.
+     *
+     * @defaultValue `''`
+     */
+    readonly slideClass: InputSignal<string | ((slideContext: {
+        id: string;
+        index: number;
+        active: boolean;
+    }) => string) | undefined>;
+    /**
+     * The aria-live attribute value for the carousel container.
+     *
+     * @defaultValue `'polite'`
+     */
+    readonly ariaLive: InputSignal<string | undefined>;
+    /**
+     * The data for each slide in the carousel.
+     *
+     * @defaultValue `[]`
+     */
+    readonly slidesData: InputSignal<SlideData[] | undefined>;
+    /**
+     * The structure of the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    readonly structure: InputSignal<SlotContent<CarouselContext<SlideData>>>;
+    /**
+     * The navigation layer of the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    readonly navigation: InputSignal<SlotContent<CarouselContext<SlideData>>>;
+    /**
+     * The content of each slide in the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    readonly slide: InputSignal<SlotContent<CarouselSlideContext<SlideData>>>;
+    readonly slotSlideFromContent: import("@angular/core").Signal<CarouselSlideDirective<any> | undefined>;
+    readonly slotStructureFromContent: import("@angular/core").Signal<CarouselStructureDirective<any> | undefined>;
+    readonly slotNavigationFromContent: import("@angular/core").Signal<CarouselNavigationDirective<any> | undefined>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<CarouselComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CarouselComponent<any>, "[auCarousel]", never, { "ariaIndicatorLabel": { "alias": "auAriaIndicatorLabel"; "required": false; "isSignal": true; }; "ariaPrevLabel": { "alias": "auAriaPrevLabel"; "required": false; "isSignal": true; }; "ariaNextLabel": { "alias": "auAriaNextLabel"; "required": false; "isSignal": true; }; "direction": { "alias": "auDirection"; "required": false; "isSignal": true; }; "dragFree": { "alias": "auDragFree"; "required": false; "isSignal": true; }; "dragThreshold": { "alias": "auDragThreshold"; "required": false; "isSignal": true; }; "duration": { "alias": "auDuration"; "required": false; "isSignal": true; }; "loop": { "alias": "auLoop"; "required": false; "isSignal": true; }; "skipSnaps": { "alias": "auSkipSnaps"; "required": false; "isSignal": true; }; "showNavigationArrows": { "alias": "auShowNavigationArrows"; "required": false; "isSignal": true; }; "showNavigationIndicators": { "alias": "auShowNavigationIndicators"; "required": false; "isSignal": true; }; "plugins": { "alias": "auPlugins"; "required": false; "isSignal": true; }; "align": { "alias": "auAlign"; "required": false; "isSignal": true; }; "container": { "alias": "auContainer"; "required": false; "isSignal": true; }; "containScroll": { "alias": "auContainScroll"; "required": false; "isSignal": true; }; "className": { "alias": "auClassName"; "required": false; "isSignal": true; }; "containerClass": { "alias": "auContainerClass"; "required": false; "isSignal": true; }; "slideClass": { "alias": "auSlideClass"; "required": false; "isSignal": true; }; "ariaLive": { "alias": "auAriaLive"; "required": false; "isSignal": true; }; "slidesData": { "alias": "auSlidesData"; "required": false; "isSignal": true; }; "structure": { "alias": "auStructure"; "required": false; "isSignal": true; }; "navigation": { "alias": "auNavigation"; "required": false; "isSignal": true; }; "slide": { "alias": "auSlide"; "required": false; "isSignal": true; }; }, {}, ["slotSlideFromContent", "slotStructureFromContent", "slotNavigationFromContent"], never, true, never>;
+}

package/components/carousel/carousel.gen.d.ts

@@ -0,0 +1,358 @@
+import type { PropsConfig, WidgetSlotContext, SlotContent, Directive, Widget } from '@agnos-ui/angular-headless';
+import type { EmblaPluginType, EmblaPluginsType, EmblaCarouselType } from 'embla-carousel';
+/**
+ * Retrieve a shallow copy of the default Carousel config
+ * @returns the default Carousel config
+ */
+declare const export_getCarouselDefaultConfig: () => CarouselProps<any>;
+export { export_getCarouselDefaultConfig as getCarouselDefaultConfig };
+/**
+ * Create a Carousel with given config props
+ *
+ * @template SlideData - The type of the data for each slide.
+ * @param config - an optional carousel config
+ * @returns a CarouselWidget
+ */
+declare const export_createCarousel: <SlideData extends {
+    id: string;
+}>(config?: PropsConfig<CarouselProps<SlideData>>) => CarouselWidget<SlideData>;
+export { export_createCarousel as createCarousel };
+/**
+ * Represents the context for a carousel.
+ *
+ * @template SlideData - The type of data used by each slide in the carousel.
+ */
+export type CarouselContext<SlideData extends {
+    id: string;
+}> = WidgetSlotContext<CarouselWidget<SlideData>>;
+/**
+ * Represents the context for a carousel slide.
+ *
+ * @template SlideData - The type of data used by each slide in the carousel.
+ */
+export type CarouselSlideContext<SlideData extends {
+    id: string;
+}> = WidgetSlotContext<CarouselWidget<SlideData>> & SlideData;
+/**
+ * Represents the state of a carousel component.
+ *
+ * @template SlideData - The type of data used by each slide in the carousel.
+ */
+export interface CarouselState<SlideData extends {
+    id: string;
+}> {
+    /**
+     * is the carousel currently scrolling
+     */
+    scrolling: boolean;
+    /**
+     * can carousel scroll to previous slide
+     */
+    canScrollPrev: boolean;
+    /**
+     * can carousel scroll to next slide
+     */
+    canScrollNext: boolean;
+    /**
+     * selected scroll snap
+     */
+    selectedScrollSnap: number;
+    /**
+     * is the carousel initialized
+     */
+    initialized: boolean;
+    /**
+     * If `true`, 'previous' and 'next' navigation arrows will be visible.
+     */
+    showNavigationArrows: boolean;
+    /**
+     * If `true`, navigation indicators at the bottom of the slide will be visible.
+     */
+    showNavigationIndicators: boolean;
+    /**
+     * Choose content direction between `ltr` and `rtl`
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#direction}
+     * @defaultValue `'ltr'`
+     */
+    direction: 'ltr' | 'rtl';
+    /**
+     * CSS classes to be applied on the widget main container
+     *
+     * @defaultValue `''`
+     */
+    className: string;
+    /**
+     * Class name to apply to the container of the carousel.
+     *
+     * @defaultValue `''`
+     */
+    containerClass: string;
+    /**
+     * Class name to apply to each slide in the carousel.
+     *
+     * @defaultValue `''`
+     */
+    slideClass: string | ((slideContext: {
+        id: string;
+        index: number;
+        active: boolean;
+    }) => string);
+    /**
+     * The data for each slide in the carousel.
+     *
+     * @defaultValue `[]`
+     */
+    slidesData: SlideData[];
+    /**
+     * The structure of the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    structure: SlotContent<CarouselContext<SlideData>>;
+    /**
+     * The navigation layer of the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    navigation: SlotContent<CarouselContext<SlideData>>;
+    /**
+     * The content of each slide in the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    slide: SlotContent<CarouselSlideContext<SlideData>>;
+    /**
+     * The aria-live attribute value for the carousel container.
+     *
+     * @defaultValue `'polite'`
+     */
+    ariaLive: string;
+}
+/**
+ * Interface representing the properties for a carousel component.
+ *
+ * @template SlideData - The type of data used by each slide in the carousel.
+ */
+export interface CarouselProps<SlideData extends {
+    id: string;
+}> {
+    /**
+     * Plugins to extend the carousel with additional features
+     * @defaultValue `[]`
+     */
+    plugins: EmblaPluginType[];
+    /**
+     * Aria label for navigation indicators
+     */
+    ariaIndicatorLabel: (index: number) => string;
+    /**
+     * Aria label for previous button
+     */
+    ariaPrevLabel: string;
+    /**
+     * Aria label for next button
+     */
+    ariaNextLabel: string;
+    /**
+     * Align the slides relative to the carousel viewport
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#align}
+     * @defaultValue `'center'`
+     */
+    align: 'start' | 'center' | 'end';
+    /**
+     * Enables choosing a custom container element which holds the slides. By default, Embla will choose the first direct child element of the root element. Provide a valid CSS selector string.
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#container}
+     */
+    container: string | null;
+    /**
+     * Clear leading and trailing empty space that causes excessive scrolling
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#containScroll}
+     * @defaultValue `'trimSnaps'`
+     */
+    containScroll: false | 'trimSnaps' | 'keepSnaps';
+    /**
+     * Choose content direction between `ltr` and `rtl`
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#direction}
+     * @defaultValue `'ltr'`
+     */
+    direction: 'ltr' | 'rtl';
+    /**
+     * Enables momentum scrolling
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#dragFree}
+     * @defaultValue `false`
+     */
+    dragFree: boolean;
+    /**
+     * Drag threshold in pixels
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#dragThreshold}
+     * @defaultValue `10`
+     */
+    dragThreshold: number;
+    /**
+     * Set scroll duration when triggered by any of the API methods
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#duration}
+     * @defaultValue `25`
+     */
+    duration: number;
+    /**
+     * Enables infinite looping
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#loop}
+     * @defaultValue `false`
+     */
+    loop: boolean;
+    /**
+     * Allow the carousel to skip scroll snaps if it's dragged vigorously
+     *
+     * @see {@link https://www.embla-carousel.com/api/options/#skipsnaps}
+     * @defaultValue `false`
+     */
+    skipSnaps: boolean;
+    /**
+     * If `true`, 'previous' and 'next' navigation arrows will be visible.
+     */
+    showNavigationArrows: boolean;
+    /**
+     * If `true`, navigation indicators at the bottom of the slide will be visible.
+     */
+    showNavigationIndicators: boolean;
+    /**
+     * CSS classes to be applied on the widget main container
+     *
+     * @defaultValue `''`
+     */
+    className: string;
+    /**
+     * Class name to apply to the container of the carousel.
+     *
+     * @defaultValue `''`
+     */
+    containerClass: string;
+    /**
+     * Class name to apply to each slide in the carousel.
+     *
+     * @defaultValue `''`
+     */
+    slideClass: string | ((slideContext: {
+        id: string;
+        index: number;
+        active: boolean;
+    }) => string);
+    /**
+     * The data for each slide in the carousel.
+     *
+     * @defaultValue `[]`
+     */
+    slidesData: SlideData[];
+    /**
+     * The structure of the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    structure: SlotContent<CarouselContext<SlideData>>;
+    /**
+     * The navigation layer of the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    navigation: SlotContent<CarouselContext<SlideData>>;
+    /**
+     * The content of each slide in the carousel.
+     *
+     * @defaultValue `undefined`
+     */
+    slide: SlotContent<CarouselSlideContext<SlideData>>;
+    /**
+     * The aria-live attribute value for the carousel container.
+     *
+     * @defaultValue `'polite'`
+     */
+    ariaLive: string;
+}
+/**
+ * Represents the directives for a carousel component.
+ */
+export interface CarouselDirectives {
+    /**
+     * A directive to be applied to each slide in the carousel.
+     */
+    slide: Directive<{
+        id: string;
+        index: number;
+    }>;
+    /**
+     * A directive to be applied to container of the carousel.
+     */
+    container: Directive;
+    /**
+     * the root directive
+     */
+    root: Directive;
+    /**
+     * A directive to be applied to a navigation button allowing to scroll to the previous slide.
+     */
+    scrollPrev: Directive;
+    /**
+     * A directive to be applied to a navigation button allowing to scroll to the next slide.
+     */
+    scrollNext: Directive;
+    /**
+     * A directive to be applied to a tab list allowing to navigate to the corresponding slide.
+     * This directive adds the role `tablist` and is recommended to be used together with {@link tabIndicator}.
+     */
+    tabList: Directive;
+    /**
+     * A directive to be applied to a navigation indicator allowing to scroll to the corresponding slide.
+     * As this directive adds the role `tab` to the element, it is recommended to use it on a button or a link and the parent element should have the {@link tabList} directive attached.
+     */
+    tabIndicator: Directive<{
+        index: number;
+        id: string;
+        jump?: boolean;
+    }>;
+}
+/**
+ * Represents a carousel widget with specific properties, state, API, and directives.
+ *
+ * @template SlideData - The type of the data for each slide.
+ */
+export type CarouselWidget<SlideData extends {
+    id: string;
+}> = Widget<CarouselProps<SlideData>, CarouselState<SlideData>, CarouselApi, CarouselDirectives>;
+/**
+ * Represents the API for a carousel component.
+ */
+export interface CarouselApi {
+    /**
+     * Scroll to the previous snap point if possible.
+     * @param jump - scroll instantly
+     */
+    scrollPrev: (jump?: boolean) => void;
+    /**
+     * Scroll to the next snap point if possible.
+     * @param jump - scroll instantly
+     */
+    scrollNext: (jump?: boolean) => void;
+    /**
+     * Scroll to a snap point by index
+     * @param index - the snap point index
+     * @param jump - scroll instantly
+     */
+    scrollTo: (index: number, jump?: boolean) => void;
+    /**
+     * Retrieve the enabled plugins
+     */
+    plugins: () => EmblaPluginsType | undefined;
+    /**
+     * Retrieve the inner EmblaApi object
+     */
+    emblaApi: () => EmblaCarouselType | undefined;
+}

package/components/carousel/index.d.ts

@@ -0,0 +1,2 @@
+export * from './carousel.gen';
+export * from './carousel.component';

package/components/toast/index.d.ts

@@ -1,2 +1,4 @@
 export * from './toast.component';
 export * from './toast.gen';
+export * from './toaster.component';
+export * from './toaster.service';