@salesforce/ui-bundle-template-feature-angular-object-search 12.5.4

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/pagination/hlm-pagination-previous.ts

@@ -0,0 +1,65 @@
+import type { BooleanInput } from '@angular/cdk/coercion';
+import {
+	booleanAttribute,
+	ChangeDetectionStrategy,
+	Component,
+	computed,
+	input,
+} from '@angular/core';
+import type { RouterLink } from '@angular/router';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { lucideChevronLeft } from '@ng-icons/lucide';
+import type { ButtonVariants } from '@spartan-ng/styles/button';
+import { hlm } from '@spartan-ng/styles/utils';
+import type { ClassValue } from 'clsx';
+import { HlmPaginationLink } from './hlm-pagination-link';
+
+@Component({
+	selector: 'hlm-pagination-previous',
+	imports: [HlmPaginationLink, NgIcon],
+	providers: [provideIcons({ lucideChevronLeft })],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	template: `
+		<a
+			hlmPaginationLink
+			[class]="_computedClass()"
+			[link]="link()"
+			[queryParams]="queryParams()"
+			[queryParamsHandling]="queryParamsHandling()"
+			[size]="_size()"
+			[attr.aria-label]="ariaLabel()"
+		>
+			<ng-icon name="lucideChevronLeft" class="rtl:rotate-180" />
+			<span [class]="_labelClass()">{{ text() }}</span>
+		</a>
+	`,
+})
+export class HlmPaginationPrevious {
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
+	/** The link to navigate to the previous page. */
+	public readonly link = input<RouterLink['routerLink']>();
+	/** The query parameters to pass to the previous page. */
+	public readonly queryParams = input<RouterLink['queryParams']>();
+	/** How to handle query parameters when navigating to the previous page. */
+	public readonly queryParamsHandling = input<RouterLink['queryParamsHandling']>();
+
+	/** The aria-label for the previous page link. */
+	public readonly ariaLabel = input<string>('Go to previous page', { alias: 'aria-label' });
+	/** The text to display for the previous page link. */
+	public readonly text = input<string>('Previous');
+	/** Whether the button should only display the icon. */
+	public readonly iconOnly = input<boolean, BooleanInput>(false, {
+		transform: booleanAttribute,
+	});
+	protected readonly _labelClass = computed(() =>
+		hlm(this.iconOnly() ? 'sr-only' : 'hidden sm:block'),
+	);
+
+	protected readonly _size = computed<ButtonVariants['size']>(() =>
+		this.iconOnly() ? 'icon' : 'default',
+	);
+
+	protected readonly _computedClass = computed(() =>
+		hlm(!this.iconOnly() && 'ps-1.5!', this.userClass()),
+	);
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/pagination/hlm-pagination.ts

@@ -0,0 +1,19 @@
+import { Directive, input } from '@angular/core';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmPagination],hlm-pagination',
+	host: {
+		'data-slot': 'pagination',
+		role: 'navigation',
+		'[attr.aria-label]': 'ariaLabel()',
+	},
+})
+export class HlmPagination {
+	/** The aria-label for the pagination component. */
+	public readonly ariaLabel = input<string>('pagination', { alias: 'aria-label' });
+
+	constructor() {
+		classes(() => 'mx-auto flex w-full justify-center');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/pagination/index.ts

@@ -0,0 +1,31 @@
+import { HlmNumberedPagination } from './hlm-numbered-pagination';
+import { HlmNumberedPaginationQueryParams } from './hlm-numbered-pagination-query-params';
+import { HlmPagination } from './hlm-pagination';
+import { HlmPaginationContent } from './hlm-pagination-content';
+import { HlmPaginationEllipsis } from './hlm-pagination-ellipsis';
+import { HlmPaginationItem } from './hlm-pagination-item';
+import { HlmPaginationLink } from './hlm-pagination-link';
+import { HlmPaginationNext } from './hlm-pagination-next';
+import { HlmPaginationPrevious } from './hlm-pagination-previous';
+
+export * from './hlm-numbered-pagination';
+export * from './hlm-numbered-pagination-query-params';
+export * from './hlm-pagination';
+export * from './hlm-pagination-content';
+export * from './hlm-pagination-ellipsis';
+export * from './hlm-pagination-item';
+export * from './hlm-pagination-link';
+export * from './hlm-pagination-next';
+export * from './hlm-pagination-previous';
+
+export const HlmPaginationImports = [
+	HlmPagination,
+	HlmPaginationContent,
+	HlmPaginationItem,
+	HlmPaginationLink,
+	HlmPaginationPrevious,
+	HlmPaginationNext,
+	HlmPaginationEllipsis,
+	HlmNumberedPagination,
+	HlmNumberedPaginationQueryParams,
+] as const;

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover-content.ts

@@ -0,0 +1,25 @@
+import { Directive, ElementRef, Renderer2, effect, inject, signal } from '@angular/core';
+import { injectExposesStateProvider } from '@spartan-ng/brain/core';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmPopoverContent],hlm-popover-content',
+	host: { 'data-slot': 'popover-content' },
+})
+export class HlmPopoverContent {
+	private readonly _stateProvider = injectExposesStateProvider({ host: true });
+	public state = this._stateProvider.state ?? signal('closed');
+	private readonly _renderer = inject(Renderer2);
+	private readonly _element = inject(ElementRef);
+
+	constructor() {
+		effect(() => {
+			this._renderer.setAttribute(this._element.nativeElement, 'data-state', this.state());
+		});
+
+		classes(
+			() =>
+				'bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 gap-2.5 rounded-lg p-2.5 text-sm shadow-md ring-1 duration-100 relative flex w-72 flex-col outline-none',
+		);
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover-description.ts

@@ -0,0 +1,12 @@
+import { Directive } from '@angular/core';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmPopoverDescription]',
+	host: { 'data-slot': 'popover-description' },
+})
+export class HlmPopoverDescription {
+	constructor() {
+		classes(() => 'text-muted-foreground');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover-header.ts

@@ -0,0 +1,12 @@
+import { Directive } from '@angular/core';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmPopoverHeader],hlm-popover-header',
+	host: { 'data-slot': 'popover-header' },
+})
+export class HlmPopoverHeader {
+	constructor() {
+		classes(() => 'flex flex-col gap-0.5 text-sm');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover-portal.ts

@@ -0,0 +1,8 @@
+import { Directive } from '@angular/core';
+import { BrnPopoverContent } from '@spartan-ng/brain/popover';
+
+@Directive({
+	selector: '[hlmPopoverPortal]',
+	hostDirectives: [{ directive: BrnPopoverContent, inputs: ['context', 'class'] }],
+})
+export class HlmPopoverPortal {}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover-title.ts

@@ -0,0 +1,12 @@
+import { Directive } from '@angular/core';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmPopoverTitle]',
+	host: { 'data-slot': 'popover-title' },
+})
+export class HlmPopoverTitle {
+	constructor() {
+		classes(() => 'font-medium');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover-trigger.ts

@@ -0,0 +1,14 @@
+import { Directive } from '@angular/core';
+import { BrnPopoverTrigger } from '@spartan-ng/brain/popover';
+
+@Directive({
+	selector: 'button[hlmPopoverTrigger],button[hlmPopoverTriggerFor]',
+	hostDirectives: [
+		{
+			directive: BrnPopoverTrigger,
+			inputs: ['id', 'brnPopoverTriggerFor: hlmPopoverTriggerFor', 'type'],
+		},
+	],
+	host: { 'data-slot': 'popover-trigger' },
+})
+export class HlmPopoverTrigger {}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/hlm-popover.ts

@@ -0,0 +1,23 @@
+import { Directive } from '@angular/core';
+import { BrnPopover } from '@spartan-ng/brain/popover';
+
+@Directive({
+	selector: '[hlmPopover],hlm-popover',
+	hostDirectives: [
+		{
+			directive: BrnPopover,
+			inputs: [
+				'align',
+				'attachTo',
+				'autoFocus',
+				'closeOnOutsidePointerEvents',
+				'offsetX',
+				'sideOffset',
+				'state',
+			],
+			outputs: ['stateChanged', 'closed'],
+		},
+	],
+	host: { 'data-slot': 'popover' },
+})
+export class HlmPopover {}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/popover/index.ts

@@ -0,0 +1,25 @@
+import { HlmPopover } from './hlm-popover';
+import { HlmPopoverContent } from './hlm-popover-content';
+import { HlmPopoverDescription } from './hlm-popover-description';
+import { HlmPopoverHeader } from './hlm-popover-header';
+import { HlmPopoverPortal } from './hlm-popover-portal';
+import { HlmPopoverTitle } from './hlm-popover-title';
+import { HlmPopoverTrigger } from './hlm-popover-trigger';
+
+export * from './hlm-popover';
+export * from './hlm-popover-content';
+export * from './hlm-popover-description';
+export * from './hlm-popover-header';
+export * from './hlm-popover-portal';
+export * from './hlm-popover-title';
+export * from './hlm-popover-trigger';
+
+export const HlmPopoverImports = [
+	HlmPopover,
+	HlmPopoverContent,
+	HlmPopoverDescription,
+	HlmPopoverHeader,
+	HlmPopoverPortal,
+	HlmPopoverTitle,
+	HlmPopoverTrigger,
+] as const;

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-content.ts

@@ -0,0 +1,44 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import {
+	booleanAttribute,
+	ChangeDetectionStrategy,
+	Component,
+	computed,
+	input,
+} from '@angular/core';
+import { BrnSelectContent } from '@spartan-ng/brain/select';
+import { classes, hlm } from '@spartan-ng/styles/utils';
+import { HlmSelectScrollDown } from './hlm-select-scroll-down';
+import { HlmSelectScrollUp } from './hlm-select-scroll-up';
+
+@Component({
+	selector: 'hlm-select-content',
+	imports: [HlmSelectScrollUp, HlmSelectScrollDown],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	hostDirectives: [BrnSelectContent],
+	template: `
+		@if (showScroll()) {
+			<hlm-select-scroll-up />
+		}
+
+		<div role="listbox" [class]="_computedListboxClasses()">
+			<ng-content />
+		</div>
+
+		@if (showScroll()) {
+			<hlm-select-scroll-down />
+		}
+	`,
+})
+export class HlmSelectContent {
+	protected readonly _computedListboxClasses = computed(() => hlm('flex flex-col'));
+
+	public readonly showScroll = input<boolean, BooleanInput>(false, { transform: booleanAttribute });
+
+	constructor() {
+		classes(
+			() =>
+				'bg-popover no-scrollbar text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 max-h-72 min-w-36 flex-col rounded-lg shadow-md ring-1 duration-100 relative flex w-(--brn-select-width) overflow-x-hidden overflow-y-auto',
+		);
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-group.ts

@@ -0,0 +1,14 @@
+import { Directive } from '@angular/core';
+import { BrnSelectGroup } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelectGroup],hlm-select-group',
+	hostDirectives: [{ directive: BrnSelectGroup }],
+	host: { 'data-slot': 'select-group' },
+})
+export class HlmSelectGroup {
+	constructor() {
+		classes(() => 'scroll-my-1 p-1');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-item.ts

@@ -0,0 +1,36 @@
+import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { lucideCheck } from '@ng-icons/lucide';
+import { BrnSelectItem } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Component({
+	selector: 'hlm-select-item',
+	imports: [NgIcon],
+	providers: [provideIcons({ lucideCheck })],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	hostDirectives: [{ directive: BrnSelectItem, inputs: ['id', 'disabled', 'value'] }],
+	host: { 'data-slot': 'select-item' },
+	template: `
+		<ng-content />
+		@if (_active()) {
+			<ng-icon
+				name="lucideCheck"
+				class="absolute end-2 flex items-center justify-center text-[length:--spacing(4)]"
+				aria-hidden="true"
+			/>
+		}
+	`,
+})
+export class HlmSelectItem {
+	private readonly _brnSelectItem = inject(BrnSelectItem);
+
+	protected readonly _active = this._brnSelectItem.active;
+
+	constructor() {
+		classes(
+			() =>
+				'data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground gap-1.5 rounded-md py-1 ps-1.5 pe-8 text-sm *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0',
+		);
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-label.ts

@@ -0,0 +1,14 @@
+import { Directive } from '@angular/core';
+import { BrnSelectLabel } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelectLabel],hlm-select-label',
+	hostDirectives: [{ directive: BrnSelectLabel, inputs: ['id'] }],
+	host: { 'data-slot': 'select-label' },
+})
+export class HlmSelectLabel {
+	constructor() {
+		classes(() => 'text-muted-foreground px-1.5 py-1 text-xs flex');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-multiple.ts

@@ -0,0 +1,37 @@
+import { Directive } from '@angular/core';
+import {
+	BrnPopover,
+	provideBrnPopoverConfig,
+	provideBrnPopoverDefaultOptions,
+} from '@spartan-ng/brain/popover';
+import { BrnSelectMultiple } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelectMultiple],hlm-select-multiple',
+	providers: [
+		provideBrnPopoverConfig({
+			align: 'start',
+			sideOffset: 6,
+		}),
+		provideBrnPopoverDefaultOptions({ role: null }),
+	],
+	hostDirectives: [
+		{
+			directive: BrnSelectMultiple,
+			inputs: ['disabled', 'value', 'isItemEqualToValue', 'itemToString'],
+			outputs: ['valueChange'],
+		},
+		{
+			directive: BrnPopover,
+			inputs: ['align', 'closeOnOutsidePointerEvents', 'sideOffset', 'state', 'offsetX'],
+			outputs: ['stateChanged', 'closed'],
+		},
+	],
+	host: { 'data-slot': 'select' },
+})
+export class HlmSelectMultiple {
+	constructor() {
+		classes(() => 'block');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-placeholder.ts

@@ -0,0 +1,17 @@
+import { Directive } from '@angular/core';
+import { BrnSelectPlaceholder } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelectPlaceholder],hlm-select-placeholder',
+	hostDirectives: [BrnSelectPlaceholder],
+	host: { 'data-slot': 'select-placeholder' },
+})
+export class HlmSelectPlaceholder {
+	constructor() {
+		classes(
+			() =>
+				"gap-2 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] flex items-center data-hidden:hidden [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0",
+		);
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-portal.ts

@@ -0,0 +1,8 @@
+import { Directive } from '@angular/core';
+import { BrnPopoverContent } from '@spartan-ng/brain/popover';
+
+@Directive({
+	selector: '[hlmSelectPortal]',
+	hostDirectives: [{ directive: BrnPopoverContent, inputs: ['context', 'class'] }],
+})
+export class HlmSelectPortal {}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-scroll-down.ts

@@ -0,0 +1,22 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { lucideChevronDown } from '@ng-icons/lucide';
+import { BrnSelectScrollDown } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Component({
+	selector: 'hlm-select-scroll-down',
+	imports: [NgIcon],
+	providers: [provideIcons({ lucideChevronDown })],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	hostDirectives: [BrnSelectScrollDown],
+	template: ` <ng-icon name="lucideChevronDown" /> `,
+})
+export class HlmSelectScrollDown {
+	constructor() {
+		classes(
+			() =>
+				"bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] sticky bottom-0 w-full data-hidden:hidden",
+		);
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-scroll-up.ts

@@ -0,0 +1,22 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { lucideChevronUp } from '@ng-icons/lucide';
+import { BrnSelectScrollUp } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Component({
+	selector: 'hlm-select-scroll-up',
+	imports: [NgIcon],
+	providers: [provideIcons({ lucideChevronUp })],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	hostDirectives: [BrnSelectScrollUp],
+	template: ` <ng-icon name="lucideChevronUp" /> `,
+})
+export class HlmSelectScrollUp {
+	constructor() {
+		classes(
+			() =>
+				"bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] sticky top-0 w-full data-hidden:hidden",
+		);
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-separator.ts

@@ -0,0 +1,14 @@
+import { Directive } from '@angular/core';
+import { BrnSelectSeparator } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelectSeparator],hlm-select-separator',
+	hostDirectives: [{ directive: BrnSelectSeparator, inputs: ['orientation'] }],
+	host: { 'data-slot': 'select-separator' },
+})
+export class HlmSelectSeparator {
+	constructor() {
+		classes(() => 'bg-border -mx-1 my-1 h-px pointer-events-none');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-trigger.ts

@@ -0,0 +1,59 @@
+import type { BooleanInput } from '@angular/cdk/coercion';
+import {
+	booleanAttribute,
+	ChangeDetectionStrategy,
+	Component,
+	computed,
+	input,
+} from '@angular/core';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { lucideChevronDown } from '@ng-icons/lucide';
+import { BrnFieldControlDescribedBy } from '@spartan-ng/brain/field';
+import { BrnSelectTrigger } from '@spartan-ng/brain/select';
+import { hlm } from '@spartan-ng/styles/utils';
+import type { ClassValue } from 'clsx';
+
+@Component({
+	selector: 'hlm-select-trigger',
+	imports: [NgIcon, BrnSelectTrigger, BrnFieldControlDescribedBy],
+	providers: [provideIcons({ lucideChevronDown })],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	host: { class: 'block' },
+	template: `
+		<button
+			brnSelectTrigger
+			brnFieldControlDescribedBy
+			[forceInvalid]="forceInvalid()"
+			[id]="buttonId()"
+			[class]="_computedClass()"
+			[attr.data-size]="size()"
+			data-slot="select-trigger"
+		>
+			<ng-content />
+			<ng-icon
+				name="lucideChevronDown"
+				class="text-muted-foreground text-[length:--spacing(4)] ms-auto"
+			/>
+		</button>
+	`,
+})
+export class HlmSelectTrigger {
+	private static _id = 0;
+
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
+	protected readonly _computedClass = computed(() =>
+		hlm(
+			'border-input data-placeholder:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 data-[matches-spartan-invalid=true]:ring-destructive/20 dark:data-[matches-spartan-invalid=true]:ring-destructive/40 data-[matches-spartan-invalid=true]:border-destructive dark:data-[matches-spartan-invalid=true]:border-destructive/50 gap-1.5 rounded-lg border bg-transparent py-2 ps-2.5 pe-2 text-sm transition-colors focus-visible:ring-3 data-[matches-spartan-invalid=true]:ring-3 data-[size=default]:h-8 data-[size=sm]:h-6 data-[size=sm]:text-xs data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=lg]:h-10 *:data-[slot=select-value]:gap-1.5 flex w-full items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0',
+			this.userClass(),
+		),
+	);
+
+	public readonly buttonId = input<string>(`hlm-select-trigger-${HlmSelectTrigger._id++}`);
+
+	public readonly size = input<'default' | 'sm' | 'lg'>('default');
+
+	/** Whether to force the trigger into an invalid state. */
+	public readonly forceInvalid = input<boolean, BooleanInput>(false, {
+		transform: booleanAttribute,
+	});
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-value-template.ts

@@ -0,0 +1,5 @@
+import { Directive } from '@angular/core';
+import { BrnSelectValueTemplate } from '@spartan-ng/brain/select';
+
+@Directive({ selector: '[hlmSelectValueTemplate]', hostDirectives: [BrnSelectValueTemplate] })
+export class HlmSelectValueTemplate {}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-value.ts

@@ -0,0 +1,18 @@
+import { Directive, inject } from '@angular/core';
+import { BrnSelectValue } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelectValue],hlm-select-value',
+	hostDirectives: [{ directive: BrnSelectValue, inputs: ['placeholder'] }],
+	host: { '[attr.data-slot]': '!_hidden() ? "select-value" : null' },
+})
+export class HlmSelectValue {
+	private readonly _brnSelectValue = inject(BrnSelectValue);
+
+	protected readonly _hidden = this._brnSelectValue.hidden;
+
+	constructor() {
+		classes(() => 'data-hidden:hidden');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-values-content.ts

@@ -0,0 +1,9 @@
+import { Directive } from '@angular/core';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({ selector: '[hlmSelectValuesContent],hlm-select-values-content' })
+export class HlmSelectValuesContent {
+	constructor() {
+		classes(() => 'gap-2 flex');
+	}
+}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select-values.ts

@@ -0,0 +1,5 @@
+import { Directive } from '@angular/core';
+import { BrnSelectValues } from '@spartan-ng/brain/select';
+
+@Directive({ selector: '[hlmSelectValues]', hostDirectives: [BrnSelectValues] })
+export class HlmSelectValues {}

package/dist/force-app/main/default/uiBundles/feature-angular-object-search/src/app/shared/select/hlm-select.ts

@@ -0,0 +1,37 @@
+import { Directive } from '@angular/core';
+import {
+	BrnPopover,
+	provideBrnPopoverConfig,
+	provideBrnPopoverDefaultOptions,
+} from '@spartan-ng/brain/popover';
+import { BrnSelect } from '@spartan-ng/brain/select';
+import { classes } from '@spartan-ng/styles/utils';
+
+@Directive({
+	selector: '[hlmSelect],hlm-select',
+	providers: [
+		provideBrnPopoverConfig({
+			align: 'start',
+			sideOffset: 6,
+		}),
+		provideBrnPopoverDefaultOptions({ role: null }),
+	],
+	hostDirectives: [
+		{
+			directive: BrnSelect,
+			inputs: ['disabled', 'value', 'isItemEqualToValue', 'itemToString'],
+			outputs: ['valueChange'],
+		},
+		{
+			directive: BrnPopover,
+			inputs: ['align', 'closeOnOutsidePointerEvents', 'sideOffset', 'state', 'offsetX'],
+			outputs: ['stateChanged', 'closed'],
+		},
+	],
+	host: { 'data-slot': 'select' },
+})
+export class HlmSelect {
+	constructor() {
+		classes(() => 'block');
+	}
+}