@praxisui/dynamic-fields 8.0.0-beta.92 → 8.0.0-beta.94

package/docs/dynamic-fields-field-selection-guide.md

@@ -23,7 +23,7 @@ icon: "rule"
 toc: true
 sidebar: true
 search_boost: 1.08
-reading_time: 14
+reading_time: 16
 estimated_setup_time: 20
 version: "1.0"
 related_docs:
@@ -37,7 +37,7 @@ keywords:
   - "select vs autocomplete"
   - "custom host field"
   - "inline filter"
-last_updated: "2026-03-26"
+last_updated: "2026-06-01"
 ---
 
 # Dynamic Fields Field Selection Guide
@@ -115,6 +115,36 @@ Se o schema usa `input` para algo que depois exige validacao pesada, busca seman
 | entidade de negocio remota com status, permissao, reidratacao ou dependencias | `entityLookup` | preserva identidade de entidade e usa contrato `RESOURCE_ENTITY` em vez de tratar entidade como opcao simples |
 | busca incremental com semantica de sugestao | `autoComplete` | boa UX para descoberta |
 
+### Promocao oficial de exemplos `entityLookup`
+
+Um recurso so deve ser promovido como exemplo oficial de `entityLookup` quando
+provar a cadeia completa de plataforma, nao apenas um dropdown remoto no host.
+
+Checklist minimo para promocao:
+
+- o backend publica o recurso com identidade canonica e `@ApiResource(resourceKey=...)`;
+- `/schemas/filtered` entrega `x-ui.controlType = entityLookup` com `optionSource.type = RESOURCE_ENTITY`;
+- `optionSource.resourcePath`, `valuePropertyPath`, `labelPropertyPath`, `searchPropertyPaths` e `display` explicam a entidade sem regra hardcoded no frontend;
+- o recurso oferece busca paginada e reidratacao por ids (`filter` e `byIds`) para valores salvos;
+- `selectionPolicy` documenta status, elegibilidade e preservacao de valor historico quando aplicavel;
+- dependencias entre entidades usam `dependsOn` e `dependencyFilterMap`, sem inferencia por nome de campo no Angular;
+- surfaces de detalhe sao publicadas pelo recurso quando `navigateToDetail` estiver habilitado;
+- existe demo jogavel cobrindo campo de formulario e, quando o uso for filtro, `inlineEntityLookup`;
+- existe teste focal ou e2e cobrindo busca, selecao, reidratacao e estado bloqueado/historico;
+- a landing publica o exemplo como derivado da documentacao canonica, sem redefinir o contrato.
+
+Exemplos oficiais atuais:
+
+| Exemplo | Papel na plataforma | Status |
+| --- | --- | --- |
+| `human-resources.funcionarios` | referencia base de entidade humana reutilizavel em formularios, filtros e detalhes por surface | oficial para demonstrar `entityLookup` simples e `inlineEntityLookup` |
+| `procurement.*` | demo enterprise com fornecedor, empresa, contrato, produto e pedido de compra dependentes | oficial como prova corporativa de dependencias e reidratacao |
+
+Novos candidatos, como centros de custo, contratos, projetos ou ativos, devem
+entrar por esse mesmo funil. Se o recurso ainda nao publica `byIds`,
+`selectionPolicy` ou surface de detalhe, ele pode ser documentado como candidato,
+mas nao como exemplo canonico completo.
+
 ## 3. Simples vs range
 
 | Need | Prefer | Avoid |

package/fesm2022/praxisui-dynamic-fields.mjs

@@ -12661,6 +12661,26 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
     hiddenSelectedLookupTokenCount() {
         return Math.max(0, this.selectedLookupViews().length - this.maxVisibleSelectedTokens());
     }
+    trackByOption(index, option) {
+        return this.lookupOptionTrackIdentity(option, index);
+    }
+    trackLookupRichField(index, field) {
+        return [field.key, field.label, field.presentation, field.value]
+            .filter((value) => String(value ?? '').trim().length > 0)
+            .join('|') || String(index);
+    }
+    trackLookupBadge(index, badge) {
+        return `${badge || 'badge'}:${index}`;
+    }
+    trackSelectedLookupToken(index, token) {
+        return token.identity || token.text || String(index);
+    }
+    trackLookupSortOption(index, option) {
+        return option.key || option.label || String(index);
+    }
+    trackLookupFilterChip(index, chip) {
+        return chip.field || `${chip.label}:${chip.valueText}:${index}`;
+    }
     isSelected(option) {
         const value = this.control().value;
         if (Array.isArray(value)) {
@@ -14055,6 +14075,25 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
         const current = Array.isArray(value) ? value : [];
         return current.filter((item) => this.lookupViewFromValue(item).identity !== identity);
     }
+    lookupOptionTrackIdentity(option, index) {
+        const value = option?.value;
+        const record = this.asRecord(value);
+        if (record) {
+            const identity = this.resolveLookupIdentity(record)
+                ?? record['identity']
+                ?? record['value']
+                ?? record['key']
+                ?? record['code'];
+            if (identity !== undefined && identity !== null && String(identity).trim().length > 0) {
+                return String(identity);
+            }
+        }
+        if (this.isPrimitiveLookupValue(value)) {
+            return String(value);
+        }
+        const label = String(option?.label ?? '').trim();
+        return label ? `${label}:${index}` : String(index);
+    }
     recalculateInlineSizeBounds() {
         const viewportWidth = typeof window !== 'undefined' ? window.innerWidth : 1280;
         const isMobile = viewportWidth <= 768;
@@ -14170,7 +14209,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                       (click)="$event.stopPropagation()"
                       >
                       <option value="">{{ sortDefaultOptionText() }}</option>
-                      @for (option of lookupSortOptions(); track option) {
+                      @for (option of lookupSortOptions(); track trackLookupSortOption($index, option)) {
                         <option
                           [value]="option.key"
                           >
@@ -14182,7 +14221,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                 }
                 @if (hasActiveLookupFilters()) {
                   <div class="pdx-panel-filter-chips">
-                    @for (chip of activeLookupFilterChips(); track chip) {
+                    @for (chip of activeLookupFilterChips(); track trackLookupFilterChip($index, chip)) {
                       <button
                         type="button"
                         class="pdx-panel-filter-chip"
@@ -14257,7 +14296,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                 </span>
                 @if (selected.richFields.length) {
                   <span class="pdx-lookup-rich-fields">
-                    @for (field of selected.richFields; track field) {
+                    @for (field of selected.richFields; track trackLookupRichField($index, field)) {
                       <span
                         class="pdx-lookup-rich-field"
                         [class.is-chip]="field.presentation === 'chip' || field.presentation === 'date' || field.presentation === 'currency' || field.presentation === 'metric'"
@@ -14291,7 +14330,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                 @if (showBadges() && visibleBadges(selected).length) {
                   <span class="pdx-lookup-badges">
                     @if (showBadges()) {
-                      @for (badge of visibleBadges(selected); track badge) {
+                      @for (badge of visibleBadges(selected); track trackLookupBadge($index, badge)) {
                         <span class="pdx-lookup-badge is-neutral">
                           {{ badge }}
                         </span>
@@ -14366,7 +14405,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                 </span>
                 @if (selected.richFields.length) {
                   <span class="pdx-lookup-rich-fields is-compact">
-                    @for (field of selected.richFields; track field) {
+                    @for (field of selected.richFields; track trackLookupRichField($index, field)) {
                       <span
                         class="pdx-lookup-rich-field"
                         [class.is-chip]="field.presentation === 'chip' || field.presentation === 'date' || field.presentation === 'currency' || field.presentation === 'metric'"
@@ -14459,7 +14498,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
               }
               @if (multiple() && hasSelection()) {
                 <span class="pdx-chip-token-list">
-                  @for (token of visibleSelectedLookupTokens(); track token) {
+                  @for (token of visibleSelectedLookupTokens(); track trackSelectedLookupToken($index, token)) {
                     <span
                       class="pdx-chip-token"
                       [attr.title]="token.title"
@@ -14566,7 +14605,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                     </span>
                     @if (item.richFields.length) {
                       <span class="pdx-lookup-rich-fields">
-                        @for (field of item.richFields; track field) {
+                        @for (field of item.richFields; track trackLookupRichField($index, field)) {
                           <span
                             class="pdx-lookup-rich-field"
                             [class.is-chip]="field.presentation === 'chip' || field.presentation === 'date' || field.presentation === 'currency' || field.presentation === 'metric'"
@@ -14599,7 +14638,7 @@ class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
                     @if (showBadges() && visibleBadges(item).length) {
                       <span class="pdx-lookup-badges">
                         @if (showBadges()) {
-                          @for (badge of visibleBadges(item); track badge) {
+                          @for (badge of visibleBadges(item); track trackLookupBadge($index, badge)) {
                             <span
                               class="pdx-lookup-badge is-neutral"
                               >
@@ -14766,7 +14805,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                       (click)="$event.stopPropagation()"
                       >
                       <option value="">{{ sortDefaultOptionText() }}</option>
-                      @for (option of lookupSortOptions(); track option) {
+                      @for (option of lookupSortOptions(); track trackLookupSortOption($index, option)) {
                         <option
                           [value]="option.key"
                           >
@@ -14778,7 +14817,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                 }
                 @if (hasActiveLookupFilters()) {
                   <div class="pdx-panel-filter-chips">
-                    @for (chip of activeLookupFilterChips(); track chip) {
+                    @for (chip of activeLookupFilterChips(); track trackLookupFilterChip($index, chip)) {
                       <button
                         type="button"
                         class="pdx-panel-filter-chip"
@@ -14853,7 +14892,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                 </span>
                 @if (selected.richFields.length) {
                   <span class="pdx-lookup-rich-fields">
-                    @for (field of selected.richFields; track field) {
+                    @for (field of selected.richFields; track trackLookupRichField($index, field)) {
                       <span
                         class="pdx-lookup-rich-field"
                         [class.is-chip]="field.presentation === 'chip' || field.presentation === 'date' || field.presentation === 'currency' || field.presentation === 'metric'"
@@ -14887,7 +14926,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                 @if (showBadges() && visibleBadges(selected).length) {
                   <span class="pdx-lookup-badges">
                     @if (showBadges()) {
-                      @for (badge of visibleBadges(selected); track badge) {
+                      @for (badge of visibleBadges(selected); track trackLookupBadge($index, badge)) {
                         <span class="pdx-lookup-badge is-neutral">
                           {{ badge }}
                         </span>
@@ -14962,7 +15001,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                 </span>
                 @if (selected.richFields.length) {
                   <span class="pdx-lookup-rich-fields is-compact">
-                    @for (field of selected.richFields; track field) {
+                    @for (field of selected.richFields; track trackLookupRichField($index, field)) {
                       <span
                         class="pdx-lookup-rich-field"
                         [class.is-chip]="field.presentation === 'chip' || field.presentation === 'date' || field.presentation === 'currency' || field.presentation === 'metric'"
@@ -15055,7 +15094,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
               }
               @if (multiple() && hasSelection()) {
                 <span class="pdx-chip-token-list">
-                  @for (token of visibleSelectedLookupTokens(); track token) {
+                  @for (token of visibleSelectedLookupTokens(); track trackSelectedLookupToken($index, token)) {
                     <span
                       class="pdx-chip-token"
                       [attr.title]="token.title"
@@ -15162,7 +15201,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     </span>
                     @if (item.richFields.length) {
                       <span class="pdx-lookup-rich-fields">
-                        @for (field of item.richFields; track field) {
+                        @for (field of item.richFields; track trackLookupRichField($index, field)) {
                           <span
                             class="pdx-lookup-rich-field"
                             [class.is-chip]="field.presentation === 'chip' || field.presentation === 'date' || field.presentation === 'currency' || field.presentation === 'metric'"
@@ -15195,7 +15234,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     @if (showBadges() && visibleBadges(item).length) {
                       <span class="pdx-lookup-badges">
                         @if (showBadges()) {
-                          @for (badge of visibleBadges(item); track badge) {
+                          @for (badge of visibleBadges(item); track trackLookupBadge($index, badge)) {
                             <span
                               class="pdx-lookup-badge is-neutral"
                               >
@@ -15355,6 +15394,21 @@ class EntityLookupDialogComponent {
     sortOptions() {
         return this.lookup().lookupSortOptions();
     }
+    trackLookupSortOption(index, option) {
+        return this.lookup().trackLookupSortOption(index, option);
+    }
+    trackDialogFilterDefinition(index, definition) {
+        return definition.field || `${definition.label ?? 'filter'}:${index}`;
+    }
+    trackDialogEnumOption(index, option) {
+        return option.value || option.label || String(index);
+    }
+    trackDialogColumn(index, column) {
+        return column.field || `${column.kind ?? 'column'}:${index}`;
+    }
+    trackResultOption(index, option) {
+        return this.optionIdentity(option) || String(index);
+    }
     sortValue() {
         return this.lookup().lookupSortSelectValue();
     }
@@ -15985,7 +16039,7 @@ class EntityLookupDialogComponent {
             <span>{{ sortLabel() }}</span>
             <select [value]="sortValue()" (change)="onSortChange($event)">
               <option value="">{{ sortDefaultLabel() }}</option>
-              @for (option of sortOptions(); track option) {
+              @for (option of sortOptions(); track trackLookupSortOption($index, option)) {
                 <option [value]="option.key">
                   {{ option.label || option.key }}
                 </option>
@@ -16016,7 +16070,7 @@ class EntityLookupDialogComponent {
           data-testid="entity-lookup-dialog-filter-panel"
           >
           <div class="pdx-lookup-dialog-filter-grid">
-            @for (definition of dialogFilterDefinitions(); track definition) {
+            @for (definition of dialogFilterDefinitions(); track trackDialogFilterDefinition($index, definition)) {
               <label
                 class="pdx-lookup-dialog-filter-field"
                 >
@@ -16028,7 +16082,7 @@ class EntityLookupDialogComponent {
                     [formControl]="filterControl(definition.field)"
                     [attr.aria-label]="dialogFilterLabel(definition)"
                     >
-                    @for (option of dialogEnumOptions(definition); track option) {
+                    @for (option of dialogEnumOptions(definition); track trackDialogEnumOption($index, option)) {
                       <option
                         [value]="option.value"
                         >
@@ -16058,7 +16112,7 @@ class EntityLookupDialogComponent {
                     [attr.aria-label]="dialogFilterLabel(definition)"
                     >
                     <option value="">{{ dialogFilterSelectEmptyText(definition) }}</option>
-                    @for (option of dialogEnumOptions(definition); track option) {
+                    @for (option of dialogEnumOptions(definition); track trackDialogEnumOption($index, option)) {
                       <option
                         [value]="option.value"
                         >
@@ -16116,7 +16170,7 @@ class EntityLookupDialogComponent {
             @if (showResultTable()) {
               <div class="pdx-lookup-dialog-table">
                 <div class="pdx-lookup-dialog-table-head">
-                  @for (column of dialogColumns(); track column) {
+                  @for (column of dialogColumns(); track trackDialogColumn($index, column)) {
                     <span
                       class="pdx-lookup-dialog-table-cell is-head"
                       [style.flex]="columnFlex(column)"
@@ -16125,7 +16179,7 @@ class EntityLookupDialogComponent {
                     </span>
                   }
                 </div>
-                @for (option of resultOptions(); track option; let index = $index) {
+                @for (option of resultOptions(); track trackResultOption($index, option); let index = $index) {
                   <button
                     type="button"
                     class="pdx-lookup-dialog-table-row"
@@ -16149,7 +16203,7 @@ class EntityLookupDialogComponent {
                     (dblclick)="apply()"
                     (keydown)="onResultRowKeydown($event, index, option)"
                     >
-                    @for (column of dialogColumns(); track column) {
+                    @for (column of dialogColumns(); track trackDialogColumn($index, column)) {
                       <span
                         class="pdx-lookup-dialog-table-cell"
                         [style.flex]="columnFlex(column)"
@@ -16161,7 +16215,7 @@ class EntityLookupDialogComponent {
                 }
               </div>
             } @else {
-              @for (option of resultOptions(); track option; let index = $index) {
+              @for (option of resultOptions(); track trackResultOption($index, option); let index = $index) {
                 <button
                   type="button"
                   class="pdx-lookup-dialog-row"
@@ -16387,7 +16441,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
             <span>{{ sortLabel() }}</span>
             <select [value]="sortValue()" (change)="onSortChange($event)">
               <option value="">{{ sortDefaultLabel() }}</option>
-              @for (option of sortOptions(); track option) {
+              @for (option of sortOptions(); track trackLookupSortOption($index, option)) {
                 <option [value]="option.key">
                   {{ option.label || option.key }}
                 </option>
@@ -16418,7 +16472,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
           data-testid="entity-lookup-dialog-filter-panel"
           >
           <div class="pdx-lookup-dialog-filter-grid">
-            @for (definition of dialogFilterDefinitions(); track definition) {
+            @for (definition of dialogFilterDefinitions(); track trackDialogFilterDefinition($index, definition)) {
               <label
                 class="pdx-lookup-dialog-filter-field"
                 >
@@ -16430,7 +16484,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     [formControl]="filterControl(definition.field)"
                     [attr.aria-label]="dialogFilterLabel(definition)"
                     >
-                    @for (option of dialogEnumOptions(definition); track option) {
+                    @for (option of dialogEnumOptions(definition); track trackDialogEnumOption($index, option)) {
                       <option
                         [value]="option.value"
                         >
@@ -16460,7 +16514,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     [attr.aria-label]="dialogFilterLabel(definition)"
                     >
                     <option value="">{{ dialogFilterSelectEmptyText(definition) }}</option>
-                    @for (option of dialogEnumOptions(definition); track option) {
+                    @for (option of dialogEnumOptions(definition); track trackDialogEnumOption($index, option)) {
                       <option
                         [value]="option.value"
                         >
@@ -16518,7 +16572,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
             @if (showResultTable()) {
               <div class="pdx-lookup-dialog-table">
                 <div class="pdx-lookup-dialog-table-head">
-                  @for (column of dialogColumns(); track column) {
+                  @for (column of dialogColumns(); track trackDialogColumn($index, column)) {
                     <span
                       class="pdx-lookup-dialog-table-cell is-head"
                       [style.flex]="columnFlex(column)"
@@ -16527,7 +16581,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     </span>
                   }
                 </div>
-                @for (option of resultOptions(); track option; let index = $index) {
+                @for (option of resultOptions(); track trackResultOption($index, option); let index = $index) {
                   <button
                     type="button"
                     class="pdx-lookup-dialog-table-row"
@@ -16551,7 +16605,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     (dblclick)="apply()"
                     (keydown)="onResultRowKeydown($event, index, option)"
                     >
-                    @for (column of dialogColumns(); track column) {
+                    @for (column of dialogColumns(); track trackDialogColumn($index, column)) {
                       <span
                         class="pdx-lookup-dialog-table-cell"
                         [style.flex]="columnFlex(column)"
@@ -16563,7 +16617,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                 }
               </div>
             } @else {
-              @for (option of resultOptions(); track option; let index = $index) {
+              @for (option of resultOptions(); track trackResultOption($index, option); let index = $index) {
                 <button
                   type="button"
                   class="pdx-lookup-dialog-row"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@praxisui/dynamic-fields",
-  "version": "8.0.0-beta.92",
+  "version": "8.0.0-beta.94",
   "description": "Angular Material-based dynamic form fields for Praxis UI with lazy loading and metadata-driven rendering.",
   "peerDependencies": {
     "@angular/common": "^21.0.0",
@@ -11,8 +11,8 @@
     "@angular/platform-browser": "^21.0.0",
     "@angular/router": "^21.0.0",
     "rxjs": "^7.8.0",
-    "@praxisui/core": "^8.0.0-beta.92",
-    "@praxisui/cron-builder": "^8.0.0-beta.92"
+    "@praxisui/core": "^8.0.0-beta.94",
+    "@praxisui/cron-builder": "^8.0.0-beta.94"
   },
   "dependencies": {
     "libphonenumber-js": "^1.12.41",

package/types/praxisui-dynamic-fields.d.ts

@@ -2781,6 +2781,15 @@ declare class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
     selectedLookupViews(): EntityLookupViewModel[];
     visibleSelectedLookupTokens(): SelectedLookupTokenViewModel[];
     hiddenSelectedLookupTokenCount(): number;
+    trackByOption(index: number, option: LookupOption): string;
+    trackLookupRichField(index: number, field: EntityLookupRichFieldViewModel): string;
+    trackLookupBadge(index: number, badge: string): string;
+    trackSelectedLookupToken(index: number, token: SelectedLookupTokenViewModel): string;
+    trackLookupSortOption(index: number, option: {
+        key?: string;
+        label?: string;
+    }): string;
+    trackLookupFilterChip(index: number, chip: LookupFilterChipViewModel): string;
     isSelected(option: LookupOption): boolean;
     showSelectedTokenRemove(): boolean;
     selectedTokenRemoveAriaLabel(text: string): string;
@@ -2950,6 +2959,7 @@ declare class InlineEntityLookupComponent extends MaterialAsyncSelectComponent {
     private humanizeFieldName;
     private maxVisibleSelectedTokens;
     private removeSelectionByIdentity;
+    private lookupOptionTrackIdentity;
     private recalculateInlineSizeBounds;
     private resolveWidthBounds;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<InlineEntityLookupComponent, never>;
@@ -2980,6 +2990,17 @@ declare class EntityLookupDialogComponent implements AfterViewInit {
     dialogPreviewAriaLabel(): string;
     showSortControl(): boolean;
     sortOptions(): _praxisui_core.LookupSortOptionMetadata[];
+    trackLookupSortOption(index: number, option: {
+        key?: string;
+        label?: string;
+    }): string;
+    trackDialogFilterDefinition(index: number, definition: LookupFilterDefinitionMetadata): string;
+    trackDialogEnumOption(index: number, option: {
+        value?: string;
+        label?: string;
+    }): string;
+    trackDialogColumn(index: number, column: LookupResultColumnMetadata): string;
+    trackResultOption(index: number, option: LookupOption): string;
     sortValue(): string;
     onSortChange(event: Event): void;
     sortLabel(): string;