@ojiepermana/angular 22.1.13 → 22.2.0

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

@@ -1,268 +1,720 @@
-import * as i0 from '@angular/core';
-import { inject, input, ElementRef, computed, Component } 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';
-import { cva } from 'class-variance-authority';
-
+import * as i0 from "@angular/core";
+import { Component, ElementRef, computed, inject, input } 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";
+import { cva } from "class-variance-authority";
 const itemVariants = cva([
-    'flex w-full flex-wrap items-center gap-x-3 gap-y-3',
-    'text-foreground',
-    '[&[href]]:no-underline',
-].join(' '), {
-    variants: {
-        variant: {
-            default: 'bg-transparent',
-            outline: 'rounded-xl border border-border bg-background px-4 py-3 shadow-sm',
-            muted: 'rounded-xl bg-muted/50 px-4 py-3',
-        },
-        size: {
-            default: 'text-sm',
-            sm: 'gap-x-2.5 gap-y-2 text-sm',
-            xs: 'gap-x-2 gap-y-2 text-xs',
-        },
-        interactive: {
-            true: 'cursor-pointer rounded-xl transition-colors hover:bg-accent/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring',
-            false: '',
-        },
-    },
-    defaultVariants: {
-        variant: 'default',
-        size: 'default',
-        interactive: false,
-    },
+	"flex w-full flex-wrap items-center gap-x-3 gap-y-3",
+	"text-foreground",
+	"[&[href]]:no-underline"
+].join(" "), {
+	variants: {
+		variant: {
+			default: "bg-transparent",
+			outline: "rounded-xl border border-border bg-background px-4 py-3 shadow-sm",
+			muted: "rounded-xl bg-muted/50 px-4 py-3"
+		},
+		size: {
+			default: "text-sm",
+			sm: "gap-x-2.5 gap-y-2 text-sm",
+			xs: "gap-x-2 gap-y-2 text-xs"
+		},
+		interactive: {
+			true: "cursor-pointer rounded-xl transition-colors hover:bg-accent/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default",
+		interactive: false
+	}
 });
-const itemMediaVariants = cva('flex shrink-0 items-center justify-center text-muted-foreground', {
-    variants: {
-        variant: {
-            default: '[&>svg]:size-5 [&>svg]:shrink-0',
-            icon: 'border border-border bg-muted/50 [&>svg]:size-4 [&>svg]:shrink-0',
-            image: 'overflow-hidden [&>img]:h-full [&>img]:w-full [&>img]:object-cover',
-        },
-        size: {
-            default: '',
-            sm: '',
-            xs: '',
-        },
-    },
-    compoundVariants: [
-        { variant: 'icon', size: 'default', class: 'size-10 rounded-lg' },
-        { variant: 'icon', size: 'sm', class: 'size-9 rounded-md' },
-        { variant: 'icon', size: 'xs', class: 'size-8 rounded-md' },
-        { variant: 'image', size: 'default', class: 'h-10 w-10 rounded-md' },
-        { variant: 'image', size: 'sm', class: 'h-9 w-9 rounded-md' },
-        { variant: 'image', size: 'xs', class: 'h-8 w-8 rounded-sm' },
-    ],
-    defaultVariants: {
-        variant: 'default',
-        size: 'default',
-    },
+const itemMediaVariants = cva("flex shrink-0 items-center justify-center text-muted-foreground", {
+	variants: {
+		variant: {
+			default: "[&>svg]:size-5 [&>svg]:shrink-0",
+			icon: "border border-border bg-muted/50 [&>svg]:size-4 [&>svg]:shrink-0",
+			image: "overflow-hidden [&>img]:h-full [&>img]:w-full [&>img]:object-cover"
+		},
+		size: {
+			default: "",
+			sm: "",
+			xs: ""
+		}
+	},
+	compoundVariants: [
+		{
+			variant: "icon",
+			size: "default",
+			class: "size-10 rounded-lg"
+		},
+		{
+			variant: "icon",
+			size: "sm",
+			class: "size-9 rounded-md"
+		},
+		{
+			variant: "icon",
+			size: "xs",
+			class: "size-8 rounded-md"
+		},
+		{
+			variant: "image",
+			size: "default",
+			class: "h-10 w-10 rounded-md"
+		},
+		{
+			variant: "image",
+			size: "sm",
+			class: "h-9 w-9 rounded-md"
+		},
+		{
+			variant: "image",
+			size: "xs",
+			class: "h-8 w-8 rounded-sm"
+		}
+	],
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
 });
-
 const ITEM_TITLE_CLASSES = {
-    default: 'text-sm leading-5',
-    sm: 'text-sm leading-5',
-    xs: 'text-xs leading-4',
+	default: "text-sm leading-5",
+	sm: "text-sm leading-5",
+	xs: "text-xs leading-4"
 };
 const ITEM_DESCRIPTION_CLASSES = {
-    default: 'text-sm leading-5',
-    sm: 'text-xs leading-4',
-    xs: 'text-xs leading-4',
+	default: "text-sm leading-5",
+	sm: "text-xs leading-4",
+	xs: "text-xs leading-4"
 };
-class ItemComponent {
-    componentScale = inject(ComponentScaleDirective);
-    radius = this.componentScale.radius;
-    density = this.componentScale.density;
-    variant = input('default', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    size = input('default', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    host = inject(ElementRef);
-    interactive = ['a', 'button'].includes(this.host.nativeElement.tagName.toLowerCase());
-    classes = computed(() => cn(itemVariants({ variant: this.variant(), size: this.size(), interactive: this.interactive }), 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: ItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemComponent, isStandalone: true, selector: "Item, [Item]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, 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()", "attr.data-variant": "variant()", "attr.data-interactive": "interactive ? \"true\" : null" } }, 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: ItemComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'Item, [Item]',
-                    hostDirectives: [
-                        {
-                            directive: ComponentScaleDirective,
-                            inputs: ['radius', 'density'],
-                        },
-                    ],
-                    host: {
-                        '[class]': 'classes()',
-                        '[attr.data-size]': 'size()',
-                        '[attr.data-variant]': 'variant()',
-                        '[attr.data-interactive]': 'interactive ? "true" : null',
-                    },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemGroupComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn('flex w-full flex-col gap-3', 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: ItemGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemGroupComponent, isStandalone: true, selector: "ItemGroup", 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: ItemGroupComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemGroup',
-                    host: { '[class]': 'classes()' },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemSeparatorComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn('block h-px w-full bg-border', 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: ItemSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemSeparatorComponent, isStandalone: true, selector: "ItemSeparator", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "separator" }, properties: { "class": "classes()" } }, ngImport: i0, template: '', isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ItemSeparatorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemSeparator',
-                    host: {
-                        '[class]': 'classes()',
-                        role: 'separator',
-                    },
-                    template: '',
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemHeaderComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn('basis-full overflow-hidden rounded-lg', 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: ItemHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemHeaderComponent, isStandalone: true, selector: "ItemHeader", 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: ItemHeaderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemHeader',
-                    host: { '[class]': 'classes()' },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemMediaComponent {
-    variant = input('default', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    item = inject(ItemComponent, { optional: true });
-    classes = computed(() => cn(itemMediaVariants({ variant: this.variant(), size: this.item?.size() ?? 'default' }), 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: ItemMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemMediaComponent, isStandalone: true, selector: "ItemMedia", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.data-variant": "variant()" } }, ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ItemMediaComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemMedia',
-                    host: {
-                        '[class]': 'classes()',
-                        '[attr.data-variant]': 'variant()',
-                    },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemContentComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn('flex min-w-0 flex-1 basis-0 flex-col justify-center gap-0.5', 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: ItemContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemContentComponent, isStandalone: true, selector: "ItemContent", 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: ItemContentComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemContent',
-                    host: { '[class]': 'classes()' },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemTitleComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    item = inject(ItemComponent, { optional: true });
-    classes = computed(() => cn('block min-w-0 truncate font-medium text-foreground', ITEM_TITLE_CLASSES[this.item?.size() ?? 'default'], 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: ItemTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemTitleComponent, isStandalone: true, selector: "ItemTitle", 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: ItemTitleComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemTitle',
-                    host: { '[class]': 'classes()' },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemDescriptionComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    item = inject(ItemComponent, { optional: true });
-    classes = computed(() => cn('block min-w-0 text-muted-foreground', ITEM_DESCRIPTION_CLASSES[this.item?.size() ?? 'default'], 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: ItemDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemDescriptionComponent, isStandalone: true, selector: "ItemDescription", 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: ItemDescriptionComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemDescription',
-                    host: { '[class]': 'classes()' },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemActionsComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn('ms-auto flex shrink-0 items-center gap-2', 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: ItemActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemActionsComponent, isStandalone: true, selector: "ItemActions", 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: ItemActionsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemActions',
-                    host: { '[class]': 'classes()' },
-                    template: `<ng-content />`,
-                }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-class ItemFooterComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn('basis-full 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: ItemFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ItemFooterComponent, isStandalone: true, selector: "ItemFooter", 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: ItemFooterComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ItemFooter',
-                    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 { ItemActionsComponent, ItemComponent, ItemContentComponent, ItemDescriptionComponent, ItemFooterComponent, ItemGroupComponent, ItemHeaderComponent, ItemMediaComponent, ItemSeparatorComponent, ItemTitleComponent, itemMediaVariants, itemVariants };
+var ItemComponent = class ItemComponent {
+	componentScale = inject(ComponentScaleDirective);
+	radius = this.componentScale.radius;
+	density = this.componentScale.density;
+	variant = input("default", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
+	size = input("default", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	host = inject(ElementRef);
+	interactive = ["a", "button"].includes(this.host.nativeElement.tagName.toLowerCase());
+	classes = computed(() => cn(itemVariants({
+		variant: this.variant(),
+		size: this.size(),
+		interactive: this.interactive
+	}), this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemComponent,
+		isStandalone: true,
+		selector: "Item, [Item]",
+		inputs: {
+			variant: {
+				classPropertyName: "variant",
+				publicName: "variant",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			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()",
+			"attr.data-variant": "variant()",
+			"attr.data-interactive": "interactive ? \"true\" : null"
+		} },
+		hostDirectives: [{
+			directive: i1.ComponentScaleDirective,
+			inputs: [
+				"radius",
+				"radius",
+				"density",
+				"density"
+			]
+		}],
+		ngImport: i0,
+		template: `<ng-content />`,
+		isInline: true
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ItemComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "Item, [Item]",
+			hostDirectives: [{
+				directive: ComponentScaleDirective,
+				inputs: ["radius", "density"]
+			}],
+			host: {
+				"[class]": "classes()",
+				"[attr.data-size]": "size()",
+				"[attr.data-variant]": "variant()",
+				"[attr.data-interactive]": "interactive ? \"true\" : null"
+			},
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: {
+		variant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "variant",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		class: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "class",
+				required: false
+			}]
+		}]
+	}
+});
+var ItemGroupComponent = class ItemGroupComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	classes = computed(() => cn("flex w-full flex-col gap-3", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemGroupComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemGroupComponent,
+		isStandalone: true,
+		selector: "ItemGroup",
+		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.2.0",
+	ngImport: i0,
+	type: ItemGroupComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemGroup",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemSeparatorComponent = class ItemSeparatorComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	classes = computed(() => cn("block h-px w-full bg-border", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemSeparatorComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemSeparatorComponent,
+		isStandalone: true,
+		selector: "ItemSeparator",
+		inputs: { class: {
+			classPropertyName: "class",
+			publicName: "class",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		host: {
+			attributes: { "role": "separator" },
+			properties: { "class": "classes()" }
+		},
+		ngImport: i0,
+		template: "",
+		isInline: true
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ItemSeparatorComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemSeparator",
+			host: {
+				"[class]": "classes()",
+				role: "separator"
+			},
+			template: ""
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemHeaderComponent = class ItemHeaderComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	classes = computed(() => cn("basis-full overflow-hidden rounded-lg", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemHeaderComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemHeaderComponent,
+		isStandalone: true,
+		selector: "ItemHeader",
+		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.2.0",
+	ngImport: i0,
+	type: ItemHeaderComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemHeader",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemMediaComponent = class ItemMediaComponent {
+	variant = input("default", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	item = inject(ItemComponent, { optional: true });
+	classes = computed(() => cn(itemMediaVariants({
+		variant: this.variant(),
+		size: this.item?.size() ?? "default"
+	}), this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemMediaComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemMediaComponent,
+		isStandalone: true,
+		selector: "ItemMedia",
+		inputs: {
+			variant: {
+				classPropertyName: "variant",
+				publicName: "variant",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			class: {
+				classPropertyName: "class",
+				publicName: "class",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: {
+			"class": "classes()",
+			"attr.data-variant": "variant()"
+		} },
+		ngImport: i0,
+		template: `<ng-content />`,
+		isInline: true
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ItemMediaComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemMedia",
+			host: {
+				"[class]": "classes()",
+				"[attr.data-variant]": "variant()"
+			},
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: {
+		variant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "variant",
+				required: false
+			}]
+		}],
+		class: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "class",
+				required: false
+			}]
+		}]
+	}
+});
+var ItemContentComponent = class ItemContentComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	classes = computed(() => cn("flex min-w-0 flex-1 basis-0 flex-col justify-center gap-0.5", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemContentComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemContentComponent,
+		isStandalone: true,
+		selector: "ItemContent",
+		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.2.0",
+	ngImport: i0,
+	type: ItemContentComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemContent",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemTitleComponent = class ItemTitleComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	item = inject(ItemComponent, { optional: true });
+	classes = computed(() => cn("block min-w-0 truncate font-medium text-foreground", ITEM_TITLE_CLASSES[this.item?.size() ?? "default"], this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemTitleComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemTitleComponent,
+		isStandalone: true,
+		selector: "ItemTitle",
+		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.2.0",
+	ngImport: i0,
+	type: ItemTitleComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemTitle",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemDescriptionComponent = class ItemDescriptionComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	item = inject(ItemComponent, { optional: true });
+	classes = computed(() => cn("block min-w-0 text-muted-foreground", ITEM_DESCRIPTION_CLASSES[this.item?.size() ?? "default"], this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemDescriptionComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemDescriptionComponent,
+		isStandalone: true,
+		selector: "ItemDescription",
+		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.2.0",
+	ngImport: i0,
+	type: ItemDescriptionComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemDescription",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemActionsComponent = class ItemActionsComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	classes = computed(() => cn("ms-auto flex shrink-0 items-center gap-2", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemActionsComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemActionsComponent,
+		isStandalone: true,
+		selector: "ItemActions",
+		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.2.0",
+	ngImport: i0,
+	type: ItemActionsComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemActions",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+var ItemFooterComponent = class ItemFooterComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	classes = computed(() => cn("basis-full text-sm text-muted-foreground", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ItemFooterComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ItemFooterComponent,
+		isStandalone: true,
+		selector: "ItemFooter",
+		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.2.0",
+	ngImport: i0,
+	type: ItemFooterComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ItemFooter",
+			host: { "[class]": "classes()" },
+			template: `<ng-content />`
+		}]
+	}],
+	propDecorators: { class: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "class",
+			required: false
+		}]
+	}] }
+});
+export { ItemActionsComponent, ItemComponent, ItemContentComponent, ItemDescriptionComponent, ItemFooterComponent, ItemGroupComponent, ItemHeaderComponent, ItemMediaComponent, ItemSeparatorComponent, ItemTitleComponent, itemMediaVariants, itemVariants };