@ojiepermana/angular 22.1.11 → 22.1.12

package/fesm2022/ojiepermana-angular-component-card.mjs

@@ -1,7 +1,171 @@
-export * from '@ojiepermana/angular-component/card';
+import * as i0 from '@angular/core';
+import { inject, input, computed, Component, ElementRef, numberAttribute } from '@angular/core';
+import { cn } from '@ojiepermana/angular/component/utils/core';
+import * as i1 from '@ojiepermana/angular/component/utils/scale';
+import { ComponentScaleDirective } from '@ojiepermana/angular/component/utils/scale';
 
-// Generated by scripts/gen-umbrella-entrypoints.mjs — do not edit by hand.
+class CardComponent {
+    componentScale = inject(ComponentScaleDirective);
+    radius = this.componentScale.radius;
+    density = this.componentScale.density;
+    size = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn('block rounded-lg border border-border bg-card text-card-foreground shadow-sm', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardComponent, isStandalone: true, selector: "Card", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.data-size": "size()" } }, hostDirectives: [{ directive: i1.ComponentScaleDirective, inputs: ["radius", "radius", "density", "density"] }], ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'Card',
+                    hostDirectives: [
+                        {
+                            directive: ComponentScaleDirective,
+                            inputs: ['radius', 'density'],
+                        },
+                    ],
+                    host: {
+                        '[class]': 'classes()',
+                        '[attr.data-size]': 'size()',
+                    },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+class CardHeaderComponent {
+    card = inject(CardComponent, { optional: true });
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(this.card?.size() === 'sm'
+        ? 'grid auto-rows-min grid-cols-[1fr_auto] items-start gap-1 p-4'
+        : 'grid auto-rows-min grid-cols-[1fr_auto] items-start gap-1.5 p-6', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardHeaderComponent, isStandalone: true, selector: "CardHeader", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardHeaderComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CardHeader',
+                    host: { '[class]': 'classes()' },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+class CardTitleComponent {
+    card = inject(CardComponent, { optional: true });
+    element = inject(ElementRef);
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    /** Heading level for custom `<CardTitle>` hosts; native h1-h6 infer their own level. */
+    level = input(null, { ...(ngDevMode ? { debugName: "level" } : /* istanbul ignore next */ {}), transform: (value) => (value == null ? null : numberAttribute(value)) });
+    resolvedLevel = computed(() => {
+        const explicit = this.level();
+        if (explicit !== null) {
+            return Math.min(6, Math.max(1, Math.round(explicit)));
+        }
+        const nativeLevel = /^H([1-6])$/.exec(this.element.nativeElement.tagName)?.[1];
+        return nativeLevel ? Number(nativeLevel) : 3;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedLevel" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(this.card?.size() === 'sm'
+        ? 'block col-start-1 text-base font-semibold leading-none tracking-tight'
+        : 'block col-start-1 text-lg font-semibold leading-none tracking-tight', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardTitleComponent, isStandalone: true, selector: "CardTitle, [CardTitle]", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "heading" }, properties: { "class": "classes()", "attr.aria-level": "resolvedLevel()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardTitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CardTitle, [CardTitle]',
+                    host: {
+                        '[class]': 'classes()',
+                        role: 'heading',
+                        '[attr.aria-level]': 'resolvedLevel()',
+                    },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }] } });
+
+class CardDescriptionComponent {
+    card = inject(CardComponent, { optional: true });
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(this.card?.size() === 'sm'
+        ? 'block col-start-1 text-xs text-muted-foreground'
+        : 'block col-start-1 text-sm text-muted-foreground', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardDescriptionComponent, isStandalone: true, selector: "CardDescription, p[CardDescription]", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardDescriptionComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CardDescription, p[CardDescription]',
+                    host: { '[class]': 'classes()' },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+class CardActionComponent {
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn('col-start-2 row-span-2 row-start-1 flex items-center self-start justify-self-end', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardActionComponent, isStandalone: true, selector: "CardAction", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardActionComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CardAction',
+                    host: { '[class]': 'classes()' },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+class CardContentComponent {
+    card = inject(CardComponent, { optional: true });
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(this.card?.size() === 'sm' ? 'block p-4 pt-0' : 'block p-6 pt-0', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardContentComponent, isStandalone: true, selector: "CardContent", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardContentComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CardContent',
+                    host: { '[class]': 'classes()' },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+class CardFooterComponent {
+    card = inject(CardComponent, { optional: true });
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(this.card?.size() === 'sm' ? 'flex items-center p-4 pt-0' : 'flex items-center p-6 pt-0', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CardFooterComponent, isStandalone: true, selector: "CardFooter", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CardFooterComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CardFooter',
+                    host: { '[class]': 'classes()' },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.
- */
+ */
+
+export { CardActionComponent, CardComponent, CardContentComponent, CardDescriptionComponent, CardFooterComponent, CardHeaderComponent, CardTitleComponent };

package/fesm2022/ojiepermana-angular-component-carousel.mjs

@@ -1,7 +1,330 @@
-export * from '@ojiepermana/angular-component/carousel';
+import { isPlatformBrowser } from '@angular/common';
+import * as i0 from '@angular/core';
+import { Directive, input, output, signal, inject, PLATFORM_ID, computed, effect, forwardRef, Component, viewChild } from '@angular/core';
+import EmblaCarousel from 'embla-carousel';
+import { cn } from '@ojiepermana/angular/component/utils/core';
 
-// Generated by scripts/gen-umbrella-entrypoints.mjs — do not edit by hand.
+class CarouselContextBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselContextBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: CarouselContextBase, isStandalone: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselContextBase, decorators: [{
+            type: Directive
+        }] });
+class CarouselComponent extends CarouselContextBase {
+    orientation = input('horizontal', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    opts = input({}, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "opts" }] : /* istanbul ignore next */ []));
+    plugins = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "plugins" }] : /* istanbul ignore next */ []));
+    keyboard = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "keyboard" }] : /* istanbul ignore next */ []));
+    label = input('Carousel', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    apiReady = output();
+    apiChange = output();
+    selectedIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "selectedIndex" }] : /* istanbul ignore next */ []));
+    slideCount = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "slideCount" }] : /* istanbul ignore next */ []));
+    canScrollPrev = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "canScrollPrev" }] : /* istanbul ignore next */ []));
+    canScrollNext = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "canScrollNext" }] : /* istanbul ignore next */ []));
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+    viewport = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "viewport" }] : /* istanbul ignore next */ []));
+    api = null;
+    classes = computed(() => cn('relative block', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    constructor() {
+        super();
+        effect((onCleanup) => {
+            const viewport = this.viewport();
+            const orientation = this.orientation();
+            const opts = this.opts();
+            const plugins = this.plugins();
+            if (!this.isBrowser || !viewport) {
+                this.api = null;
+                this.resetState();
+                return;
+            }
+            const carousel = EmblaCarousel(viewport, { ...opts, axis: orientation === 'horizontal' ? 'x' : 'y' }, [...plugins]);
+            const updateState = () => this.updateState(carousel);
+            this.api = carousel;
+            this.apiChange.emit(carousel);
+            this.apiReady.emit(carousel);
+            updateState();
+            carousel.on('select', updateState);
+            carousel.on('reInit', updateState);
+            carousel.on('resize', updateState);
+            onCleanup(() => {
+                carousel.destroy();
+                if (this.api === carousel) {
+                    this.api = null;
+                    this.apiChange.emit(null);
+                    this.resetState();
+                }
+            });
+        });
+    }
+    registerViewport(viewport) {
+        this.viewport.set(viewport);
+    }
+    unregisterViewport(viewport) {
+        if (this.viewport() === viewport) {
+            this.viewport.set(null);
+        }
+    }
+    scrollPrev() {
+        this.api?.scrollPrev();
+    }
+    scrollNext() {
+        this.api?.scrollNext();
+    }
+    scrollTo(index) {
+        this.api?.scrollTo(index);
+    }
+    onKeydown(event) {
+        if (!this.keyboard())
+            return;
+        const horizontal = this.orientation() === 'horizontal';
+        const previousKey = horizontal ? 'ArrowLeft' : 'ArrowUp';
+        const nextKey = horizontal ? 'ArrowRight' : 'ArrowDown';
+        if (event.key === previousKey) {
+            event.preventDefault();
+            this.scrollPrev();
+            return;
+        }
+        if (event.key === nextKey) {
+            event.preventDefault();
+            this.scrollNext();
+            return;
+        }
+        if (event.key === 'Home') {
+            event.preventDefault();
+            this.scrollTo(0);
+            return;
+        }
+        if (event.key === 'End') {
+            event.preventDefault();
+            this.scrollTo(Math.max(0, this.slideCount() - 1));
+        }
+    }
+    updateState(carousel) {
+        this.slideCount.set(carousel.scrollSnapList().length);
+        this.selectedIndex.set(carousel.selectedScrollSnap());
+        this.canScrollPrev.set(carousel.canScrollPrev());
+        this.canScrollNext.set(carousel.canScrollNext());
+    }
+    resetState() {
+        this.selectedIndex.set(0);
+        this.slideCount.set(0);
+        this.canScrollPrev.set(false);
+        this.canScrollNext.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CarouselComponent, isStandalone: true, selector: "Carousel", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, opts: { classPropertyName: "opts", publicName: "opts", isSignal: true, isRequired: false, transformFunction: null }, plugins: { classPropertyName: "plugins", publicName: "plugins", isSignal: true, isRequired: false, transformFunction: null }, keyboard: { classPropertyName: "keyboard", publicName: "keyboard", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apiReady: "apiReady", apiChange: "apiChange" }, host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "classes()", "attr.role": "\"region\"", "attr.aria-roledescription": "\"carousel\"", "attr.aria-label": "label()", "attr.data-orientation": "orientation()", "attr.tabindex": "keyboard() ? 0 : null" } }, providers: [{ provide: CarouselContextBase, useExisting: forwardRef(() => CarouselComponent) }], usesInheritance: true, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'Carousel',
+                    providers: [{ provide: CarouselContextBase, useExisting: forwardRef(() => CarouselComponent) }],
+                    host: {
+                        '[class]': 'classes()',
+                        '[attr.role]': '"region"',
+                        '[attr.aria-roledescription]': '"carousel"',
+                        '[attr.aria-label]': 'label()',
+                        '[attr.data-orientation]': 'orientation()',
+                        '[attr.tabindex]': 'keyboard() ? 0 : null',
+                        '(keydown)': 'onKeydown($event)',
+                    },
+                    template: `<ng-content />`,
+                }]
+        }], ctorParameters: () => [], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], opts: [{ type: i0.Input, args: [{ isSignal: true, alias: "opts", required: false }] }], plugins: [{ type: i0.Input, args: [{ isSignal: true, alias: "plugins", required: false }] }], keyboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyboard", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], apiReady: [{ type: i0.Output, args: ["apiReady"] }], apiChange: [{ type: i0.Output, args: ["apiChange"] }] } });
+class CarouselContentComponent {
+    ctx = inject(CarouselContextBase);
+    viewport = viewChild('viewport', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "viewport" }] : /* istanbul ignore next */ []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    contentClasses = computed(() => cn('flex', this.ctx.orientation() === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "contentClasses" }] : /* istanbul ignore next */ []));
+    ngAfterViewInit() {
+        const viewport = this.viewport()?.nativeElement;
+        if (viewport)
+            this.ctx.registerViewport(viewport);
+    }
+    ngOnDestroy() {
+        const viewport = this.viewport()?.nativeElement;
+        if (viewport)
+            this.ctx.unregisterViewport(viewport);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.4", type: CarouselContentComponent, isStandalone: true, selector: "CarouselContent", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "\"block\"" } }, viewQueries: [{ propertyName: "viewport", first: true, predicate: ["viewport"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div #viewport class="overflow-hidden">
+      <div [class]="contentClasses()"><ng-content /></div>
+    </div>
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselContentComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CarouselContent',
+                    host: {
+                        '[class]': '"block"',
+                    },
+                    template: `
+    <div #viewport class="overflow-hidden">
+      <div [class]="contentClasses()"><ng-content /></div>
+    </div>
+  `,
+                }]
+        }], propDecorators: { viewport: [{ type: i0.ViewChild, args: ['viewport', { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+class CarouselItemComponent {
+    ctx = inject(CarouselContextBase);
+    ariaLabel = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn('min-w-0 shrink-0 grow-0 basis-full', this.ctx.orientation() === 'horizontal' ? 'pl-4' : 'pt-4', this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CarouselItemComponent, isStandalone: true, selector: "CarouselItem", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.role": "\"group\"", "attr.aria-roledescription": "\"slide\"", "attr.aria-label": "ariaLabel()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'CarouselItem',
+                    host: {
+                        '[class]': 'classes()',
+                        '[attr.role]': '"group"',
+                        '[attr.aria-roledescription]': '"slide"',
+                        '[attr.aria-label]': 'ariaLabel()',
+                    },
+                    template: `<ng-content />`,
+                }]
+        }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+class CarouselPreviousComponent {
+    ctx = inject(CarouselContextBase);
+    label = input('Previous slide', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(carouselButtonClasses, carouselPreviousPlacement(this.ctx.orientation()), this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselPreviousComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CarouselPreviousComponent, isStandalone: true, selector: "button[CarouselPrevious]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "ctx.scrollPrev()" }, properties: { "class": "classes()", "attr.aria-label": "label()", "disabled": "!ctx.canScrollPrev() || null" } }, ngImport: i0, template: `
+    <svg
+      aria-hidden="true"
+      class="h-4 w-4"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="m15 18-6-6 6-6" />
+    </svg>
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselPreviousComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'button[CarouselPrevious]',
+                    host: {
+                        '[class]': 'classes()',
+                        type: 'button',
+                        '[attr.aria-label]': 'label()',
+                        '[disabled]': '!ctx.canScrollPrev() || null',
+                        '(click)': 'ctx.scrollPrev()',
+                    },
+                    template: `
+    <svg
+      aria-hidden="true"
+      class="h-4 w-4"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="m15 18-6-6 6-6" />
+    </svg>
+  `,
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+class CarouselNextComponent {
+    ctx = inject(CarouselContextBase);
+    label = input('Next slide', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(carouselButtonClasses, carouselNextPlacement(this.ctx.orientation()), this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselNextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: CarouselNextComponent, isStandalone: true, selector: "button[CarouselNext]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "ctx.scrollNext()" }, properties: { "class": "classes()", "attr.aria-label": "label()", "disabled": "!ctx.canScrollNext() || null" } }, ngImport: i0, template: `
+    <svg
+      aria-hidden="true"
+      class="h-4 w-4"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="m9 18 6-6-6-6" />
+    </svg>
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: CarouselNextComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'button[CarouselNext]',
+                    host: {
+                        '[class]': 'classes()',
+                        type: 'button',
+                        '[attr.aria-label]': 'label()',
+                        '[disabled]': '!ctx.canScrollNext() || null',
+                        '(click)': 'ctx.scrollNext()',
+                    },
+                    template: `
+    <svg
+      aria-hidden="true"
+      class="h-4 w-4"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="m9 18 6-6-6-6" />
+    </svg>
+  `,
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+const carouselButtonClasses = 'absolute inline-flex h-8 w-8 items-center justify-center rounded-full border border-border bg-background p-0 text-foreground shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50';
+function carouselPreviousPlacement(orientation) {
+    return orientation === 'horizontal'
+        ? '-left-12 top-1/2 -translate-y-1/2'
+        : '-top-12 left-1/2 -translate-x-1/2 rotate-90';
+}
+function carouselNextPlacement(orientation) {
+    return orientation === 'horizontal'
+        ? '-right-12 top-1/2 -translate-y-1/2'
+        : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90';
+}
 
 /**
  * Generated bundle index. Do not edit.
- */
+ */
+
+export { CarouselComponent, CarouselContentComponent, CarouselContextBase, CarouselItemComponent, CarouselNextComponent, CarouselPreviousComponent };