@aiandralves/ai-ui 1.0.0

package/esm2022/lib/components/card/demo/default.js

@@ -0,0 +1,30 @@
+import { Component } from "@angular/core";
+import { AiButton } from "../../button";
+import { AiCard } from "../card";
+import * as i0 from "@angular/core";
+export class DemoCardDefaultComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCardDefaultComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: DemoCardDefaultComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+        <ai-card title="Componente Card" variant="default" description="Um card padrão com borda cinza e layout organizado" icon="function">
+            <div class="flex flex-col gap-y-4 my-4">
+                <p class="text-sm text-muted-foreground">Este é o conteúdo do card. Você pode adicionar qualquer elemento aqui.</p>
+                <ai-button variant="outline" size="sm" icon="arrow-left-up">acessar</ai-button>
+            </div>
+        </ai-card>
+    `, isInline: true, dependencies: [{ kind: "component", type: AiCard, selector: "ai-card", inputs: ["title", "description", "icon", "routerLink", "disabled", "class"], exportAs: ["aiCard"] }, { kind: "component", type: AiButton, selector: "ai-button, button[ai-button], a[ai-button]", inputs: ["variant", "size", "shape", "type", "fill", "class", "icon", "full", "loading", "disabled"], exportAs: ["aiButton"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCardDefaultComponent, decorators: [{
+            type: Component,
+            args: [{
+                    imports: [AiCard, AiButton],
+                    template: `
+        <ai-card title="Componente Card" variant="default" description="Um card padrão com borda cinza e layout organizado" icon="function">
+            <div class="flex flex-col gap-y-4 my-4">
+                <p class="text-sm text-muted-foreground">Este é o conteúdo do card. Você pode adicionar qualquer elemento aqui.</p>
+                <ai-button variant="outline" size="sm" icon="arrow-left-up">acessar</ai-button>
+            </div>
+        </ai-card>
+    `,
+                }]
+        }] });
+//# sourceMappingURL=default.js.map

package/esm2022/lib/components/card/demo/default.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"default.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/card/demo/default.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;;AAajC,MAAM,OAAO,wBAAwB;uGAAxB,wBAAwB;2FAAxB,wBAAwB,wEATvB;;;;;;;KAOT,4DARS,MAAM,uJAAE,QAAQ;;2FAUjB,wBAAwB;kBAXpC,SAAS;mBAAC;oBACP,OAAO,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC;oBAC3B,QAAQ,EAAE;;;;;;;KAOT;iBACJ","sourcesContent":["import { Component } from \"@angular/core\";\r\n\r\nimport { AiButton } from \"../../button\";\r\nimport { AiCard } from \"../card\";\r\n\r\n@Component({\r\n    imports: [AiCard, AiButton],\r\n    template: `\r\n        <ai-card title=\"Componente Card\" variant=\"default\" description=\"Um card padrão com borda cinza e layout organizado\" icon=\"function\">\r\n            <div class=\"flex flex-col gap-y-4 my-4\">\r\n                <p class=\"text-sm text-muted-foreground\">Este é o conteúdo do card. Você pode adicionar qualquer elemento aqui.</p>\r\n                <ai-button variant=\"outline\" size=\"sm\" icon=\"arrow-left-up\">acessar</ai-button>\r\n            </div>\r\n        </ai-card>\r\n    `,\r\n})\r\nexport class DemoCardDefaultComponent {}\r\n"]}

package/esm2022/lib/components/card/demo/disabled.js

@@ -0,0 +1,23 @@
+import { Component } from "@angular/core";
+import { AiCard } from "../card";
+import * as i0 from "@angular/core";
+export class DemoCardDisabledComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCardDisabledComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: DemoCardDisabledComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+        <ai-card title="Componente Card" disabled description="Um card padrão com borda cinza e layout organizado" icon="function">
+            <p class="text-sm text-muted-foreground my-4">Este é o conteúdo do card. Você pode adicionar qualquer elemento aqui.</p>
+        </ai-card>
+    `, isInline: true, dependencies: [{ kind: "component", type: AiCard, selector: "ai-card", inputs: ["title", "description", "icon", "routerLink", "disabled", "class"], exportAs: ["aiCard"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCardDisabledComponent, decorators: [{
+            type: Component,
+            args: [{
+                    imports: [AiCard],
+                    template: `
+        <ai-card title="Componente Card" disabled description="Um card padrão com borda cinza e layout organizado" icon="function">
+            <p class="text-sm text-muted-foreground my-4">Este é o conteúdo do card. Você pode adicionar qualquer elemento aqui.</p>
+        </ai-card>
+    `,
+                }]
+        }] });
+//# sourceMappingURL=disabled.js.map

package/esm2022/lib/components/card/demo/disabled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"disabled.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/card/demo/disabled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;;AAUjC,MAAM,OAAO,yBAAyB;uGAAzB,yBAAyB;2FAAzB,yBAAyB,wEANxB;;;;KAIT,4DALS,MAAM;;2FAOP,yBAAyB;kBARrC,SAAS;mBAAC;oBACP,OAAO,EAAE,CAAC,MAAM,CAAC;oBACjB,QAAQ,EAAE;;;;KAIT;iBACJ","sourcesContent":["import { Component } from \"@angular/core\";\r\n\r\nimport { AiCard } from \"../card\";\r\n\r\n@Component({\r\n    imports: [AiCard],\r\n    template: `\r\n        <ai-card title=\"Componente Card\" disabled description=\"Um card padrão com borda cinza e layout organizado\" icon=\"function\">\r\n            <p class=\"text-sm text-muted-foreground my-4\">Este é o conteúdo do card. Você pode adicionar qualquer elemento aqui.</p>\r\n        </ai-card>\r\n    `,\r\n})\r\nexport class DemoCardDisabledComponent {}\r\n"]}

package/esm2022/lib/components/card/index.js

@@ -0,0 +1,3 @@
+export * from "./card";
+export * from "./demo/card";
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/card/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC","sourcesContent":["export * from \"./card\";\r\nexport * from \"./demo/card\";\r\n"]}

package/esm2022/lib/components/carousel/carousel.js

@@ -0,0 +1,98 @@
+import { ChangeDetectionStrategy, Component, computed, contentChildren, ElementRef, inject, input, output, ViewEncapsulation } from "@angular/core";
+import { mergeClasses, transform } from "../../core";
+import { AiIcon } from "../icon";
+import { AiCarouselService } from "./carousel.service";
+import { carouselDotVariants, carouselItemVariants, carouselNavVariants, carouselTrackVariants, carouselVariants } from "./carousel.variants";
+import * as i0 from "@angular/core";
+export class AiCarouselItem {
+    orientation = input("horizontal", ...(ngDevMode ? [{ debugName: "orientation" }] : []));
+    class = input("", ...(ngDevMode ? [{ debugName: "class" }] : []));
+    classes = computed(() => mergeClasses(carouselItemVariants({ orientation: this.orientation() }), "px-2", this.class()), ...(ngDevMode ? [{ debugName: "classes" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarouselItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: AiCarouselItem, isStandalone: true, selector: "ai-carousel-item", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, exportAs: ["aiCarouselItem"], ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarouselItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "ai-carousel-item",
+                    exportAs: "aiCarouselItem",
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    template: `<ng-content />`,
+                    host: {
+                        "[class]": "classes()",
+                    },
+                }]
+        }], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+export class AiCarousel {
+    #el = inject(ElementRef);
+    #service = inject(AiCarouselService);
+    items = contentChildren(AiCarouselItem, ...(ngDevMode ? [{ debugName: "items" }] : []));
+    orientation = input("horizontal", ...(ngDevMode ? [{ debugName: "orientation" }] : []));
+    loop = input(false, { ...(ngDevMode ? { debugName: "loop" } : {}), transform });
+    autoplay = input(false, { ...(ngDevMode ? { debugName: "autoplay" } : {}), transform });
+    autoplayInterval = input(4000, ...(ngDevMode ? [{ debugName: "autoplayInterval" }] : []));
+    showDots = input(true, { ...(ngDevMode ? { debugName: "showDots" } : {}), transform });
+    showNav = input(true, { ...(ngDevMode ? { debugName: "showNav" } : {}), transform });
+    class = input("", ...(ngDevMode ? [{ debugName: "class" }] : []));
+    slideChange = output();
+    current = computed(() => this.#service.current(), ...(ngDevMode ? [{ debugName: "current" }] : []));
+    dragging = computed(() => this.#service.dragging(), ...(ngDevMode ? [{ debugName: "dragging" }] : []));
+    total = computed(() => this.items().length, ...(ngDevMode ? [{ debugName: "total" }] : []));
+    canPrev = computed(() => this.#service.canPrev(), ...(ngDevMode ? [{ debugName: "canPrev" }] : []));
+    canNext = computed(() => this.#service.canNext(), ...(ngDevMode ? [{ debugName: "canNext" }] : []));
+    containerClasses = computed(() => mergeClasses("flex items-center gap-2", this.class()), ...(ngDevMode ? [{ debugName: "containerClasses" }] : []));
+    viewportClasses = computed(() => mergeClasses(carouselVariants({ orientation: this.orientation() })), ...(ngDevMode ? [{ debugName: "viewportClasses" }] : []));
+    trackClasses = computed(() => mergeClasses(carouselTrackVariants({ orientation: this.orientation(), dragging: this.dragging() })), ...(ngDevMode ? [{ debugName: "trackClasses" }] : []));
+    trackTransform = computed(() => {
+        const offset = -(this.current() * 100) + this.#service.dragOffset();
+        return this.orientation() === "horizontal" ? `translateX(${offset}%)` : `translateY(${offset}%)`;
+    }, ...(ngDevMode ? [{ debugName: "trackTransform" }] : []));
+    navClasses = mergeClasses(carouselNavVariants());
+    dotClasses(index) {
+        return mergeClasses(carouselDotVariants({ active: index === this.current() }));
+    }
+    dots = computed(() => Array.from({ length: this.total() }, (_, i) => i), ...(ngDevMode ? [{ debugName: "dots" }] : []));
+    ngOnInit() {
+        this.#service.configure({
+            total: this.items().length,
+            loop: this.loop(),
+            autoplay: this.autoplay(),
+            autoplayInterval: this.autoplayInterval(),
+            orientation: this.orientation() ?? "horizontal",
+            onChange: index => this.slideChange.emit(index),
+        });
+        this.#service.setupDrag(this.#el);
+    }
+    ngAfterContentInit() {
+        this.#service.configure({
+            total: this.items().length,
+            loop: this.loop(),
+            autoplay: this.autoplay(),
+            autoplayInterval: this.autoplayInterval(),
+            orientation: this.orientation() ?? "horizontal",
+            onChange: index => this.slideChange.emit(index),
+        });
+        this.#service.startAutoplay();
+    }
+    prev() {
+        this.#service.prev();
+    }
+    next() {
+        this.#service.next();
+    }
+    goTo(index) {
+        this.#service.goTo(index);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: AiCarousel, isStandalone: true, selector: "ai-carousel", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, autoplay: { classPropertyName: "autoplay", publicName: "autoplay", isSignal: true, isRequired: false, transformFunction: null }, autoplayInterval: { classPropertyName: "autoplayInterval", publicName: "autoplayInterval", isSignal: true, isRequired: false, transformFunction: null }, showDots: { classPropertyName: "showDots", publicName: "showDots", isSignal: true, isRequired: false, transformFunction: null }, showNav: { classPropertyName: "showNav", publicName: "showNav", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideChange: "slideChange" }, host: { attributes: { "role": "region", "aria-roledescription": "carousel" }, properties: { "class": "containerClasses()" } }, providers: [AiCarouselService], queries: [{ propertyName: "items", predicate: AiCarouselItem, isSignal: true }], exportAs: ["aiCarousel"], ngImport: i0, template: "@if (showNav() && total() > 1) {\r\n    <button\r\n        type=\"button\"\r\n        [class]=\"navClasses\"\r\n        [disabled]=\"!canPrev()\"\r\n        (click)=\"prev()\"\r\n        aria-label=\"Slide anterior\">\r\n        <ai-icon icon=\"arrow-left-s\" size=\"sm\" />\r\n    </button>\r\n}\r\n\r\n<div [class]=\"viewportClasses()\">\r\n    <div [class]=\"trackClasses()\" [style.transform]=\"trackTransform()\">\r\n        <ng-content select=\"ai-carousel-item\" />\r\n    </div>\r\n\r\n    @if (showDots() && total() > 1) {\r\n        <div class=\"flex items-center justify-center gap-1.5 pt-3\">\r\n            @for (dot of dots(); track dot) {\r\n                <button\r\n                    type=\"button\"\r\n                    [class]=\"dotClasses(dot)\"\r\n                    (click)=\"goTo(dot)\"\r\n                    [attr.aria-label]=\"'Ir para slide ' + (dot + 1)\"\r\n                    [attr.aria-current]=\"dot === current() ? 'true' : null\">\r\n                </button>\r\n            }\r\n        </div>\r\n    }\r\n</div>\r\n\r\n@if (showNav() && total() > 1) {\r\n    <button\r\n        type=\"button\"\r\n        [class]=\"navClasses\"\r\n        [disabled]=\"!canNext()\"\r\n        (click)=\"next()\"\r\n        aria-label=\"Pr\u00F3ximo slide\">\r\n        <ai-icon icon=\"arrow-right-s\" size=\"sm\" />\r\n    </button>\r\n}\r\n", dependencies: [{ kind: "component", type: AiIcon, selector: "ai-icon, [ai-icon]", inputs: ["icon", "size", "type", "disabled", "class"], exportAs: ["aiIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarousel, decorators: [{
+            type: Component,
+            args: [{ selector: "ai-carousel", exportAs: "aiCarousel", imports: [AiIcon], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [AiCarouselService], host: {
+                        role: "region",
+                        "aria-roledescription": "carousel",
+                        "[class]": "containerClasses()",
+                    }, template: "@if (showNav() && total() > 1) {\r\n    <button\r\n        type=\"button\"\r\n        [class]=\"navClasses\"\r\n        [disabled]=\"!canPrev()\"\r\n        (click)=\"prev()\"\r\n        aria-label=\"Slide anterior\">\r\n        <ai-icon icon=\"arrow-left-s\" size=\"sm\" />\r\n    </button>\r\n}\r\n\r\n<div [class]=\"viewportClasses()\">\r\n    <div [class]=\"trackClasses()\" [style.transform]=\"trackTransform()\">\r\n        <ng-content select=\"ai-carousel-item\" />\r\n    </div>\r\n\r\n    @if (showDots() && total() > 1) {\r\n        <div class=\"flex items-center justify-center gap-1.5 pt-3\">\r\n            @for (dot of dots(); track dot) {\r\n                <button\r\n                    type=\"button\"\r\n                    [class]=\"dotClasses(dot)\"\r\n                    (click)=\"goTo(dot)\"\r\n                    [attr.aria-label]=\"'Ir para slide ' + (dot + 1)\"\r\n                    [attr.aria-current]=\"dot === current() ? 'true' : null\">\r\n                </button>\r\n            }\r\n        </div>\r\n    }\r\n</div>\r\n\r\n@if (showNav() && total() > 1) {\r\n    <button\r\n        type=\"button\"\r\n        [class]=\"navClasses\"\r\n        [disabled]=\"!canNext()\"\r\n        (click)=\"next()\"\r\n        aria-label=\"Pr\u00F3ximo slide\">\r\n        <ai-icon icon=\"arrow-right-s\" size=\"sm\" />\r\n    </button>\r\n}\r\n" }]
+        }], propDecorators: { items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => AiCarouselItem), { isSignal: true }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], autoplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoplay", required: false }] }], autoplayInterval: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoplayInterval", required: false }] }], showDots: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDots", required: false }] }], showNav: [{ type: i0.Input, args: [{ isSignal: true, alias: "showNav", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], slideChange: [{ type: i0.Output, args: ["slideChange"] }] } });
+//# sourceMappingURL=carousel.js.map

package/esm2022/lib/components/carousel/carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/carousel/carousel.ts","../../../../../../../libs/ai-ui/src/lib/components/carousel/carousel.html"],"names":[],"mappings":"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","sourcesContent":["import { ClassValue } from \"clsx\";\r\n\r\nimport { AfterContentInit, ChangeDetectionStrategy, Component, computed, contentChildren, ElementRef, inject, input, OnInit, output, ViewEncapsulation } from \"@angular/core\";\r\n\r\nimport { mergeClasses, transform } from \"../../core\";\r\nimport { AiIcon } from \"../icon\";\r\nimport { AiCarouselService } from \"./carousel.service\";\r\nimport { carouselDotVariants, carouselItemVariants, carouselNavVariants, carouselTrackVariants, carouselVariants, CarouselVariants } from \"./carousel.variants\";\r\n\r\n@Component({\r\n    selector: \"ai-carousel-item\",\r\n    exportAs: \"aiCarouselItem\",\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None,\r\n    template: `<ng-content />`,\r\n    host: {\r\n        \"[class]\": \"classes()\",\r\n    },\r\n})\r\nexport class AiCarouselItem {\r\n    readonly orientation = input<CarouselVariants[\"orientation\"]>(\"horizontal\");\r\n    readonly class = input<ClassValue>(\"\");\r\n\r\n    protected readonly classes = computed(() => mergeClasses(carouselItemVariants({ orientation: this.orientation() }), \"px-2\", this.class()));\r\n}\r\n\r\n@Component({\r\n    selector: \"ai-carousel\",\r\n    exportAs: \"aiCarousel\",\r\n    imports: [AiIcon],\r\n    templateUrl: \"./carousel.html\",\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None,\r\n    providers: [AiCarouselService],\r\n    host: {\r\n        role: \"region\",\r\n        \"aria-roledescription\": \"carousel\",\r\n        \"[class]\": \"containerClasses()\",\r\n    },\r\n})\r\nexport class AiCarousel implements OnInit, AfterContentInit {\r\n    readonly #el = inject(ElementRef);\r\n    readonly #service = inject(AiCarouselService);\r\n\r\n    readonly items = contentChildren(AiCarouselItem);\r\n\r\n    readonly orientation = input<CarouselVariants[\"orientation\"]>(\"horizontal\");\r\n    readonly loop = input<boolean, string | boolean>(false, { transform });\r\n    readonly autoplay = input<boolean, string | boolean>(false, { transform });\r\n    readonly autoplayInterval = input<number>(4000);\r\n    readonly showDots = input<boolean, string | boolean>(true, { transform });\r\n    readonly showNav = input<boolean, string | boolean>(true, { transform });\r\n    readonly class = input<ClassValue>(\"\");\r\n\r\n    readonly slideChange = output<number>();\r\n\r\n    readonly current = computed(() => this.#service.current());\r\n    readonly dragging = computed(() => this.#service.dragging());\r\n    readonly total = computed(() => this.items().length);\r\n    readonly canPrev = computed(() => this.#service.canPrev());\r\n    readonly canNext = computed(() => this.#service.canNext());\r\n\r\n    protected readonly containerClasses = computed(() => mergeClasses(\"flex items-center gap-2\", this.class()));\r\n    protected readonly viewportClasses = computed(() => mergeClasses(carouselVariants({ orientation: this.orientation() })));\r\n    protected readonly trackClasses = computed(() => mergeClasses(carouselTrackVariants({ orientation: this.orientation(), dragging: this.dragging() })));\r\n    protected readonly trackTransform = computed(() => {\r\n        const offset = -(this.current() * 100) + this.#service.dragOffset();\r\n        return this.orientation() === \"horizontal\" ? `translateX(${offset}%)` : `translateY(${offset}%)`;\r\n    });\r\n\r\n    protected navClasses = mergeClasses(carouselNavVariants());\r\n\r\n    protected dotClasses(index: number) {\r\n        return mergeClasses(carouselDotVariants({ active: index === this.current() }));\r\n    }\r\n\r\n    protected dots = computed(() => Array.from({ length: this.total() }, (_, i) => i));\r\n\r\n    ngOnInit() {\r\n        this.#service.configure({\r\n            total: this.items().length,\r\n            loop: this.loop(),\r\n            autoplay: this.autoplay(),\r\n            autoplayInterval: this.autoplayInterval(),\r\n            orientation: this.orientation() ?? \"horizontal\",\r\n            onChange: index => this.slideChange.emit(index),\r\n        });\r\n\r\n        this.#service.setupDrag(this.#el);\r\n    }\r\n\r\n    ngAfterContentInit() {\r\n        this.#service.configure({\r\n            total: this.items().length,\r\n            loop: this.loop(),\r\n            autoplay: this.autoplay(),\r\n            autoplayInterval: this.autoplayInterval(),\r\n            orientation: this.orientation() ?? \"horizontal\",\r\n            onChange: index => this.slideChange.emit(index),\r\n        });\r\n\r\n        this.#service.startAutoplay();\r\n    }\r\n\r\n    prev() {\r\n        this.#service.prev();\r\n    }\r\n\r\n    next() {\r\n        this.#service.next();\r\n    }\r\n\r\n    goTo(index: number) {\r\n        this.#service.goTo(index);\r\n    }\r\n}\r\n","@if (showNav() && total() > 1) {\r\n    <button\r\n        type=\"button\"\r\n        [class]=\"navClasses\"\r\n        [disabled]=\"!canPrev()\"\r\n        (click)=\"prev()\"\r\n        aria-label=\"Slide anterior\">\r\n        <ai-icon icon=\"arrow-left-s\" size=\"sm\" />\r\n    </button>\r\n}\r\n\r\n<div [class]=\"viewportClasses()\">\r\n    <div [class]=\"trackClasses()\" [style.transform]=\"trackTransform()\">\r\n        <ng-content select=\"ai-carousel-item\" />\r\n    </div>\r\n\r\n    @if (showDots() && total() > 1) {\r\n        <div class=\"flex items-center justify-center gap-1.5 pt-3\">\r\n            @for (dot of dots(); track dot) {\r\n                <button\r\n                    type=\"button\"\r\n                    [class]=\"dotClasses(dot)\"\r\n                    (click)=\"goTo(dot)\"\r\n                    [attr.aria-label]=\"'Ir para slide ' + (dot + 1)\"\r\n                    [attr.aria-current]=\"dot === current() ? 'true' : null\">\r\n                </button>\r\n            }\r\n        </div>\r\n    }\r\n</div>\r\n\r\n@if (showNav() && total() > 1) {\r\n    <button\r\n        type=\"button\"\r\n        [class]=\"navClasses\"\r\n        [disabled]=\"!canNext()\"\r\n        (click)=\"next()\"\r\n        aria-label=\"Próximo slide\">\r\n        <ai-icon icon=\"arrow-right-s\" size=\"sm\" />\r\n    </button>\r\n}\r\n"]}

package/esm2022/lib/components/carousel/carousel.service.js

@@ -0,0 +1,137 @@
+import { fromEvent, merge } from "rxjs";
+import { DestroyRef, inject, Injectable, signal } from "@angular/core";
+import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
+import * as i0 from "@angular/core";
+export class AiCarouselService {
+    #destroyRef = inject(DestroyRef);
+    current = signal(0, ...(ngDevMode ? [{ debugName: "current" }] : []));
+    dragging = signal(false, ...(ngDevMode ? [{ debugName: "dragging" }] : []));
+    dragOffset = signal(0, ...(ngDevMode ? [{ debugName: "dragOffset" }] : []));
+    #total = 0;
+    #loop = false;
+    #autoplay = false;
+    #autoplayInterval = 4000;
+    #dragStartX = 0;
+    #dragStartY = 0;
+    #orientation = "horizontal";
+    #autoplayTimer = null;
+    #onChange = null;
+    configure(options) {
+        this.#total = options.total;
+        this.#loop = options.loop;
+        this.#autoplay = options.autoplay;
+        this.#autoplayInterval = options.autoplayInterval;
+        this.#orientation = options.orientation;
+        this.#onChange = options.onChange;
+    }
+    canPrev() {
+        return this.#loop || this.current() > 0;
+    }
+    canNext() {
+        return this.#loop || this.current() < this.#total - 1;
+    }
+    prev() {
+        if (this.#total === 0)
+            return;
+        const current = this.current();
+        if (current > 0) {
+            this._goTo(current - 1);
+        }
+        else if (this.#loop) {
+            this._goTo(this.#total - 1);
+        }
+    }
+    next() {
+        if (this.#total === 0)
+            return;
+        const current = this.current();
+        if (current < this.#total - 1) {
+            this._goTo(current + 1);
+        }
+        else if (this.#loop) {
+            this._goTo(0);
+        }
+    }
+    goTo(index) {
+        this._goTo(index);
+    }
+    setupDrag(elRef) {
+        const el = elRef.nativeElement;
+        const mouseDown$ = fromEvent(el, "mousedown");
+        const mouseMove$ = fromEvent(document, "mousemove");
+        const mouseUp$ = fromEvent(document, "mouseup");
+        const touchStart$ = fromEvent(el, "touchstart", { passive: true });
+        const touchMove$ = fromEvent(document, "touchmove", { passive: true });
+        const touchEnd$ = fromEvent(document, "touchend");
+        merge(mouseDown$, touchStart$)
+            .pipe(takeUntilDestroyed(this.#destroyRef))
+            .subscribe(event => {
+            const point = this._getEventPoint(event);
+            this.#dragStartX = point.x;
+            this.#dragStartY = point.y;
+            this.dragging.set(true);
+        });
+        merge(mouseMove$, touchMove$)
+            .pipe(takeUntilDestroyed(this.#destroyRef))
+            .subscribe(event => {
+            if (!this.dragging())
+                return;
+            const point = this._getEventPoint(event);
+            const isH = this.#orientation === "horizontal";
+            const diff = isH ? point.x - this.#dragStartX : point.y - this.#dragStartY;
+            const size = isH ? el.offsetWidth : el.offsetHeight;
+            this.dragOffset.set((diff / size) * 100);
+        });
+        merge(mouseUp$, touchEnd$)
+            .pipe(takeUntilDestroyed(this.#destroyRef))
+            .subscribe(() => {
+            if (!this.dragging())
+                return;
+            const offset = this.dragOffset();
+            const threshold = 15;
+            if (offset < -threshold) {
+                this.next();
+            }
+            else if (offset > threshold) {
+                this.prev();
+            }
+            this.dragOffset.set(0);
+            this.dragging.set(false);
+        });
+    }
+    startAutoplay() {
+        if (!this.#autoplay)
+            return;
+        this._stopAutoplay();
+        this.#autoplayTimer = setInterval(() => this.next(), this.#autoplayInterval);
+    }
+    _goTo(index) {
+        this.current.set(index);
+        this.#onChange?.(index);
+        this._restartAutoplay();
+    }
+    _getEventPoint(event) {
+        if ("touches" in event) {
+            const touch = event.touches[0] ?? event.changedTouches[0];
+            return { x: touch.clientX, y: touch.clientY };
+        }
+        return { x: event.clientX, y: event.clientY };
+    }
+    _stopAutoplay() {
+        if (this.#autoplayTimer) {
+            clearInterval(this.#autoplayTimer);
+            this.#autoplayTimer = null;
+        }
+    }
+    _restartAutoplay() {
+        if (this.#autoplay) {
+            this.startAutoplay();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarouselService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarouselService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AiCarouselService, decorators: [{
+            type: Injectable
+        }] });
+//# sourceMappingURL=carousel.service.js.map

package/esm2022/lib/components/carousel/carousel.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.service.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/carousel/carousel.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { fromEvent, merge } from \"rxjs\";\r\n\r\nimport { DestroyRef, ElementRef, inject, Injectable, signal } from \"@angular/core\";\r\nimport { takeUntilDestroyed } from \"@angular/core/rxjs-interop\";\r\n\r\n@Injectable()\r\nexport class AiCarouselService {\r\n    readonly #destroyRef = inject(DestroyRef);\r\n\r\n    readonly current = signal(0);\r\n    readonly dragging = signal(false);\r\n    readonly dragOffset = signal(0);\r\n\r\n    #total = 0;\r\n    #loop = false;\r\n    #autoplay = false;\r\n    #autoplayInterval = 4000;\r\n    #dragStartX = 0;\r\n    #dragStartY = 0;\r\n    #orientation: \"horizontal\" | \"vertical\" = \"horizontal\";\r\n    #autoplayTimer: ReturnType<typeof setInterval> | null = null;\r\n    #onChange: ((index: number) => void) | null = null;\r\n\r\n    configure(options: { total: number; loop: boolean; autoplay: boolean; autoplayInterval: number; orientation: \"horizontal\" | \"vertical\"; onChange: (index: number) => void }) {\r\n        this.#total = options.total;\r\n        this.#loop = options.loop;\r\n        this.#autoplay = options.autoplay;\r\n        this.#autoplayInterval = options.autoplayInterval;\r\n        this.#orientation = options.orientation;\r\n        this.#onChange = options.onChange;\r\n    }\r\n\r\n    canPrev(): boolean {\r\n        return this.#loop || this.current() > 0;\r\n    }\r\n\r\n    canNext(): boolean {\r\n        return this.#loop || this.current() < this.#total - 1;\r\n    }\r\n\r\n    prev() {\r\n        if (this.#total === 0) return;\r\n        const current = this.current();\r\n        if (current > 0) {\r\n            this._goTo(current - 1);\r\n        } else if (this.#loop) {\r\n            this._goTo(this.#total - 1);\r\n        }\r\n    }\r\n\r\n    next() {\r\n        if (this.#total === 0) return;\r\n        const current = this.current();\r\n        if (current < this.#total - 1) {\r\n            this._goTo(current + 1);\r\n        } else if (this.#loop) {\r\n            this._goTo(0);\r\n        }\r\n    }\r\n\r\n    goTo(index: number) {\r\n        this._goTo(index);\r\n    }\r\n\r\n    setupDrag(elRef: ElementRef) {\r\n        const el = elRef.nativeElement as HTMLElement;\r\n\r\n        const mouseDown$ = fromEvent<MouseEvent>(el, \"mousedown\");\r\n        const mouseMove$ = fromEvent<MouseEvent>(document, \"mousemove\");\r\n        const mouseUp$ = fromEvent<MouseEvent>(document, \"mouseup\");\r\n        const touchStart$ = fromEvent<TouchEvent>(el, \"touchstart\", { passive: true });\r\n        const touchMove$ = fromEvent<TouchEvent>(document, \"touchmove\", { passive: true });\r\n        const touchEnd$ = fromEvent<TouchEvent>(document, \"touchend\");\r\n\r\n        merge(mouseDown$, touchStart$)\r\n            .pipe(takeUntilDestroyed(this.#destroyRef))\r\n            .subscribe(event => {\r\n                const point = this._getEventPoint(event);\r\n                this.#dragStartX = point.x;\r\n                this.#dragStartY = point.y;\r\n                this.dragging.set(true);\r\n            });\r\n\r\n        merge(mouseMove$, touchMove$)\r\n            .pipe(takeUntilDestroyed(this.#destroyRef))\r\n            .subscribe(event => {\r\n                if (!this.dragging()) return;\r\n                const point = this._getEventPoint(event);\r\n                const isH = this.#orientation === \"horizontal\";\r\n                const diff = isH ? point.x - this.#dragStartX : point.y - this.#dragStartY;\r\n                const size = isH ? el.offsetWidth : el.offsetHeight;\r\n                this.dragOffset.set((diff / size) * 100);\r\n            });\r\n\r\n        merge(mouseUp$, touchEnd$)\r\n            .pipe(takeUntilDestroyed(this.#destroyRef))\r\n            .subscribe(() => {\r\n                if (!this.dragging()) return;\r\n                const offset = this.dragOffset();\r\n                const threshold = 15;\r\n                if (offset < -threshold) {\r\n                    this.next();\r\n                } else if (offset > threshold) {\r\n                    this.prev();\r\n                }\r\n                this.dragOffset.set(0);\r\n                this.dragging.set(false);\r\n            });\r\n    }\r\n\r\n    startAutoplay() {\r\n        if (!this.#autoplay) return;\r\n        this._stopAutoplay();\r\n        this.#autoplayTimer = setInterval(() => this.next(), this.#autoplayInterval);\r\n    }\r\n\r\n    private _goTo(index: number) {\r\n        this.current.set(index);\r\n        this.#onChange?.(index);\r\n        this._restartAutoplay();\r\n    }\r\n\r\n    private _getEventPoint(event: MouseEvent | TouchEvent): { x: number; y: number } {\r\n        if (\"touches\" in event) {\r\n            const touch = event.touches[0] ?? event.changedTouches[0];\r\n            return { x: touch.clientX, y: touch.clientY };\r\n        }\r\n        return { x: event.clientX, y: event.clientY };\r\n    }\r\n\r\n    private _stopAutoplay() {\r\n        if (this.#autoplayTimer) {\r\n            clearInterval(this.#autoplayTimer);\r\n            this.#autoplayTimer = null;\r\n        }\r\n    }\r\n\r\n    private _restartAutoplay() {\r\n        if (this.#autoplay) {\r\n            this.startAutoplay();\r\n        }\r\n    }\r\n}\r\n"]}

package/esm2022/lib/components/carousel/carousel.variants.js

@@ -0,0 +1,62 @@
+import { cva } from "class-variance-authority";
+export const carouselVariants = cva("relative w-full overflow-hidden select-none", {
+    variants: {
+        orientation: {
+            horizontal: "",
+            vertical: "",
+        },
+    },
+    defaultVariants: {
+        orientation: "horizontal",
+    },
+});
+export const carouselTrackVariants = cva("flex transition-transform duration-300 ease-out", {
+    variants: {
+        orientation: {
+            horizontal: "flex-row",
+            vertical: "flex-col",
+        },
+        dragging: {
+            true: "transition-none",
+            false: "",
+        },
+    },
+    defaultVariants: {
+        orientation: "horizontal",
+        dragging: false,
+    },
+});
+export const carouselItemVariants = cva("min-w-0 shrink-0 grow-0", {
+    variants: {
+        orientation: {
+            horizontal: "w-full",
+            vertical: "h-full",
+        },
+    },
+    defaultVariants: {
+        orientation: "horizontal",
+    },
+});
+export const carouselNavVariants = cva("inline-flex items-center justify-center rounded-full border border-border bg-background text-foreground shadow-sm cursor-pointer hover:bg-muted disabled:pointer-events-none disabled:opacity-50 transition-colors", {
+    variants: {
+        size: {
+            sm: "size-7",
+            md: "size-9",
+        },
+    },
+    defaultVariants: {
+        size: "md",
+    },
+});
+export const carouselDotVariants = cva("rounded-full cursor-pointer transition-all duration-200", {
+    variants: {
+        active: {
+            true: "bg-primary w-6 h-2",
+            false: "bg-muted-foreground/30 hover:bg-muted-foreground/50 size-2",
+        },
+    },
+    defaultVariants: {
+        active: false,
+    },
+});
+//# sourceMappingURL=carousel.variants.js.map

package/esm2022/lib/components/carousel/carousel.variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.variants.js","sourceRoot":"","sources":["../../../../../../../libs/ai-ui/src/lib/components/carousel/carousel.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAgB,MAAM,0BAA0B,CAAC;AAE7D,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAC,6CAA6C,EAAE;IAC/E,QAAQ,EAAE;QACN,WAAW,EAAE;YACT,UAAU,EAAE,EAAE;YACd,QAAQ,EAAE,EAAE;SACf;KACJ;IACD,eAAe,EAAE;QACb,WAAW,EAAE,YAAY;KAC5B;CACJ,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC,iDAAiD,EAAE;IACxF,QAAQ,EAAE;QACN,WAAW,EAAE;YACT,UAAU,EAAE,UAAU;YACtB,QAAQ,EAAE,UAAU;SACvB;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,iBAAiB;YACvB,KAAK,EAAE,EAAE;SACZ;KACJ;IACD,eAAe,EAAE;QACb,WAAW,EAAE,YAAY;QACzB,QAAQ,EAAE,KAAK;KAClB;CACJ,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAC,yBAAyB,EAAE;IAC/D,QAAQ,EAAE;QACN,WAAW,EAAE;YACT,UAAU,EAAE,QAAQ;YACpB,QAAQ,EAAE,QAAQ;SACrB;KACJ;IACD,eAAe,EAAE;QACb,WAAW,EAAE,YAAY;KAC5B;CACJ,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,CAClC,oNAAoN,EACpN;IACI,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,EAAE,EAAE,QAAQ;YACZ,EAAE,EAAE,QAAQ;SACf;KACJ;IACD,eAAe,EAAE;QACb,IAAI,EAAE,IAAI;KACb;CACJ,CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,CAAC,yDAAyD,EAAE;IAC9F,QAAQ,EAAE;QACN,MAAM,EAAE;YACJ,IAAI,EAAE,oBAAoB;YAC1B,KAAK,EAAE,4DAA4D;SACtE;KACJ;IACD,eAAe,EAAE;QACb,MAAM,EAAE,KAAK;KAChB;CACJ,CAAC,CAAC","sourcesContent":["import { cva, VariantProps } from \"class-variance-authority\";\r\n\r\nexport const carouselVariants = cva(\"relative w-full overflow-hidden select-none\", {\r\n    variants: {\r\n        orientation: {\r\n            horizontal: \"\",\r\n            vertical: \"\",\r\n        },\r\n    },\r\n    defaultVariants: {\r\n        orientation: \"horizontal\",\r\n    },\r\n});\r\n\r\nexport const carouselTrackVariants = cva(\"flex transition-transform duration-300 ease-out\", {\r\n    variants: {\r\n        orientation: {\r\n            horizontal: \"flex-row\",\r\n            vertical: \"flex-col\",\r\n        },\r\n        dragging: {\r\n            true: \"transition-none\",\r\n            false: \"\",\r\n        },\r\n    },\r\n    defaultVariants: {\r\n        orientation: \"horizontal\",\r\n        dragging: false,\r\n    },\r\n});\r\n\r\nexport const carouselItemVariants = cva(\"min-w-0 shrink-0 grow-0\", {\r\n    variants: {\r\n        orientation: {\r\n            horizontal: \"w-full\",\r\n            vertical: \"h-full\",\r\n        },\r\n    },\r\n    defaultVariants: {\r\n        orientation: \"horizontal\",\r\n    },\r\n});\r\n\r\nexport const carouselNavVariants = cva(\r\n    \"inline-flex items-center justify-center rounded-full border border-border bg-background text-foreground shadow-sm cursor-pointer hover:bg-muted disabled:pointer-events-none disabled:opacity-50 transition-colors\",\r\n    {\r\n        variants: {\r\n            size: {\r\n                sm: \"size-7\",\r\n                md: \"size-9\",\r\n            },\r\n        },\r\n        defaultVariants: {\r\n            size: \"md\",\r\n        },\r\n    },\r\n);\r\n\r\nexport const carouselDotVariants = cva(\"rounded-full cursor-pointer transition-all duration-200\", {\r\n    variants: {\r\n        active: {\r\n            true: \"bg-primary w-6 h-2\",\r\n            false: \"bg-muted-foreground/30 hover:bg-muted-foreground/50 size-2\",\r\n        },\r\n    },\r\n    defaultVariants: {\r\n        active: false,\r\n    },\r\n});\r\n\r\nexport type CarouselVariants = VariantProps<typeof carouselVariants>;\r\n"]}

package/esm2022/lib/components/carousel/demo/autoplay.js

@@ -0,0 +1,44 @@
+import { Component } from "@angular/core";
+import { AiCarousel, AiCarouselItem } from "../carousel";
+import * as i0 from "@angular/core";
+export class DemoCarouselAutoplayComponent {
+    slides = [
+        { id: 1, label: "Promoção 1", bg: "bg-primary", textColor: "text-primary-foreground" },
+        { id: 2, label: "Promoção 2", bg: "bg-accent", textColor: "text-accent-foreground" },
+        { id: 3, label: "Promoção 3", bg: "bg-success", textColor: "text-success-foreground" },
+    ];
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCarouselAutoplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: DemoCarouselAutoplayComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+        <div class="w-full max-w-md mx-auto">
+            <ai-carousel autoplay [autoplayInterval]="3000" loop>
+                @for (slide of slides; track slide.id) {
+                    <ai-carousel-item>
+                        <div class="flex items-center justify-center h-52 rounded-lg" [class]="slide.bg">
+                            <span class="text-2xl font-semibold" [class]="slide.textColor">{{ slide.label }}</span>
+                        </div>
+                    </ai-carousel-item>
+                }
+            </ai-carousel>
+        </div>
+    `, isInline: true, dependencies: [{ kind: "component", type: AiCarousel, selector: "ai-carousel", inputs: ["orientation", "loop", "autoplay", "autoplayInterval", "showDots", "showNav", "class"], outputs: ["slideChange"], exportAs: ["aiCarousel"] }, { kind: "component", type: AiCarouselItem, selector: "ai-carousel-item", inputs: ["orientation", "class"], exportAs: ["aiCarouselItem"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCarouselAutoplayComponent, decorators: [{
+            type: Component,
+            args: [{
+                    imports: [AiCarousel, AiCarouselItem],
+                    template: `
+        <div class="w-full max-w-md mx-auto">
+            <ai-carousel autoplay [autoplayInterval]="3000" loop>
+                @for (slide of slides; track slide.id) {
+                    <ai-carousel-item>
+                        <div class="flex items-center justify-center h-52 rounded-lg" [class]="slide.bg">
+                            <span class="text-2xl font-semibold" [class]="slide.textColor">{{ slide.label }}</span>
+                        </div>
+                    </ai-carousel-item>
+                }
+            </ai-carousel>
+        </div>
+    `,
+                }]
+        }] });
+//# sourceMappingURL=autoplay.js.map

package/esm2022/lib/components/carousel/demo/autoplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"autoplay.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/carousel/demo/autoplay.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;;AAkBzD,MAAM,OAAO,6BAA6B;IACtC,MAAM,GAAG;QACL,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,yBAAyB,EAAE;QACtF,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,wBAAwB,EAAE;QACpF,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,yBAAyB,EAAE;KACzF,CAAC;uGALO,6BAA6B;2FAA7B,6BAA6B,wEAd5B;;;;;;;;;;;;KAYT,4DAbS,UAAU,6MAAE,cAAc;;2FAe3B,6BAA6B;kBAhBzC,SAAS;mBAAC;oBACP,OAAO,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC;oBACrC,QAAQ,EAAE;;;;;;;;;;;;KAYT;iBACJ","sourcesContent":["import { Component } from \"@angular/core\";\r\n\r\nimport { AiCarousel, AiCarouselItem } from \"../carousel\";\r\n\r\n@Component({\r\n    imports: [AiCarousel, AiCarouselItem],\r\n    template: `\r\n        <div class=\"w-full max-w-md mx-auto\">\r\n            <ai-carousel autoplay [autoplayInterval]=\"3000\" loop>\r\n                @for (slide of slides; track slide.id) {\r\n                    <ai-carousel-item>\r\n                        <div class=\"flex items-center justify-center h-52 rounded-lg\" [class]=\"slide.bg\">\r\n                            <span class=\"text-2xl font-semibold\" [class]=\"slide.textColor\">{{ slide.label }}</span>\r\n                        </div>\r\n                    </ai-carousel-item>\r\n                }\r\n            </ai-carousel>\r\n        </div>\r\n    `,\r\n})\r\nexport class DemoCarouselAutoplayComponent {\r\n    slides = [\r\n        { id: 1, label: \"Promoção 1\", bg: \"bg-primary\", textColor: \"text-primary-foreground\" },\r\n        { id: 2, label: \"Promoção 2\", bg: \"bg-accent\", textColor: \"text-accent-foreground\" },\r\n        { id: 3, label: \"Promoção 3\", bg: \"bg-success\", textColor: \"text-success-foreground\" },\r\n    ];\r\n}\r\n"]}

package/esm2022/lib/components/carousel/demo/carousel.js

@@ -0,0 +1,21 @@
+import { DemoCarouselAutoplayComponent } from "./autoplay";
+import { DemoCarouselDefaultComponent } from "./default";
+import { DemoCarouselLoopComponent } from "./loop";
+export const CAROUSEL = {
+    componentName: "carousel",
+    examples: [
+        {
+            name: "default",
+            component: DemoCarouselDefaultComponent,
+        },
+        {
+            name: "autoplay",
+            component: DemoCarouselAutoplayComponent,
+        },
+        {
+            name: "loop",
+            component: DemoCarouselLoopComponent,
+        },
+    ],
+};
+//# sourceMappingURL=carousel.js.map

package/esm2022/lib/components/carousel/demo/carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/carousel/demo/carousel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,YAAY,CAAC;AAC3D,OAAO,EAAE,4BAA4B,EAAE,MAAM,WAAW,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,QAAQ,CAAC;AAEnD,MAAM,CAAC,MAAM,QAAQ,GAAG;IACpB,aAAa,EAAE,UAAU;IACzB,QAAQ,EAAE;QACN;YACI,IAAI,EAAE,SAAS;YACf,SAAS,EAAE,4BAA4B;SAC1C;QACD;YACI,IAAI,EAAE,UAAU;YAChB,SAAS,EAAE,6BAA6B;SAC3C;QACD;YACI,IAAI,EAAE,MAAM;YACZ,SAAS,EAAE,yBAAyB;SACvC;KACJ;CACJ,CAAC","sourcesContent":["import { DemoCarouselAutoplayComponent } from \"./autoplay\";\r\nimport { DemoCarouselDefaultComponent } from \"./default\";\r\nimport { DemoCarouselLoopComponent } from \"./loop\";\r\n\r\nexport const CAROUSEL = {\r\n    componentName: \"carousel\",\r\n    examples: [\r\n        {\r\n            name: \"default\",\r\n            component: DemoCarouselDefaultComponent,\r\n        },\r\n        {\r\n            name: \"autoplay\",\r\n            component: DemoCarouselAutoplayComponent,\r\n        },\r\n        {\r\n            name: \"loop\",\r\n            component: DemoCarouselLoopComponent,\r\n        },\r\n    ],\r\n};\r\n"]}

package/esm2022/lib/components/carousel/demo/default.js

@@ -0,0 +1,46 @@
+import { Component } from "@angular/core";
+import { AiCarousel, AiCarouselItem } from "../carousel";
+import * as i0 from "@angular/core";
+export class DemoCarouselDefaultComponent {
+    slides = [
+        { id: 1, label: "Slide 1" },
+        { id: 2, label: "Slide 2" },
+        { id: 3, label: "Slide 3" },
+        { id: 4, label: "Slide 4" },
+        { id: 5, label: "Slide 5" },
+    ];
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCarouselDefaultComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: DemoCarouselDefaultComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+        <div class="w-full max-w-md mx-auto">
+            <ai-carousel>
+                @for (slide of slides; track slide.id) {
+                    <ai-carousel-item>
+                        <div class="flex items-center justify-center h-52 rounded-lg bg-muted">
+                            <span class="text-2xl font-semibold text-muted-foreground">{{ slide.label }}</span>
+                        </div>
+                    </ai-carousel-item>
+                }
+            </ai-carousel>
+        </div>
+    `, isInline: true, dependencies: [{ kind: "component", type: AiCarousel, selector: "ai-carousel", inputs: ["orientation", "loop", "autoplay", "autoplayInterval", "showDots", "showNav", "class"], outputs: ["slideChange"], exportAs: ["aiCarousel"] }, { kind: "component", type: AiCarouselItem, selector: "ai-carousel-item", inputs: ["orientation", "class"], exportAs: ["aiCarouselItem"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DemoCarouselDefaultComponent, decorators: [{
+            type: Component,
+            args: [{
+                    imports: [AiCarousel, AiCarouselItem],
+                    template: `
+        <div class="w-full max-w-md mx-auto">
+            <ai-carousel>
+                @for (slide of slides; track slide.id) {
+                    <ai-carousel-item>
+                        <div class="flex items-center justify-center h-52 rounded-lg bg-muted">
+                            <span class="text-2xl font-semibold text-muted-foreground">{{ slide.label }}</span>
+                        </div>
+                    </ai-carousel-item>
+                }
+            </ai-carousel>
+        </div>
+    `,
+                }]
+        }] });
+//# sourceMappingURL=default.js.map

package/esm2022/lib/components/carousel/demo/default.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"default.js","sourceRoot":"","sources":["../../../../../../../../libs/ai-ui/src/lib/components/carousel/demo/default.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;;AAkBzD,MAAM,OAAO,4BAA4B;IACrC,MAAM,GAAG;QACL,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE;QAC3B,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE;QAC3B,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE;QAC3B,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE;QAC3B,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE;KAC9B,CAAC;uGAPO,4BAA4B;2FAA5B,4BAA4B,wEAd3B;;;;;;;;;;;;KAYT,4DAbS,UAAU,6MAAE,cAAc;;2FAe3B,4BAA4B;kBAhBxC,SAAS;mBAAC;oBACP,OAAO,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC;oBACrC,QAAQ,EAAE;;;;;;;;;;;;KAYT;iBACJ","sourcesContent":["import { Component } from \"@angular/core\";\r\n\r\nimport { AiCarousel, AiCarouselItem } from \"../carousel\";\r\n\r\n@Component({\r\n    imports: [AiCarousel, AiCarouselItem],\r\n    template: `\r\n        <div class=\"w-full max-w-md mx-auto\">\r\n            <ai-carousel>\r\n                @for (slide of slides; track slide.id) {\r\n                    <ai-carousel-item>\r\n                        <div class=\"flex items-center justify-center h-52 rounded-lg bg-muted\">\r\n                            <span class=\"text-2xl font-semibold text-muted-foreground\">{{ slide.label }}</span>\r\n                        </div>\r\n                    </ai-carousel-item>\r\n                }\r\n            </ai-carousel>\r\n        </div>\r\n    `,\r\n})\r\nexport class DemoCarouselDefaultComponent {\r\n    slides = [\r\n        { id: 1, label: \"Slide 1\" },\r\n        { id: 2, label: \"Slide 2\" },\r\n        { id: 3, label: \"Slide 3\" },\r\n        { id: 4, label: \"Slide 4\" },\r\n        { id: 5, label: \"Slide 5\" },\r\n    ];\r\n}\r\n"]}