@spartan-ng/cli 0.0.1-alpha.509 → 0.0.1-alpha.511

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spartan-ng/cli",
-  "version": "0.0.1-alpha.509",
+  "version": "0.0.1-alpha.511",
   "type": "commonjs",
   "dependencies": {
     "@nx/angular": ">=20.0.0",

package/src/generators/ui/libs/ui-autocomplete-helm/files/index.ts.template

@@ -0,0 +1,36 @@
+import { NgModule } from '@angular/core';
+import { HlmAutocomplete } from './lib/hlm-autocomplete';
+import { HlmAutocompleteEmpty } from './lib/hlm-autocomplete-empty';
+import { HlmAutocompleteGroup } from './lib/hlm-autocomplete-group';
+import { HlmAutocompleteItem } from './lib/hlm-autocomplete-item';
+import { HlmAutocompleteList } from './lib/hlm-autocomplete-list';
+import { HlmAutocompleteSearch } from './lib/hlm-autocomplete-search';
+import { HlmAutocompleteSearchInput } from './lib/hlm-autocomplete-search-input';
+import { HlmAutocompleteTrigger } from './lib/hlm-autocomplete-trigger';
+
+export * from './lib/hlm-autocomplete';
+export * from './lib/hlm-autocomplete-empty';
+export * from './lib/hlm-autocomplete-group';
+export * from './lib/hlm-autocomplete-item';
+export * from './lib/hlm-autocomplete-list';
+export * from './lib/hlm-autocomplete-search';
+export * from './lib/hlm-autocomplete-search-input';
+export * from './lib/hlm-autocomplete-trigger';
+export * from './lib/hlm-autocomplete.token';
+
+export const HlmAutocompleteImports = [
+	HlmAutocomplete,
+	HlmAutocompleteEmpty,
+	HlmAutocompleteGroup,
+	HlmAutocompleteItem,
+	HlmAutocompleteList,
+	HlmAutocompleteSearch,
+	HlmAutocompleteSearchInput,
+	HlmAutocompleteTrigger,
+] as const;
+
+@NgModule({
+	imports: [...HlmAutocompleteImports],
+	exports: [...HlmAutocompleteImports],
+})
+export class HlmAutocompleteModule {}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-empty.ts.template

@@ -0,0 +1,14 @@
+import { Directive, computed, input } from '@angular/core';
+import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
+
+@Directive({
+	selector: '[hlmAutocompleteEmpty]',
+	host: {
+		'[class]': '_computedClass()',
+	},
+})
+export class HlmAutocompleteEmpty {
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
+	protected readonly _computedClass = computed(() => hlm('py-6 text-center text-sm', this.userClass()));
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-group.ts.template

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { BrnAutocompleteGroup } from '@spartan-ng/brain/autocomplete';
+import { hlm } from '<%- importAlias %>/utils';
+
+@Component({
+	selector: 'hlm-autocomplete-group',
+	template: '<ng-content />',
+	hostDirectives: [
+		{
+			directive: BrnAutocompleteGroup,
+			inputs: ['id'],
+		},
+	],
+	host: {
+		'[class]': '_computedClass()',
+	},
+	changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HlmAutocompleteGroup {
+	/** The user defined class  */
+	public readonly userClass = input<string>('', { alias: 'class' });
+
+	/** The styles to apply  */
+	protected readonly _computedClass = computed(() =>
+		hlm('text-foreground block overflow-hidden p-1', this.userClass()),
+	);
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-item.ts.template

@@ -0,0 +1,33 @@
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { BrnAutocompleteItem } from '@spartan-ng/brain/autocomplete';
+import { hlm } from '<%- importAlias %>/utils';
+
+@Component({
+	selector: 'button[hlm-autocomplete-item]',
+	template: `
+		<ng-content />
+	`,
+	hostDirectives: [
+		{
+			directive: BrnAutocompleteItem,
+			inputs: ['value', 'disabled', 'id'],
+			outputs: ['selected'],
+		},
+	],
+	host: {
+		'[class]': '_computedClass()',
+	},
+	changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HlmAutocompleteItem {
+	/** The user defined class  */
+	public readonly userClass = input<string>('', { alias: 'class' });
+
+	/** The styles to apply  */
+	protected readonly _computedClass = computed(() =>
+		hlm(
+			'data-[selected]:bg-accent data-[selected=true]:text-accent-foreground [&>ng-icon]:text-muted-foreground outline-hidden relative flex w-full cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled]:pointer-events-none data-[hidden]:hidden data-[disabled]:opacity-50 [&>ng-icon]:pointer-events-none [&>ng-icon]:shrink-0 [&>ng-icon]:text-base',
+			this.userClass(),
+		),
+	);
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-list.ts.template

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { BrnAutocompleteList } from '@spartan-ng/brain/autocomplete';
+import { hlm } from '<%- importAlias %>/utils';
+
+@Component({
+	selector: 'hlm-autocomplete-list',
+	template: '<ng-content />',
+	host: {
+		'[class]': '_computedClass()',
+	},
+	hostDirectives: [
+		{
+			directive: BrnAutocompleteList,
+			inputs: ['id'],
+		},
+	],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HlmAutocompleteList {
+	/** The user defined class  */
+	public readonly userClass = input<string>('', { alias: 'class' });
+
+	/** The styles to apply  */
+	protected readonly _computedClass = computed(() =>
+		hlm('block max-h-60 overflow-y-auto overflow-x-hidden', this.userClass()),
+	);
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-search-input.ts.template

@@ -0,0 +1,26 @@
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { BrnAutocompleteSearchInput } from '@spartan-ng/brain/autocomplete';
+import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
+
+@Component({
+	selector: 'input[hlm-autocomplete-search-input]',
+	template: '',
+	hostDirectives: [{ directive: BrnAutocompleteSearchInput, inputs: ['value'] }],
+	host: {
+		'[class]': '_computedClass()',
+	},
+	changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HlmAutocompleteSearchInput {
+	/** The user defined class  */
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
+
+	/** The styles to apply  */
+	protected readonly _computedClass = computed(() =>
+		hlm(
+			'placeholder:text-muted-foreground flex h-9 w-full bg-transparent py-1 text-base outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+			this.userClass(),
+		),
+	);
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-search.ts.template

@@ -0,0 +1,28 @@
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { provideHlmIconConfig } from '<%- importAlias %>/icon';
+import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
+
+@Component({
+	selector: 'hlm-autocomplete-search',
+	template: `
+		<ng-content />
+	`,
+	host: {
+		'[class]': '_computedClass()',
+	},
+	providers: [provideHlmIconConfig({ size: 'sm' })],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HlmAutocompleteSearch {
+	/** The user defined class  */
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
+
+	/** The styles to apply  */
+	protected readonly _computedClass = computed(() =>
+		hlm(
+			'border-input focus-within:border-ring bg-background focus-within:ring-ring/50 shadow-xs dark:bg-input/30 flex h-9 min-w-0 items-center gap-2 rounded-md border px-3 focus-within:ring-[3px] [&>_ng-icon]:flex-none [&>_ng-icon]:opacity-50',
+			this.userClass(),
+		),
+	);
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete-trigger.ts.template

@@ -0,0 +1,32 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import { booleanAttribute, Directive, ElementRef, inject, input } from '@angular/core';
+import { BrnDialog } from '@spartan-ng/brain/dialog';
+
+@Directive({
+	selector: '[hlmAutocompleteTrigger]',
+	host: {
+		'(click)': 'open()',
+	},
+})
+export class HlmAutocompleteTrigger {
+	private readonly _host = inject(ElementRef, { host: true });
+
+	private readonly _brnDialog = inject(BrnDialog, { optional: true });
+
+	/** Whether the trigger is disabled. */
+	public readonly disabledTrigger = input<boolean, BooleanInput>(false, {
+		transform: booleanAttribute,
+	});
+
+	constructor() {
+		if (!this._brnDialog) return;
+
+		this._brnDialog.mutableAttachTo.set(this._host.nativeElement);
+	}
+
+	open() {
+		if (this.disabledTrigger()) return;
+
+		this._brnDialog?.open();
+	}
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete.token.ts.template

@@ -0,0 +1,23 @@
+import { inject, InjectionToken, ValueProvider } from '@angular/core';
+
+export type TransformValueToString<T> = (value: T) => string;
+
+export interface HlmAutocompleteConfig<T> {
+	transformValueToSearch: TransformValueToString<T>;
+}
+
+function getDefaultConfig<T>(): HlmAutocompleteConfig<T> {
+	return {
+		transformValueToSearch: (value: T) => (typeof value === 'string' ? value : String(value)),
+	};
+}
+
+const HlmAutocompleteConfigToken = new InjectionToken<HlmAutocompleteConfig<unknown>>('HlmAutocompleteConfig');
+
+export function provideHlmAutocompleteConfig<T>(config: Partial<HlmAutocompleteConfig<T>>): ValueProvider {
+	return { provide: HlmAutocompleteConfigToken, useValue: { ...getDefaultConfig(), ...config } };
+}
+
+export function injectHlmAutocompleteConfig<T>(): HlmAutocompleteConfig<T> {
+	return inject(HlmAutocompleteConfigToken, { optional: true }) ?? getDefaultConfig();
+}

package/src/generators/ui/libs/ui-autocomplete-helm/files/lib/hlm-autocomplete.ts.template

@@ -0,0 +1,286 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import { NgTemplateOutlet } from '@angular/common';
+import {
+	booleanAttribute,
+	ChangeDetectionStrategy,
+	Component,
+	computed,
+	ElementRef,
+	forwardRef,
+	inject,
+	input,
+	linkedSignal,
+	output,
+	TemplateRef,
+	viewChild,
+} from '@angular/core';
+import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { lucideChevronDown, lucideSearch } from '@ng-icons/lucide';
+import { BrnAutocomplete, BrnAutocompleteEmpty } from '@spartan-ng/brain/autocomplete';
+import { ChangeFn, TouchFn } from '@spartan-ng/brain/forms';
+import { BrnPopover, BrnPopoverContent } from '@spartan-ng/brain/popover';
+import { HlmIcon } from '<%- importAlias %>/icon';
+import { HlmPopoverContent } from '<%- importAlias %>/popover';
+import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
+import { HlmAutocompleteEmpty } from './hlm-autocomplete-empty';
+import { HlmAutocompleteGroup } from './hlm-autocomplete-group';
+import { HlmAutocompleteItem } from './hlm-autocomplete-item';
+import { HlmAutocompleteList } from './hlm-autocomplete-list';
+import { HlmAutocompleteSearch } from './hlm-autocomplete-search';
+import { HlmAutocompleteSearchInput } from './hlm-autocomplete-search-input';
+import { HlmAutocompleteTrigger } from './hlm-autocomplete-trigger';
+import { injectHlmAutocompleteConfig } from './hlm-autocomplete.token';
+
+export const HLM_AUTOCOMPLETE_VALUE_ACCESSOR = {
+	provide: NG_VALUE_ACCESSOR,
+	useExisting: forwardRef(() => HlmAutocomplete),
+	multi: true,
+};
+
+@Component({
+	selector: 'hlm-autocomplete',
+	imports: [
+		NgTemplateOutlet,
+
+		BrnPopover,
+		BrnPopoverContent,
+		HlmPopoverContent,
+
+		BrnAutocomplete,
+		BrnAutocompleteEmpty,
+		HlmAutocompleteEmpty,
+		HlmAutocompleteGroup,
+		HlmAutocompleteItem,
+		HlmAutocompleteList,
+		HlmAutocompleteSearch,
+		HlmAutocompleteSearchInput,
+		HlmAutocompleteTrigger,
+
+		NgIcon,
+		HlmIcon,
+	],
+	providers: [HLM_AUTOCOMPLETE_VALUE_ACCESSOR, provideIcons({ lucideSearch, lucideChevronDown })],
+	template: `
+		<brn-popover
+			#popover
+			align="start"
+			autoFocus="first-heading"
+			sideOffset="5"
+			closeDelay="100"
+			[closeOnOutsidePointerEvents]="true"
+		>
+			<div brnAutocomplete>
+				<hlm-autocomplete-search hlmAutocompleteTrigger [disabledTrigger]="!_search()">
+					<ng-icon name="lucideSearch" hlm />
+					<input
+						#input
+						type="text"
+						autocomplete="off"
+						hlm-autocomplete-search-input
+						[id]="inputId()"
+						[placeholder]="searchPlaceholderText()"
+						[disabled]="_disabled()"
+						[value]="_search()"
+						(input)="_onSearchChanged($event)"
+						(keydown.arrowDown)="_openPopover()"
+					/>
+
+					<button
+						class="flex items-center justify-center outline-none disabled:cursor-not-allowed [&>_ng-icon]:opacity-50"
+						tabindex="-1"
+						type="button"
+						[attr.aria-label]="ariaLabelToggleButton()"
+						[disabled]="_disabled()"
+						(click)="_toggleOptions()"
+					>
+						<ng-icon name="lucideChevronDown" hlm />
+					</button>
+				</hlm-autocomplete-search>
+
+				<div
+					*brnPopoverContent="let ctx"
+					hlmPopoverContent
+					class="p-0"
+					[style.width.px]="_elementRef.nativeElement.offsetWidth"
+				>
+					<hlm-autocomplete-list
+						[class]="_computedAutocompleteListClass()"
+						[class.hidden]="filteredOptions().length === 0"
+					>
+						<hlm-autocomplete-group>
+							@for (option of filteredOptions(); track option) {
+								<button hlm-autocomplete-item [value]="option" (selected)="_optionSelected(option)">
+									@if (optionTemplate(); as optionTemplate) {
+										<ng-container *ngTemplateOutlet="optionTemplate; context: { $implicit: option }" />
+									} @else {
+										{{ option }}
+									}
+								</button>
+							}
+						</hlm-autocomplete-group>
+					</hlm-autocomplete-list>
+
+					<div *brnAutocompleteEmpty hlmAutocompleteEmpty [class]="_computedAutocompleteEmptyClass()">
+						@if (loading()) {
+							<ng-content select="[loading]">{{ loadingText() }}</ng-content>
+						} @else {
+							<ng-content select="[empty]">{{ emptyText() }}</ng-content>
+						}
+					</div>
+				</div>
+			</div>
+		</brn-popover>
+	`,
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	host: {
+		'[class]': '_computedClass()',
+	},
+})
+export class HlmAutocomplete<T> implements ControlValueAccessor {
+	private static _id = 0;
+	private readonly _config = injectHlmAutocompleteConfig<T>();
+
+	private readonly _brnPopover = viewChild.required(BrnPopover);
+	private readonly _inputRef = viewChild.required('input', { read: ElementRef });
+
+	protected readonly _elementRef = inject(ElementRef<HTMLElement>);
+
+	/** The user defined class  */
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
+	protected readonly _computedClass = computed(() => hlm('block w-full', this.userClass()));
+
+	/** Custom class for the autocomplete list. */
+	public readonly autocompleteListClass = input<ClassValue>('');
+	protected readonly _computedAutocompleteListClass = computed(() => hlm('', this.autocompleteListClass()));
+
+	/** Custom class for the empty and loading state container. */
+	public readonly autocompleteEmptyClass = input<ClassValue>('');
+	protected readonly _computedAutocompleteEmptyClass = computed(() => hlm('', this.autocompleteEmptyClass()));
+
+	/** The list of filtered options to display in the autocomplete. */
+	public readonly filteredOptions = input<T[]>([]);
+
+	/** The selected value. */
+	public readonly value = input<T>();
+	protected readonly _value = linkedSignal(() => this.value());
+
+	/** The search query. */
+	public readonly search = input<string>();
+	protected readonly _search = linkedSignal(() => this.search() || '');
+
+	/** Function to transform an option value to a search string. Defaults to identity function for strings. */
+	public readonly transformValueToSearch = input<(value: T) => string>(this._config.transformValueToSearch);
+
+	/** Optional template for rendering each option. */
+	public readonly optionTemplate = input<TemplateRef<HlmAutocompleteOption<T>>>();
+
+	/** Whether the autocomplete is in a loading state. */
+	public readonly loading = input<boolean, BooleanInput>(false, { transform: booleanAttribute });
+
+	/** Placeholder text for the input field. */
+	public readonly searchPlaceholderText = input('Select an option');
+
+	/** Text to display when loading options. */
+	public readonly loadingText = input('Loading options...');
+
+	/** Text to display when no options are found. */
+	public readonly emptyText = input('No options found');
+
+	/** Aria label for the toggle button. */
+	public readonly ariaLabelToggleButton = input<string>('Toggle options');
+
+	/** The id of the input field. */
+	public readonly inputId = input<string>(`hlm-autocomplete-input-${++HlmAutocomplete._id}`);
+
+	/** Whether the autocomplete is disabled. */
+	public readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });
+	protected readonly _disabled = linkedSignal(() => this.disabled());
+
+	/** Emitted when the selected value changes. */
+	public readonly valueChange = output<T | null>();
+
+	/** Emitted when the search query changes. */
+	public readonly searchChange = output<string>();
+
+	protected _onChange?: ChangeFn<T | null>;
+	protected _onTouched?: TouchFn;
+
+	protected _setPopoverState(state: 'open' | 'closed') {
+		if (state === 'open') {
+			this._brnPopover().open();
+		} else {
+			this._brnPopover().close();
+		}
+	}
+
+	protected _openPopover() {
+		if (this._search() || this.filteredOptions().length > 0) {
+			// only open if there's a search term or options to show
+			this._brnPopover().open();
+		}
+	}
+
+	protected _toggleOptions() {
+		if (this._search() || this.filteredOptions().length > 0) {
+			// only toggle if there's a search term or options to show
+			const state = this._brnPopover().stateComputed();
+			this._setPopoverState(state === 'open' ? 'closed' : 'open');
+		}
+
+		this._inputRef().nativeElement.focus();
+	}
+
+	protected _onSearchChanged(event: Event) {
+		const input = event.target as HTMLInputElement;
+		this._search.set(input.value);
+		this.searchChange.emit(input.value);
+
+		this._clearOption();
+
+		if (this._brnPopover().stateComputed() !== 'open' && input.value.length > 0) {
+			this._setPopoverState('open');
+		}
+	}
+
+	protected _clearOption() {
+		this._value.set(undefined);
+		this._onChange?.(null);
+		this.valueChange.emit(null);
+	}
+
+	protected _optionSelected(option: T) {
+		this._value.set(option);
+		this._onChange?.(option);
+		this.valueChange.emit(option);
+
+		const searchValue = this.transformValueToSearch()(option);
+
+		this._search.set(searchValue);
+		this.searchChange.emit(searchValue);
+
+		this._setPopoverState('closed');
+	}
+
+	/** CONTROL VALUE ACCESSOR */
+	public writeValue(value: T | null): void {
+		this._value.set(value ? value : undefined);
+	}
+
+	public registerOnChange(fn: ChangeFn<T | null>): void {
+		this._onChange = fn;
+	}
+
+	public registerOnTouched(fn: TouchFn): void {
+		this._onTouched = fn;
+	}
+
+	public setDisabledState(isDisabled: boolean): void {
+		this._disabled.set(isDisabled);
+	}
+}
+
+interface HlmAutocompleteOption<T> {
+	$implicit: T;
+}

package/src/generators/ui/libs/ui-autocomplete-helm/generator.d.ts

@@ -0,0 +1,3 @@
+import { Tree } from '@nx/devkit';
+import type { HlmBaseGeneratorSchema } from '../../../base/schema';
+export declare function generator(tree: Tree, options: HlmBaseGeneratorSchema): Promise<import("@nx/devkit").GeneratorCallback>;

package/src/generators/ui/libs/ui-autocomplete-helm/generator.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generator = generator;
+const tslib_1 = require("tslib");
+const generator_1 = tslib_1.__importDefault(require("../../../base/generator"));
+async function generator(tree, options) {
+    return await (0, generator_1.default)(tree, {
+        ...options,
+        primitiveName: 'autocomplete',
+        internalName: 'ui-autocomplete-helm',
+        publicName: 'ui-autocomplete-helm',
+    });
+}
+//# sourceMappingURL=generator.js.map

package/src/generators/ui/libs/ui-autocomplete-helm/generator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../../../../libs/cli/src/generators/ui/libs/ui-autocomplete-helm/generator.ts"],"names":[],"mappings":";;AAIA,8BAOC;;AAVD,gFAAuD;AAGhD,KAAK,UAAU,SAAS,CAAC,IAAU,EAAE,OAA+B;IAC1E,OAAO,MAAM,IAAA,mBAAgB,EAAC,IAAI,EAAE;QACnC,GAAG,OAAO;QACV,aAAa,EAAE,cAAc;QAC7B,YAAY,EAAE,sBAAsB;QACpC,UAAU,EAAE,sBAAsB;KAClC,CAAC,CAAC;AACJ,CAAC"}

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command-group-label.ts.template

@@ -11,10 +11,10 @@ import { hlm } from '<%- importAlias %>/utils';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommandGroupLabel {
-	/*** The user defined class  */
+	/** The user defined class  */
 	public readonly userClass = input<string>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>
 		hlm('text-muted-foreground px-2 py-1.5 text-xs font-medium', this.userClass()),
 	);

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command-group.ts.template

@@ -17,10 +17,10 @@ import { hlm } from '<%- importAlias %>/utils';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommandGroup {
-	/*** The user defined class  */
+	/** The user defined class  */
 	public readonly userClass = input<string>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>
 		hlm('text-foreground block overflow-hidden p-1 data-[hidden]:hidden', this.userClass()),
 	);

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command-item.ts.template

@@ -1,5 +1,4 @@
-import { BooleanInput } from '@angular/cdk/coercion';
-import { booleanAttribute, ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
 import { BrnCommandItem } from '@spartan-ng/brain/command';
 import { hlm } from '<%- importAlias %>/utils';
 
@@ -21,21 +20,10 @@ import { hlm } from '<%- importAlias %>/utils';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommandItem {
-	/** The value this item represents. */
-	public readonly value = input<string>();
-
-	/** Whether the item is disabled. */
-	public readonly disabled = input<boolean, BooleanInput>(false, {
-		transform: booleanAttribute,
-	});
-
-	/** Emits when the item is selected. */
-	public readonly selected = output<void>();
-
-	/*** The user defined class  */
+	/** The user defined class  */
 	public readonly userClass = input<string>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>
 		hlm(
 			'data-[selected]:bg-accent data-[selected=true]:text-accent-foreground [&>ng-icon]:text-muted-foreground outline-hidden relative flex w-full cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled]:pointer-events-none data-[hidden]:hidden data-[disabled]:opacity-50 [&>ng-icon]:pointer-events-none [&>ng-icon]:shrink-0 [&>ng-icon]:text-base',

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command-search-input.ts.template

@@ -13,10 +13,10 @@ import type { ClassValue } from 'clsx';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommandSearchInput {
-	/*** The user defined class  */
+	/** The user defined class  */
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>
 		hlm(
 			'placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command-search.ts.template

@@ -15,10 +15,10 @@ import type { ClassValue } from 'clsx';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommandSearch {
-	/*** The user defined class  */
+	/** The user defined class  */
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>
 		hlm('flex h-9 items-center gap-2 border-b px-3 [&>_ng-icon]:flex-none [&>_ng-icon]:opacity-50', this.userClass()),
 	);

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command-separator.ts.template

@@ -11,9 +11,9 @@ import { hlm } from '<%- importAlias %>/utils';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommandSeparator {
-	/*** The user defined class  */
+	/** The user defined class  */
 	public readonly userClass = input<string>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() => hlm('bg-border -mx-1 block h-px', this.userClass()));
 }

package/src/generators/ui/libs/ui-command-helm/files/lib/hlm-command.ts.template

@@ -21,10 +21,10 @@ import type { ClassValue } from 'clsx';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class HlmCommand {
-	/*** The user defined class */
+	/** The user defined class */
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
-	/*** The styles to apply  */
+	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>
 		hlm('bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md', this.userClass()),
 	);

package/src/generators/ui/primitive-deps.js

@@ -6,6 +6,7 @@ exports.primitiveDependencies = {
     alert: ['utils', 'icon'],
     'alert-dialog': ['utils', 'button'],
     'aspect-ratio': ['utils'],
+    autocomplete: ['utils', 'popover', 'command', 'icon'],
     avatar: ['utils'],
     badge: ['utils'],
     breadcrumb: ['utils', 'icon'],

package/src/generators/ui/primitive-deps.js.map

@@ -1 +1 @@
-{"version":3,"file":"primitive-deps.js","sourceRoot":"","sources":["../../../../../../libs/cli/src/generators/ui/primitive-deps.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"primitive-deps.js","sourceRoot":"","sources":["../../../../../../libs/cli/src/generators/ui/primitive-deps.ts"],"names":[],"mappings":"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"}

package/src/generators/ui/primitives.d.ts

@@ -1 +1 @@
-export type Primitive = 'accordion' | 'alert' | 'alert-dialog' | 'aspect-ratio' | 'avatar' | 'badge' | 'breadcrumb' | 'button' | 'calendar' | 'card' | 'carousel' | 'checkbox' | 'collapsible' | 'command' | 'context-menu' | 'date-picker' | 'dialog' | 'form-field' | 'hover-card' | 'icon' | 'input' | 'input-otp' | 'label' | 'menu' | 'menubar' | 'pagination' | 'popover' | 'progress' | 'radio-group' | 'scroll-area' | 'select' | 'separator' | 'sheet' | 'skeleton' | 'slider' | 'sonner' | 'spinner' | 'switch' | 'table' | 'tabs' | 'toggle' | 'toggle-group' | 'tooltip' | 'utils';
+export type Primitive = 'accordion' | 'alert' | 'alert-dialog' | 'aspect-ratio' | 'autocomplete' | 'avatar' | 'badge' | 'breadcrumb' | 'button' | 'calendar' | 'card' | 'carousel' | 'checkbox' | 'collapsible' | 'command' | 'context-menu' | 'date-picker' | 'dialog' | 'form-field' | 'hover-card' | 'icon' | 'input' | 'input-otp' | 'label' | 'menu' | 'menubar' | 'pagination' | 'popover' | 'progress' | 'radio-group' | 'scroll-area' | 'select' | 'separator' | 'sheet' | 'skeleton' | 'slider' | 'sonner' | 'spinner' | 'switch' | 'table' | 'tabs' | 'toggle' | 'toggle-group' | 'tooltip' | 'utils';

package/src/generators/ui/supported-ui-libraries.json

@@ -3,7 +3,7 @@
 		"internalName": "ui-accordion-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0"
@@ -21,7 +21,7 @@
 		"internalName": "ui-alert-dialog-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -33,11 +33,24 @@
 			"clsx": "^2.1.1"
 		}
 	},
+	"autocomplete": {
+		"internalName": "ui-autocomplete-helm",
+		"peerDependencies": {
+			"@angular/core": ">=19.0.0",
+			"clsx": "^2.1.1",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
+			"@angular/cdk": ">=19.0.0",
+			"@angular/common": ">=19.0.0",
+			"@angular/forms": ">=19.0.0",
+			"@ng-icons/core": ">=29.0.0",
+			"@ng-icons/lucide": ">=29.0.0"
+		}
+	},
 	"avatar": {
 		"internalName": "ui-avatar-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -63,7 +76,7 @@
 		"internalName": "ui-button-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"class-variance-authority": "^0.7.0",
 			"clsx": "^2.1.1"
 		}
@@ -75,7 +88,7 @@
 			"@angular/cdk": ">=19.0.0",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -105,7 +118,7 @@
 			"@angular/forms": ">=19.0.0",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -113,9 +126,8 @@
 		"internalName": "ui-command-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
-			"clsx": "^2.1.1",
-			"@angular/cdk": ">=19.0.0"
+			"@spartan-ng/brain": "0.0.1-alpha.511",
+			"clsx": "^2.1.1"
 		}
 	},
 	"date-picker": {
@@ -126,7 +138,7 @@
 			"@angular/forms": ">=19.0.0",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -138,7 +150,7 @@
 			"@angular/common": ">=19.0.0",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"@angular/cdk": ">=19.0.0"
 		}
 	},
@@ -147,7 +159,7 @@
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
 			"@angular/forms": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -155,7 +167,7 @@
 		"internalName": "ui-hover-card-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -174,7 +186,7 @@
 			"class-variance-authority": "^0.7.0",
 			"clsx": "^2.1.1",
 			"@angular/forms": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509"
+			"@spartan-ng/brain": "0.0.1-alpha.511"
 		}
 	},
 	"input-otp": {
@@ -185,14 +197,14 @@
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
 			"@angular/cdk": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509"
+			"@spartan-ng/brain": "0.0.1-alpha.511"
 		}
 	},
 	"label": {
 		"internalName": "ui-label-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -200,7 +212,7 @@
 		"internalName": "ui-menu-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
@@ -214,7 +226,7 @@
 			"@angular/core": ">=19.0.0",
 			"@angular/cdk": ">=19.0.0",
 			"@angular/forms": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"class-variance-authority": "^0.7.0",
 			"clsx": "^2.1.1",
 			"@ng-icons/core": ">=29.0.0",
@@ -227,14 +239,14 @@
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
 			"clsx": "^2.1.1",
-			"@spartan-ng/brain": "0.0.1-alpha.509"
+			"@spartan-ng/brain": "0.0.1-alpha.511"
 		}
 	},
 	"progress": {
 		"internalName": "ui-progress-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -242,7 +254,7 @@
 		"internalName": "ui-radio-group-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1",
 			"@angular/common": ">=19.0.0"
 		}
@@ -259,7 +271,7 @@
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
 			"@angular/cdk": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
@@ -270,7 +282,7 @@
 		"internalName": "ui-separator-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -281,7 +293,7 @@
 			"clsx": "^2.1.1",
 			"@ng-icons/core": ">=29.0.0",
 			"@ng-icons/lucide": ">=29.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"class-variance-authority": "^0.7.0"
 		}
 	},
@@ -296,7 +308,7 @@
 		"internalName": "ui-slider-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -322,7 +334,7 @@
 			"clsx": "^2.1.1",
 			"@angular/cdk": ">=19.0.0",
 			"@angular/forms": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509"
+			"@spartan-ng/brain": "0.0.1-alpha.511"
 		}
 	},
 	"table": {
@@ -336,7 +348,7 @@
 		"internalName": "ui-tabs-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509",
+			"@spartan-ng/brain": "0.0.1-alpha.511",
 			"clsx": "^2.1.1",
 			"class-variance-authority": "^0.7.0",
 			"@angular/cdk": ">=19.0.0",
@@ -365,7 +377,7 @@
 		"internalName": "ui-tooltip-helm",
 		"peerDependencies": {
 			"@angular/core": ">=19.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.509"
+			"@spartan-ng/brain": "0.0.1-alpha.511"
 		}
 	},
 	"typography": {