ngx-com 0.0.3 → 0.0.5

package/fesm2022/ngx-com-components-item.mjs

@@ -0,0 +1,578 @@
+import * as i0 from '@angular/core';
+import { inject, TemplateRef, Directive, input, booleanAttribute, contentChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { NgTemplateOutlet } from '@angular/common';
+import { ComAvatar, ComAvatarCustom } from 'ngx-com/components/avatar';
+import { ComIcon } from 'ngx-com/components/icon';
+import { cva } from 'class-variance-authority';
+
+/**
+ * Marker directive for projecting custom leading content into a com-item.
+ *
+ * When this directive is present, it completely replaces the default
+ * leading visual (which would otherwise be a com-avatar with an icon).
+ * Use this for custom avatars (with images or initials), bare icons,
+ * custom images, or any other leading visual.
+ *
+ * @example Custom avatar with image
+ * ```html
+ * <com-item title="Jane Doe" description="jane@example.com">
+ *   <ng-template comItemLeading>
+ *     <com-avatar src="/photos/jane.jpg" name="Jane Doe" size="sm" />
+ *   </ng-template>
+ * </com-item>
+ * ```
+ *
+ * @example Avatar stack
+ * ```html
+ * <com-item title="3 collaborators">
+ *   <ng-template comItemLeading>
+ *     <div class="flex -space-x-2">
+ *       <com-avatar name="A" size="xs" variant="outline" />
+ *       <com-avatar name="B" size="xs" variant="outline" />
+ *     </div>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ */
+class ComItemLeading {
+    templateRef = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemLeading, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: ComItemLeading, isStandalone: true, selector: "ng-template[comItemLeading]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemLeading, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[comItemLeading]',
+                }]
+        }] });
+/**
+ * Marker directive for projecting custom title content into a com-item.
+ *
+ * When this directive is present, it replaces the `title` input with
+ * rich projected content. Use this when the title needs formatting,
+ * links, or other custom markup.
+ *
+ * @example Title with link
+ * ```html
+ * <com-item icon="link">
+ *   <ng-template comItemTitle>
+ *     <a href="/docs/api" class="hover:underline">API Documentation</a>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ */
+class ComItemTitle {
+    templateRef = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: ComItemTitle, isStandalone: true, selector: "ng-template[comItemTitle]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemTitle, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[comItemTitle]',
+                }]
+        }] });
+/**
+ * Marker directive for projecting inline suffix content after the title.
+ *
+ * Content appears on the same line as the title, immediately after it.
+ * Use this for badges, tags, status indicators, or other inline metadata.
+ *
+ * @example Badge suffix
+ * ```html
+ * <com-item title="My BP datasource" description="View and manage configuration">
+ *   <ng-template comItemSuffix>
+ *     <span class="inline-flex items-center gap-1 rounded-pill border border-primary/30 bg-primary-subtle px-2 py-0.5 text-xs font-medium text-primary">
+ *       Bluetooth
+ *     </span>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ */
+class ComItemSuffix {
+    templateRef = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemSuffix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: ComItemSuffix, isStandalone: true, selector: "ng-template[comItemSuffix]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemSuffix, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[comItemSuffix]',
+                }]
+        }] });
+/**
+ * Marker directive for projecting custom description content into a com-item.
+ *
+ * When this directive is present, it replaces the `description` input
+ * with rich projected content. Use this when the description needs
+ * formatting, code snippets, or other custom markup.
+ *
+ * @example Description with code
+ * ```html
+ * <com-item title="API Key" icon="key">
+ *   <ng-template comItemDescription>
+ *     <code class="text-xs font-mono text-muted-foreground">sk-abc...xyz</code>
+ *     <span class="text-xs text-muted-foreground"> · Created 3 days ago</span>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ */
+class ComItemDescription {
+    templateRef = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: ComItemDescription, isStandalone: true, selector: "ng-template[comItemDescription]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemDescription, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[comItemDescription]',
+                }]
+        }] });
+/**
+ * Marker directive for projecting trailing content into a com-item.
+ *
+ * Content appears at the far right edge of the item. Use this for
+ * action buttons, navigation chevrons, toggles, timestamps, or
+ * any other trailing content.
+ *
+ * @example Trailing chevron
+ * ```html
+ * <com-item title="Settings" icon="settings" [interactive]="true">
+ *   <ng-template comItemTrailing>
+ *     <com-icon name="chevron-right" size="sm" color="muted" />
+ *   </ng-template>
+ * </com-item>
+ * ```
+ *
+ * @example Trailing action button
+ * ```html
+ * <com-item title="API Key" icon="key">
+ *   <ng-template comItemTrailing>
+ *     <button class="text-sm text-primary hover:text-primary-hover">Revoke</button>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ */
+class ComItemTrailing {
+    templateRef = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemTrailing, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: ComItemTrailing, isStandalone: true, selector: "ng-template[comItemTrailing]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItemTrailing, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[comItemTrailing]',
+                }]
+        }] });
+
+/**
+ * CVA variants for the item container (host element).
+ *
+ * @tokens `--color-primary-subtle`, `--color-muted`, `--color-ring`
+ */
+const itemVariants = cva(['com-item', 'flex w-full items-center'], {
+    variants: {
+        size: {
+            sm: 'gap-2.5',
+            md: 'gap-3',
+            lg: 'gap-3.5',
+        },
+        density: {
+            compact: 'py-1.5',
+            default: 'py-2.5',
+            comfortable: 'py-4',
+        },
+        interactive: {
+            true: [
+                'cursor-pointer',
+                'rounded-lg',
+                'px-3',
+                'hover:bg-muted/50',
+                'active:bg-muted',
+                'transition-colors duration-150',
+                'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring',
+            ],
+            false: 'cursor-default',
+        },
+        active: {
+            true: 'bg-primary-subtle',
+            false: '',
+        },
+        disabled: {
+            true: 'opacity-60 pointer-events-none',
+            false: '',
+        },
+    },
+    defaultVariants: {
+        size: 'md',
+        density: 'default',
+        interactive: false,
+        active: false,
+        disabled: false,
+    },
+});
+/** Title classes keyed by item size. */
+const ITEM_TITLE_CLASSES = {
+    sm: 'text-sm',
+    md: 'text-sm font-medium',
+    lg: 'text-xl font-semibold tracking-tight',
+};
+/** Description classes keyed by item size. */
+const ITEM_DESCRIPTION_CLASSES = {
+    sm: 'text-xs',
+    md: 'text-sm',
+    lg: 'text-sm',
+};
+/** Avatar size mapping keyed by item size. */
+const ITEM_AVATAR_SIZES = {
+    sm: 'sm',
+    md: 'md',
+    lg: 'lg',
+};
+/** Icon size mapping keyed by item size (for icon inside avatar). */
+const ITEM_ICON_SIZES = {
+    sm: 'sm',
+    md: 'md',
+    lg: 'lg',
+};
+
+/**
+ * Item component — a universal compound display element that shows a leading
+ * visual alongside a title, an optional description, and optional trailing content.
+ *
+ * Works in all these contexts:
+ * - List rows (device lists, settings menus, search results)
+ * - Page/section headers
+ * - Dropdown menu items
+ * - Table cells
+ * - Card headers
+ * - Nav items
+ *
+ * **Anatomy:**
+ * ```
+ * ┌─────────────────────────────────────────────────────────┐
+ * │  ┌───────┐                                              │
+ * │  │com-   │  Title text  ·  [inline suffix]   [TRAILING] │
+ * │  │avatar │  Description text (secondary)                │
+ * │  └───────┘                                              │
+ * └─────────────────────────────────────────────────────────┘
+ * ```
+ *
+ * Five content zones:
+ * 1. **Leading visual** — optional. Default: `com-avatar` with `shape="rounded"` + `variant="soft"`.
+ *    Override via `comItemLeading` directive.
+ * 2. **Title** — primary text. Required (via input or projection).
+ * 3. **Inline suffix** — same line as title, after it. For badges, tags, status dots.
+ * 4. **Description** — secondary text below title. Optional.
+ * 5. **Trailing** — far-right aligned. Actions, chevrons, timestamps.
+ *
+ * @tokens `--color-primary-subtle`, `--color-muted`, `--color-muted-foreground`,
+ *         `--color-foreground`, `--color-ring`
+ *
+ * @example Simplest — text only, no icon
+ * ```html
+ * <com-item title="Select all" />
+ * ```
+ *
+ * @example Icon + title + description (most common)
+ * ```html
+ * <com-item
+ *   title="Dexcom G7"
+ *   description="109123c2d2194bffe519b03ceb51730d5064f9de46c54c4e..."
+ *   icon="smartphone"
+ * />
+ * ```
+ *
+ * @example Icon with different color
+ * ```html
+ * <com-item title="Warning detected" icon="alert-triangle" iconColor="warn" />
+ * <com-item title="Active" icon="check-circle" iconColor="accent" />
+ * ```
+ *
+ * @example Page header with badge suffix (size lg)
+ * ```html
+ * <com-item
+ *   title="My BP datasource"
+ *   description="View and manage datasource configuration"
+ *   size="lg"
+ * >
+ *   <ng-template comItemSuffix>
+ *     <span class="inline-flex items-center gap-1 rounded-pill border border-primary/30 bg-primary-subtle px-2 py-0.5 text-xs font-medium text-primary">
+ *       <com-icon name="bluetooth" size="xs" /> Bluetooth
+ *     </span>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ *
+ * @example Custom leading — user avatar with image
+ * ```html
+ * <com-item title="Jane Doe" description="jane@example.com">
+ *   <ng-template comItemLeading>
+ *     <com-avatar src="/photos/jane.jpg" name="Jane Doe" size="sm" />
+ *   </ng-template>
+ * </com-item>
+ * ```
+ *
+ * @example Interactive list item with trailing chevron
+ * ```html
+ * <com-item
+ *   title="Bluetooth Settings"
+ *   description="Manage paired devices"
+ *   icon="bluetooth"
+ *   [interactive]="true"
+ *   (click)="openSettings()"
+ * >
+ *   <ng-template comItemTrailing>
+ *     <com-icon name="chevron-right" size="sm" color="muted" />
+ *   </ng-template>
+ * </com-item>
+ * ```
+ *
+ * @example Compact density — dropdown menu
+ * ```html
+ * @for (option of options; track option.value) {
+ *   <com-item
+ *     [title]="option.label"
+ *     [icon]="option.icon"
+ *     density="compact"
+ *     [interactive]="true"
+ *     [active]="option.value === selected()"
+ *     (click)="select(option)"
+ *   />
+ * }
+ * ```
+ *
+ * @example Rich description via projection
+ * ```html
+ * <com-item title="API Key" icon="key">
+ *   <ng-template comItemDescription>
+ *     <code class="text-xs font-mono text-muted-foreground">sk-abc...xyz</code>
+ *     <span class="text-xs text-muted-foreground"> · Created 3 days ago</span>
+ *   </ng-template>
+ *   <ng-template comItemTrailing>
+ *     <button class="text-sm text-primary hover:text-primary-hover">Revoke</button>
+ *   </ng-template>
+ * </com-item>
+ * ```
+ *
+ * @example Disabled
+ * ```html
+ * <com-item
+ *   title="Enterprise Features"
+ *   description="Available on Enterprise plan"
+ *   icon="crown"
+ *   [disabled]="true"
+ * />
+ * ```
+ */
+class ComItem {
+    // ─── Content Inputs ───
+    /** Primary text. Required unless using comItemTitle directive. */
+    title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
+    /** Secondary text below the title. */
+    description = input(...(ngDevMode ? [undefined, { debugName: "description" }] : []));
+    /** Lucide icon name — renders inside a com-avatar container. */
+    icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
+    /** Color variant passed to the leading com-avatar. */
+    iconColor = input('primary', ...(ngDevMode ? [{ debugName: "iconColor" }] : []));
+    // ─── CVA Variant Inputs ───
+    /** Size variant affecting typography and spacing. */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** Density variant affecting vertical padding. */
+    density = input('default', ...(ngDevMode ? [{ debugName: "density" }] : []));
+    /** Enables hover/active/focus states. */
+    interactive = input(false, { ...(ngDevMode ? { debugName: "interactive" } : {}), transform: booleanAttribute });
+    /** Shows selected/active highlight. */
+    active = input(false, { ...(ngDevMode ? { debugName: "active" } : {}), transform: booleanAttribute });
+    /** Dims and disables pointer events. */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+    /** Truncates title and description text. */
+    truncate = input(true, { ...(ngDevMode ? { debugName: "truncate" } : {}), transform: booleanAttribute });
+    // ─── Content Projection Queries ───
+    leadingDirective = contentChild(ComItemLeading, ...(ngDevMode ? [{ debugName: "leadingDirective" }] : []));
+    titleDirective = contentChild(ComItemTitle, ...(ngDevMode ? [{ debugName: "titleDirective" }] : []));
+    suffixDirective = contentChild(ComItemSuffix, ...(ngDevMode ? [{ debugName: "suffixDirective" }] : []));
+    descriptionDirective = contentChild(ComItemDescription, ...(ngDevMode ? [{ debugName: "descriptionDirective" }] : []));
+    trailingDirective = contentChild(ComItemTrailing, ...(ngDevMode ? [{ debugName: "trailingDirective" }] : []));
+    // ─── Computed Values ───
+    /** Resolved icon color (handles 'auto' → 'primary' for items since there's no name). */
+    resolvedIconColor = computed(() => {
+        const color = this.iconColor();
+        // For items, 'auto' should default to 'primary' since there's no name to hash
+        return color === 'auto' ? 'primary' : color;
+    }, ...(ngDevMode ? [{ debugName: "resolvedIconColor" }] : []));
+    /** Avatar size mapped from item size. */
+    avatarSize = computed(() => ITEM_AVATAR_SIZES[this.size()], ...(ngDevMode ? [{ debugName: "avatarSize" }] : []));
+    /** Icon size mapped from item size. */
+    iconSize = computed(() => ITEM_ICON_SIZES[this.size()], ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
+    /** Title typography classes based on size. */
+    titleClasses = computed(() => ITEM_TITLE_CLASSES[this.size()], ...(ngDevMode ? [{ debugName: "titleClasses" }] : []));
+    /** Description typography classes based on size. */
+    descriptionClasses = computed(() => ITEM_DESCRIPTION_CLASSES[this.size()], ...(ngDevMode ? [{ debugName: "descriptionClasses" }] : []));
+    /** Host element classes from CVA. */
+    hostClasses = computed(() => itemVariants({
+        size: this.size(),
+        density: this.density(),
+        interactive: this.interactive(),
+        active: this.active(),
+        disabled: this.disabled(),
+    }), ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
+    // ─── Keyboard Accessibility ───
+    onKeyboardActivate(event) {
+        if (this.interactive() && !this.disabled()) {
+            event.preventDefault();
+            event.target.click();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComItem, isStandalone: true, selector: "com-item", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, truncate: { classPropertyName: "truncate", publicName: "truncate", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown.enter": "onKeyboardActivate($event)", "keydown.space": "onKeyboardActivate($event)" }, properties: { "class": "hostClasses()", "attr.role": "interactive() ? \"button\" : null", "attr.tabindex": "interactive() && !disabled() ? 0 : null", "attr.aria-disabled": "disabled() || null", "attr.aria-label": "title() || null" } }, queries: [{ propertyName: "leadingDirective", first: true, predicate: ComItemLeading, descendants: true, isSignal: true }, { propertyName: "titleDirective", first: true, predicate: ComItemTitle, descendants: true, isSignal: true }, { propertyName: "suffixDirective", first: true, predicate: ComItemSuffix, descendants: true, isSignal: true }, { propertyName: "descriptionDirective", first: true, predicate: ComItemDescription, descendants: true, isSignal: true }, { propertyName: "trailingDirective", first: true, predicate: ComItemTrailing, descendants: true, isSignal: true }], exportAs: ["comItem"], ngImport: i0, template: `
+    <!-- Leading visual zone -->
+    @if (leadingDirective(); as leading) {
+      <ng-container [ngTemplateOutlet]="leading.templateRef" />
+    } @else if (icon()) {
+      <com-avatar
+        [size]="avatarSize()"
+        shape="rounded"
+        variant="soft"
+        [color]="resolvedIconColor()"
+      >
+        <ng-template comAvatarCustom>
+          <com-icon [name]="icon()" [size]="iconSize()" />
+        </ng-template>
+      </com-avatar>
+    }
+
+    <!-- Text zone -->
+    <div class="flex min-w-0 flex-1 flex-col justify-center">
+      <!-- Title row -->
+      <div class="flex items-center gap-1.5">
+        @if (titleDirective(); as titleTpl) {
+          <ng-container [ngTemplateOutlet]="titleTpl.templateRef" />
+        } @else if (title()) {
+          <span
+            class="text-foreground"
+            [class]="titleClasses()"
+            [class.truncate]="truncate()"
+          >
+            {{ title() }}
+          </span>
+        }
+        @if (suffixDirective(); as suffix) {
+          <ng-container [ngTemplateOutlet]="suffix.templateRef" />
+        }
+      </div>
+
+      <!-- Description row -->
+      @if (descriptionDirective(); as descTpl) {
+        <ng-container [ngTemplateOutlet]="descTpl.templateRef" />
+      } @else if (description()) {
+        <span
+          class="text-muted-foreground"
+          [class]="descriptionClasses()"
+          [class.truncate]="truncate()"
+        >
+          {{ description() }}
+        </span>
+      }
+    </div>
+
+    <!-- Trailing zone -->
+    @if (trailingDirective(); as trailing) {
+      <div class="flex shrink-0 items-center">
+        <ng-container [ngTemplateOutlet]="trailing.templateRef" />
+      </div>
+    }
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ComAvatar, selector: "com-avatar", inputs: ["src", "alt", "name", "size", "color", "shape", "variant", "interactive"], outputs: ["imageError", "imageLoaded"], exportAs: ["comAvatar"] }, { kind: "directive", type: ComAvatarCustom, selector: "ng-template[comAvatarCustom]" }, { kind: "component", type: ComIcon, selector: "com-icon", inputs: ["name", "img", "color", "size", "strokeWidth", "absoluteStrokeWidth", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'com-item',
+                    exportAs: 'comItem',
+                    template: `
+    <!-- Leading visual zone -->
+    @if (leadingDirective(); as leading) {
+      <ng-container [ngTemplateOutlet]="leading.templateRef" />
+    } @else if (icon()) {
+      <com-avatar
+        [size]="avatarSize()"
+        shape="rounded"
+        variant="soft"
+        [color]="resolvedIconColor()"
+      >
+        <ng-template comAvatarCustom>
+          <com-icon [name]="icon()" [size]="iconSize()" />
+        </ng-template>
+      </com-avatar>
+    }
+
+    <!-- Text zone -->
+    <div class="flex min-w-0 flex-1 flex-col justify-center">
+      <!-- Title row -->
+      <div class="flex items-center gap-1.5">
+        @if (titleDirective(); as titleTpl) {
+          <ng-container [ngTemplateOutlet]="titleTpl.templateRef" />
+        } @else if (title()) {
+          <span
+            class="text-foreground"
+            [class]="titleClasses()"
+            [class.truncate]="truncate()"
+          >
+            {{ title() }}
+          </span>
+        }
+        @if (suffixDirective(); as suffix) {
+          <ng-container [ngTemplateOutlet]="suffix.templateRef" />
+        }
+      </div>
+
+      <!-- Description row -->
+      @if (descriptionDirective(); as descTpl) {
+        <ng-container [ngTemplateOutlet]="descTpl.templateRef" />
+      } @else if (description()) {
+        <span
+          class="text-muted-foreground"
+          [class]="descriptionClasses()"
+          [class.truncate]="truncate()"
+        >
+          {{ description() }}
+        </span>
+      }
+    </div>
+
+    <!-- Trailing zone -->
+    @if (trailingDirective(); as trailing) {
+      <div class="flex shrink-0 items-center">
+        <ng-container [ngTemplateOutlet]="trailing.templateRef" />
+      </div>
+    }
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [
+                        NgTemplateOutlet,
+                        ComAvatar,
+                        ComAvatarCustom,
+                        ComIcon,
+                    ],
+                    host: {
+                        '[class]': 'hostClasses()',
+                        '[attr.role]': 'interactive() ? "button" : null',
+                        '[attr.tabindex]': 'interactive() && !disabled() ? 0 : null',
+                        '[attr.aria-disabled]': 'disabled() || null',
+                        '[attr.aria-label]': 'title() || null',
+                        '(keydown.enter)': 'onKeyboardActivate($event)',
+                        '(keydown.space)': 'onKeyboardActivate($event)',
+                    },
+                }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconColor", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], truncate: [{ type: i0.Input, args: [{ isSignal: true, alias: "truncate", required: false }] }], leadingDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComItemLeading), { isSignal: true }] }], titleDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComItemTitle), { isSignal: true }] }], suffixDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComItemSuffix), { isSignal: true }] }], descriptionDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComItemDescription), { isSignal: true }] }], trailingDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComItemTrailing), { isSignal: true }] }] } });
+
+// Public API for the item component
+// Main component
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ComItem, ComItemDescription, ComItemLeading, ComItemSuffix, ComItemTitle, ComItemTrailing, ITEM_AVATAR_SIZES, ITEM_DESCRIPTION_CLASSES, ITEM_ICON_SIZES, ITEM_TITLE_CLASSES, itemVariants };
+//# sourceMappingURL=ngx-com-components-item.mjs.map

package/fesm2022/ngx-com-components-item.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngx-com-components-item.mjs","sources":["../../../projects/com/components/item/item.directives.ts","../../../projects/com/components/item/item.variants.ts","../../../projects/com/components/item/item.component.ts","../../../projects/com/components/item/index.ts","../../../projects/com/components/item/ngx-com-components-item.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n/**\n * Marker directive for projecting custom leading content into a com-item.\n *\n * When this directive is present, it completely replaces the default\n * leading visual (which would otherwise be a com-avatar with an icon).\n * Use this for custom avatars (with images or initials), bare icons,\n * custom images, or any other leading visual.\n *\n * @example Custom avatar with image\n * ```html\n * <com-item title=\"Jane Doe\" description=\"jane@example.com\">\n *   <ng-template comItemLeading>\n *     <com-avatar src=\"/photos/jane.jpg\" name=\"Jane Doe\" size=\"sm\" />\n *   </ng-template>\n * </com-item>\n * ```\n *\n * @example Avatar stack\n * ```html\n * <com-item title=\"3 collaborators\">\n *   <ng-template comItemLeading>\n *     <div class=\"flex -space-x-2\">\n *       <com-avatar name=\"A\" size=\"xs\" variant=\"outline\" />\n *       <com-avatar name=\"B\" size=\"xs\" variant=\"outline\" />\n *     </div>\n *   </ng-template>\n * </com-item>\n * ```\n */\n@Directive({\n  selector: 'ng-template[comItemLeading]',\n})\nexport class ComItemLeading {\n  readonly templateRef: TemplateRef<void> = inject(TemplateRef);\n}\n\n/**\n * Marker directive for projecting custom title content into a com-item.\n *\n * When this directive is present, it replaces the `title` input with\n * rich projected content. Use this when the title needs formatting,\n * links, or other custom markup.\n *\n * @example Title with link\n * ```html\n * <com-item icon=\"link\">\n *   <ng-template comItemTitle>\n *     <a href=\"/docs/api\" class=\"hover:underline\">API Documentation</a>\n *   </ng-template>\n * </com-item>\n * ```\n */\n@Directive({\n  selector: 'ng-template[comItemTitle]',\n})\nexport class ComItemTitle {\n  readonly templateRef: TemplateRef<void> = inject(TemplateRef);\n}\n\n/**\n * Marker directive for projecting inline suffix content after the title.\n *\n * Content appears on the same line as the title, immediately after it.\n * Use this for badges, tags, status indicators, or other inline metadata.\n *\n * @example Badge suffix\n * ```html\n * <com-item title=\"My BP datasource\" description=\"View and manage configuration\">\n *   <ng-template comItemSuffix>\n *     <span class=\"inline-flex items-center gap-1 rounded-pill border border-primary/30 bg-primary-subtle px-2 py-0.5 text-xs font-medium text-primary\">\n *       Bluetooth\n *     </span>\n *   </ng-template>\n * </com-item>\n * ```\n */\n@Directive({\n  selector: 'ng-template[comItemSuffix]',\n})\nexport class ComItemSuffix {\n  readonly templateRef: TemplateRef<void> = inject(TemplateRef);\n}\n\n/**\n * Marker directive for projecting custom description content into a com-item.\n *\n * When this directive is present, it replaces the `description` input\n * with rich projected content. Use this when the description needs\n * formatting, code snippets, or other custom markup.\n *\n * @example Description with code\n * ```html\n * <com-item title=\"API Key\" icon=\"key\">\n *   <ng-template comItemDescription>\n *     <code class=\"text-xs font-mono text-muted-foreground\">sk-abc...xyz</code>\n *     <span class=\"text-xs text-muted-foreground\"> · Created 3 days ago</span>\n *   </ng-template>\n * </com-item>\n * ```\n */\n@Directive({\n  selector: 'ng-template[comItemDescription]',\n})\nexport class ComItemDescription {\n  readonly templateRef: TemplateRef<void> = inject(TemplateRef);\n}\n\n/**\n * Marker directive for projecting trailing content into a com-item.\n *\n * Content appears at the far right edge of the item. Use this for\n * action buttons, navigation chevrons, toggles, timestamps, or\n * any other trailing content.\n *\n * @example Trailing chevron\n * ```html\n * <com-item title=\"Settings\" icon=\"settings\" [interactive]=\"true\">\n *   <ng-template comItemTrailing>\n *     <com-icon name=\"chevron-right\" size=\"sm\" color=\"muted\" />\n *   </ng-template>\n * </com-item>\n * ```\n *\n * @example Trailing action button\n * ```html\n * <com-item title=\"API Key\" icon=\"key\">\n *   <ng-template comItemTrailing>\n *     <button class=\"text-sm text-primary hover:text-primary-hover\">Revoke</button>\n *   </ng-template>\n * </com-item>\n * ```\n */\n@Directive({\n  selector: 'ng-template[comItemTrailing]',\n})\nexport class ComItemTrailing {\n  readonly templateRef: TemplateRef<void> = inject(TemplateRef);\n}\n","import { cva, type VariantProps } from 'class-variance-authority';\nimport type { AvatarSize } from 'ngx-com/components/avatar';\nimport type { IconSize } from 'ngx-com/components/icon';\n\n/** Item size variants. */\nexport type ItemSize = 'sm' | 'md' | 'lg';\n\n/** Item density variants. */\nexport type ItemDensity = 'compact' | 'default' | 'comfortable';\n\n/**\n * CVA variants for the item container (host element).\n *\n * @tokens `--color-primary-subtle`, `--color-muted`, `--color-ring`\n */\nexport const itemVariants: (props?: {\n  size?: ItemSize;\n  density?: ItemDensity;\n  interactive?: boolean;\n  active?: boolean;\n  disabled?: boolean;\n}) => string = cva(['com-item', 'flex w-full items-center'], {\n  variants: {\n    size: {\n      sm: 'gap-2.5',\n      md: 'gap-3',\n      lg: 'gap-3.5',\n    },\n    density: {\n      compact: 'py-1.5',\n      default: 'py-2.5',\n      comfortable: 'py-4',\n    },\n    interactive: {\n      true: [\n        'cursor-pointer',\n        'rounded-lg',\n        'px-3',\n        'hover:bg-muted/50',\n        'active:bg-muted',\n        'transition-colors duration-150',\n        'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring',\n      ],\n      false: 'cursor-default',\n    },\n    active: {\n      true: 'bg-primary-subtle',\n      false: '',\n    },\n    disabled: {\n      true: 'opacity-60 pointer-events-none',\n      false: '',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    density: 'default',\n    interactive: false,\n    active: false,\n    disabled: false,\n  },\n});\n\n/** Title classes keyed by item size. */\nexport const ITEM_TITLE_CLASSES: Record<ItemSize, string> = {\n  sm: 'text-sm',\n  md: 'text-sm font-medium',\n  lg: 'text-xl font-semibold tracking-tight',\n};\n\n/** Description classes keyed by item size. */\nexport const ITEM_DESCRIPTION_CLASSES: Record<ItemSize, string> = {\n  sm: 'text-xs',\n  md: 'text-sm',\n  lg: 'text-sm',\n};\n\n/** Avatar size mapping keyed by item size. */\nexport const ITEM_AVATAR_SIZES: Record<ItemSize, AvatarSize> = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n};\n\n/** Icon size mapping keyed by item size (for icon inside avatar). */\nexport const ITEM_ICON_SIZES: Record<ItemSize, IconSize> = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n};\n\nexport type ItemVariants = VariantProps<typeof itemVariants>;\n","import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChild,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { InputSignal, InputSignalWithTransform, Signal } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ComAvatar, ComAvatarCustom } from 'ngx-com/components/avatar';\nimport type { AvatarColor, AvatarSize } from 'ngx-com/components/avatar';\nimport { ComIcon } from 'ngx-com/components/icon';\nimport type { IconSize } from 'ngx-com/components/icon';\nimport {\n  ComItemLeading,\n  ComItemTitle,\n  ComItemSuffix,\n  ComItemDescription,\n  ComItemTrailing,\n} from './item.directives';\nimport {\n  itemVariants,\n  ITEM_TITLE_CLASSES,\n  ITEM_DESCRIPTION_CLASSES,\n  ITEM_AVATAR_SIZES,\n  ITEM_ICON_SIZES,\n} from './item.variants';\nimport type { ItemSize, ItemDensity } from './item.variants';\n\n/**\n * Item component — a universal compound display element that shows a leading\n * visual alongside a title, an optional description, and optional trailing content.\n *\n * Works in all these contexts:\n * - List rows (device lists, settings menus, search results)\n * - Page/section headers\n * - Dropdown menu items\n * - Table cells\n * - Card headers\n * - Nav items\n *\n * **Anatomy:**\n * ```\n * ┌─────────────────────────────────────────────────────────┐\n * │  ┌───────┐                                              │\n * │  │com-   │  Title text  ·  [inline suffix]   [TRAILING] │\n * │  │avatar │  Description text (secondary)                │\n * │  └───────┘                                              │\n * └─────────────────────────────────────────────────────────┘\n * ```\n *\n * Five content zones:\n * 1. **Leading visual** — optional. Default: `com-avatar` with `shape=\"rounded\"` + `variant=\"soft\"`.\n *    Override via `comItemLeading` directive.\n * 2. **Title** — primary text. Required (via input or projection).\n * 3. **Inline suffix** — same line as title, after it. For badges, tags, status dots.\n * 4. **Description** — secondary text below title. Optional.\n * 5. **Trailing** — far-right aligned. Actions, chevrons, timestamps.\n *\n * @tokens `--color-primary-subtle`, `--color-muted`, `--color-muted-foreground`,\n *         `--color-foreground`, `--color-ring`\n *\n * @example Simplest — text only, no icon\n * ```html\n * <com-item title=\"Select all\" />\n * ```\n *\n * @example Icon + title + description (most common)\n * ```html\n * <com-item\n *   title=\"Dexcom G7\"\n *   description=\"109123c2d2194bffe519b03ceb51730d5064f9de46c54c4e...\"\n *   icon=\"smartphone\"\n * />\n * ```\n *\n * @example Icon with different color\n * ```html\n * <com-item title=\"Warning detected\" icon=\"alert-triangle\" iconColor=\"warn\" />\n * <com-item title=\"Active\" icon=\"check-circle\" iconColor=\"accent\" />\n * ```\n *\n * @example Page header with badge suffix (size lg)\n * ```html\n * <com-item\n *   title=\"My BP datasource\"\n *   description=\"View and manage datasource configuration\"\n *   size=\"lg\"\n * >\n *   <ng-template comItemSuffix>\n *     <span class=\"inline-flex items-center gap-1 rounded-pill border border-primary/30 bg-primary-subtle px-2 py-0.5 text-xs font-medium text-primary\">\n *       <com-icon name=\"bluetooth\" size=\"xs\" /> Bluetooth\n *     </span>\n *   </ng-template>\n * </com-item>\n * ```\n *\n * @example Custom leading — user avatar with image\n * ```html\n * <com-item title=\"Jane Doe\" description=\"jane@example.com\">\n *   <ng-template comItemLeading>\n *     <com-avatar src=\"/photos/jane.jpg\" name=\"Jane Doe\" size=\"sm\" />\n *   </ng-template>\n * </com-item>\n * ```\n *\n * @example Interactive list item with trailing chevron\n * ```html\n * <com-item\n *   title=\"Bluetooth Settings\"\n *   description=\"Manage paired devices\"\n *   icon=\"bluetooth\"\n *   [interactive]=\"true\"\n *   (click)=\"openSettings()\"\n * >\n *   <ng-template comItemTrailing>\n *     <com-icon name=\"chevron-right\" size=\"sm\" color=\"muted\" />\n *   </ng-template>\n * </com-item>\n * ```\n *\n * @example Compact density — dropdown menu\n * ```html\n * @for (option of options; track option.value) {\n *   <com-item\n *     [title]=\"option.label\"\n *     [icon]=\"option.icon\"\n *     density=\"compact\"\n *     [interactive]=\"true\"\n *     [active]=\"option.value === selected()\"\n *     (click)=\"select(option)\"\n *   />\n * }\n * ```\n *\n * @example Rich description via projection\n * ```html\n * <com-item title=\"API Key\" icon=\"key\">\n *   <ng-template comItemDescription>\n *     <code class=\"text-xs font-mono text-muted-foreground\">sk-abc...xyz</code>\n *     <span class=\"text-xs text-muted-foreground\"> · Created 3 days ago</span>\n *   </ng-template>\n *   <ng-template comItemTrailing>\n *     <button class=\"text-sm text-primary hover:text-primary-hover\">Revoke</button>\n *   </ng-template>\n * </com-item>\n * ```\n *\n * @example Disabled\n * ```html\n * <com-item\n *   title=\"Enterprise Features\"\n *   description=\"Available on Enterprise plan\"\n *   icon=\"crown\"\n *   [disabled]=\"true\"\n * />\n * ```\n */\n@Component({\n  selector: 'com-item',\n  exportAs: 'comItem',\n  template: `\n    <!-- Leading visual zone -->\n    @if (leadingDirective(); as leading) {\n      <ng-container [ngTemplateOutlet]=\"leading.templateRef\" />\n    } @else if (icon()) {\n      <com-avatar\n        [size]=\"avatarSize()\"\n        shape=\"rounded\"\n        variant=\"soft\"\n        [color]=\"resolvedIconColor()\"\n      >\n        <ng-template comAvatarCustom>\n          <com-icon [name]=\"icon()\" [size]=\"iconSize()\" />\n        </ng-template>\n      </com-avatar>\n    }\n\n    <!-- Text zone -->\n    <div class=\"flex min-w-0 flex-1 flex-col justify-center\">\n      <!-- Title row -->\n      <div class=\"flex items-center gap-1.5\">\n        @if (titleDirective(); as titleTpl) {\n          <ng-container [ngTemplateOutlet]=\"titleTpl.templateRef\" />\n        } @else if (title()) {\n          <span\n            class=\"text-foreground\"\n            [class]=\"titleClasses()\"\n            [class.truncate]=\"truncate()\"\n          >\n            {{ title() }}\n          </span>\n        }\n        @if (suffixDirective(); as suffix) {\n          <ng-container [ngTemplateOutlet]=\"suffix.templateRef\" />\n        }\n      </div>\n\n      <!-- Description row -->\n      @if (descriptionDirective(); as descTpl) {\n        <ng-container [ngTemplateOutlet]=\"descTpl.templateRef\" />\n      } @else if (description()) {\n        <span\n          class=\"text-muted-foreground\"\n          [class]=\"descriptionClasses()\"\n          [class.truncate]=\"truncate()\"\n        >\n          {{ description() }}\n        </span>\n      }\n    </div>\n\n    <!-- Trailing zone -->\n    @if (trailingDirective(); as trailing) {\n      <div class=\"flex shrink-0 items-center\">\n        <ng-container [ngTemplateOutlet]=\"trailing.templateRef\" />\n      </div>\n    }\n  `,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  imports: [\n    NgTemplateOutlet,\n    ComAvatar,\n    ComAvatarCustom,\n    ComIcon,\n  ],\n  host: {\n    '[class]': 'hostClasses()',\n    '[attr.role]': 'interactive() ? \"button\" : null',\n    '[attr.tabindex]': 'interactive() && !disabled() ? 0 : null',\n    '[attr.aria-disabled]': 'disabled() || null',\n    '[attr.aria-label]': 'title() || null',\n    '(keydown.enter)': 'onKeyboardActivate($event)',\n    '(keydown.space)': 'onKeyboardActivate($event)',\n  },\n})\nexport class ComItem {\n  // ─── Content Inputs ───\n\n  /** Primary text. Required unless using comItemTitle directive. */\n  readonly title: InputSignal<string | undefined> = input<string>();\n\n  /** Secondary text below the title. */\n  readonly description: InputSignal<string | undefined> = input<string>();\n\n  /** Lucide icon name — renders inside a com-avatar container. */\n  readonly icon: InputSignal<string | undefined> = input<string>();\n\n  /** Color variant passed to the leading com-avatar. */\n  readonly iconColor: InputSignal<AvatarColor> = input<AvatarColor>('primary');\n\n  // ─── CVA Variant Inputs ───\n\n  /** Size variant affecting typography and spacing. */\n  readonly size: InputSignal<ItemSize> = input<ItemSize>('md');\n\n  /** Density variant affecting vertical padding. */\n  readonly density: InputSignal<ItemDensity> = input<ItemDensity>('default');\n\n  /** Enables hover/active/focus states. */\n  readonly interactive: InputSignalWithTransform<boolean, unknown> = input(false, {\n    transform: booleanAttribute,\n  });\n\n  /** Shows selected/active highlight. */\n  readonly active: InputSignalWithTransform<boolean, unknown> = input(false, {\n    transform: booleanAttribute,\n  });\n\n  /** Dims and disables pointer events. */\n  readonly disabled: InputSignalWithTransform<boolean, unknown> = input(false, {\n    transform: booleanAttribute,\n  });\n\n  /** Truncates title and description text. */\n  readonly truncate: InputSignalWithTransform<boolean, unknown> = input(true, {\n    transform: booleanAttribute,\n  });\n\n  // ─── Content Projection Queries ───\n\n  protected readonly leadingDirective: Signal<ComItemLeading | undefined> =\n    contentChild(ComItemLeading);\n\n  protected readonly titleDirective: Signal<ComItemTitle | undefined> =\n    contentChild(ComItemTitle);\n\n  protected readonly suffixDirective: Signal<ComItemSuffix | undefined> =\n    contentChild(ComItemSuffix);\n\n  protected readonly descriptionDirective: Signal<ComItemDescription | undefined> =\n    contentChild(ComItemDescription);\n\n  protected readonly trailingDirective: Signal<ComItemTrailing | undefined> =\n    contentChild(ComItemTrailing);\n\n  // ─── Computed Values ───\n\n  /** Resolved icon color (handles 'auto' → 'primary' for items since there's no name). */\n  protected readonly resolvedIconColor: Signal<AvatarColor> = computed(() => {\n    const color = this.iconColor();\n    // For items, 'auto' should default to 'primary' since there's no name to hash\n    return color === 'auto' ? 'primary' : color;\n  });\n\n  /** Avatar size mapped from item size. */\n  protected readonly avatarSize: Signal<AvatarSize> = computed(\n    () => ITEM_AVATAR_SIZES[this.size()]\n  );\n\n  /** Icon size mapped from item size. */\n  protected readonly iconSize: Signal<IconSize> = computed(\n    () => ITEM_ICON_SIZES[this.size()]\n  );\n\n  /** Title typography classes based on size. */\n  protected readonly titleClasses: Signal<string> = computed(\n    () => ITEM_TITLE_CLASSES[this.size()]\n  );\n\n  /** Description typography classes based on size. */\n  protected readonly descriptionClasses: Signal<string> = computed(\n    () => ITEM_DESCRIPTION_CLASSES[this.size()]\n  );\n\n  /** Host element classes from CVA. */\n  protected readonly hostClasses: Signal<string> = computed(() =>\n    itemVariants({\n      size: this.size(),\n      density: this.density(),\n      interactive: this.interactive(),\n      active: this.active(),\n      disabled: this.disabled(),\n    })\n  );\n\n  // ─── Keyboard Accessibility ───\n\n  protected onKeyboardActivate(event: Event): void {\n    if (this.interactive() && !this.disabled()) {\n      event.preventDefault();\n      (event.target as HTMLElement).click();\n    }\n  }\n}\n","// Public API for the item component\n\n// Main component\nexport { ComItem } from './item.component';\n\n// Directives\nexport {\n  ComItemLeading,\n  ComItemTitle,\n  ComItemSuffix,\n  ComItemDescription,\n  ComItemTrailing,\n} from './item.directives';\n\n// Variants and utilities\nexport {\n  itemVariants,\n  ITEM_TITLE_CLASSES,\n  ITEM_DESCRIPTION_CLASSES,\n  ITEM_AVATAR_SIZES,\n  ITEM_ICON_SIZES,\n} from './item.variants';\n\nexport type {\n  ItemSize,\n  ItemDensity,\n  ItemVariants,\n} from './item.variants';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}