@noatgnu/cupcake-vanilla 1.2.7 → 1.2.9

package/fesm2022/noatgnu-cupcake-vanilla.mjs

@@ -1526,10 +1526,63 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
 class OntologySearchService extends BaseApiService {
     /**
      * Get ontology suggestions across all sources for SDRF validation
+     *
+     * @param params Query parameters
+     * @param params.q Search query (required, min 2 characters)
+     * @param params.type Ontology type to search (optional)
+     * @param params.match Match type - 'contains' or 'startswith' (default: 'contains')
+     * @param params.limit Maximum number of results (default: 50)
+     * @param params.customFilters Custom filters to apply (optional)
+     *   Example: {"organism": "Homo sapiens"} or {"organism": {"icontains": "human"}}
      */
     suggest(params) {
-        const httpParams = this.buildHttpParams(params);
-        return this.get(`${this.apiUrl}/ontology-search/suggest/`, { params: httpParams });
+        const queryParams = {
+            q: params.q,
+        };
+        if (params.type) {
+            queryParams.type = params.type;
+        }
+        if (params.match) {
+            queryParams.match = params.match;
+        }
+        if (params.limit) {
+            queryParams.limit = params.limit;
+        }
+        if (params.customFilters) {
+            queryParams.custom_filters = JSON.stringify(params.customFilters);
+        }
+        const httpParams = this.buildHttpParams(queryParams);
+        return this.get(`${this.apiUrl}/ontology/search/suggest/`, { params: httpParams });
+    }
+    /**
+     * Get ontology suggestions for a specific ontology type with custom filters
+     */
+    suggestWithFilters(query, ontologyType, customFilters, limit = 50) {
+        return this.suggest({
+            q: query,
+            type: ontologyType,
+            customFilters,
+            limit
+        });
+    }
+    /**
+     * Search across multiple ontology types
+     */
+    searchAll(query, limit = 50) {
+        return this.suggest({
+            q: query,
+            limit
+        });
+    }
+    /**
+     * Search specific ontology type
+     */
+    searchType(query, ontologyType, limit = 50) {
+        return this.suggest({
+            q: query,
+            type: ontologyType,
+            limit
+        });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: OntologySearchService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: OntologySearchService, providedIn: 'root' });
@@ -3207,6 +3260,7 @@ class MetadataValueEditModal {
     metadataColumnService;
     metadataColumnTemplateService;
     labGroupService;
+    ontologySearchService;
     config;
     valueSaved = new EventEmitter();
     editForm;
@@ -3227,7 +3281,7 @@ class MetadataValueEditModal {
     specialInputValue = signal('', ...(ngDevMode ? [{ debugName: "specialInputValue" }] : []));
     selectedSampleIndices = signal(new Set(), ...(ngDevMode ? [{ debugName: "selectedSampleIndices" }] : []));
     showSamplePanel = signal(false, ...(ngDevMode ? [{ debugName: "showSamplePanel" }] : []));
-    constructor(fb, activeModal, authService, favouriteMetadataOptionService, metadataColumnService, metadataColumnTemplateService, labGroupService) {
+    constructor(fb, activeModal, authService, favouriteMetadataOptionService, metadataColumnService, metadataColumnTemplateService, labGroupService, ontologySearchService) {
         this.fb = fb;
         this.activeModal = activeModal;
         this.authService = authService;
@@ -3235,6 +3289,7 @@ class MetadataValueEditModal {
         this.metadataColumnService = metadataColumnService;
         this.metadataColumnTemplateService = metadataColumnTemplateService;
         this.labGroupService = labGroupService;
+        this.ontologySearchService = ontologySearchService;
         this.editForm = this.fb.group({
             value: ['', [Validators.maxLength(500)]]
         });
@@ -3319,6 +3374,19 @@ class MetadataValueEditModal {
                     return of([]);
                 }), tap$1(() => this.isLoadingSuggestions.set(false)));
             }
+            else if (this.config.ontologyType) {
+                // Fallback: use OntologySearchService directly with custom filters
+                return this.ontologySearchService.suggest({
+                    q: term,
+                    type: this.config.ontologyType,
+                    match: this.searchType() === 'icontains' ? 'contains' : 'startswith',
+                    customFilters: this.config.customOntologyFilters,
+                    limit: 10
+                }).pipe(map$1(response => response.suggestions || []), catchError(error => {
+                    console.error('Error getting ontology suggestions:', error);
+                    return of([]);
+                }), tap$1(() => this.isLoadingSuggestions.set(false)));
+            }
             else {
                 this.isLoadingSuggestions.set(false);
                 return of([]);
@@ -3647,7 +3715,7 @@ class MetadataValueEditModal {
             }
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MetadataValueEditModal, deps: [{ token: i1.FormBuilder }, { token: i2.NgbActiveModal }, { token: i3.AuthService }, { token: FavouriteMetadataOptionService }, { token: MetadataColumnService }, { token: MetadataColumnTemplateService }, { token: i3.LabGroupService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MetadataValueEditModal, deps: [{ token: i1.FormBuilder }, { token: i2.NgbActiveModal }, { token: i3.AuthService }, { token: FavouriteMetadataOptionService }, { token: MetadataColumnService }, { token: MetadataColumnTemplateService }, { token: i3.LabGroupService }, { token: OntologySearchService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: MetadataValueEditModal, isStandalone: true, selector: "ccv-metadata-value-edit-modal", inputs: { config: "config" }, outputs: { valueSaved: "valueSaved" }, ngImport: i0, template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-pencil-square me-2\"></i>{{ title }}\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"onCancel()\"></button>\n</div>\n\n<div class=\"modal-body\">\n  <div class=\"row\">\n    <!-- Main Content -->\n    <div [class]=\"hasMultiSampleEdit ? 'col-md-8' : 'col-12'\">\n      <form [formGroup]=\"editForm\" (ngSubmit)=\"onSubmit()\">\n\n    <!-- Column Information -->\n    <div class=\"mb-3\">\n      <div class=\"row\">\n        <div class=\"col-md-6\">\n          <small class=\"text-muted\">Column Name:</small>\n          <div class=\"fw-semibold\">{{ config.columnName }}</div>\n        </div>\n        <div class=\"col-md-6\">\n          <small class=\"text-muted\">Column Type:</small>\n          <div><span class=\"badge bg-light text-dark\">{{ config.columnType }}</span></div>\n        </div>\n      </div>\n      @if (hasOntologyType) {\n        <div class=\"mt-2\">\n          <small class=\"text-muted\">Ontology Type:</small>\n          <div><span class=\"badge bg-info\">{{ ontologyTypeLabel }}</span></div>\n        </div>\n      }\n    </div>\n\n    <hr class=\"mb-4\">\n\n    <!-- Favorite Options Section -->\n    @if (hasFavorites && !isLoadingFavorites()) {\n      <div class=\"mb-4\">\n        <h6 class=\"text-muted mb-3\">\n          <i class=\"bi bi-heart-fill me-2 text-danger\"></i>Recommended Values\n        </h6>\n\n        <!-- Favorites Navigation Tabs -->\n        <ul ngbNav #favoritesNav=\"ngbNav\" [(activeId)]=\"activeFavoritesTab\" class=\"nav-tabs\">\n          @if (userFavorites().length > 0) {\n            <li [ngbNavItem]=\"'user'\">\n              <button ngbNavLink>\n                <i class=\"bi bi-person-fill me-1\"></i>Your Favorites\n                <span class=\"badge bg-primary ms-1\">{{ userFavorites().length }}</span>\n              </button>\n              <ng-template ngbNavContent>\n                <div class=\"mt-3\">\n                  <select \n                    class=\"form-select\" \n                    size=\"5\" \n                    (change)=\"onFavoriteSelected($event, userFavorites())\">\n                    <option value=\"\">Select a favorite value...</option>\n                    @for (favorite of userFavorites(); track favorite.id) {\n                      <option [value]=\"favorite.id\">\n                        {{ getFavoriteDisplayValue(favorite) }}\n                        @if (hasCustomDisplayValue(favorite)) { (Custom Display) }\n                      </option>\n                    }\n                  </select>\n                  <div class=\"form-text\">\n                    <i class=\"bi bi-info-circle me-1\"></i>Your personal favorite values for this column\n                  </div>\n                </div>\n              </ng-template>\n            </li>\n          }\n\n          @if (labGroupFavorites().length > 0) {\n            <li [ngbNavItem]=\"'lab_group'\">\n              <button ngbNavLink>\n                <i class=\"bi bi-people-fill me-1\"></i>Lab Group\n                <span class=\"badge bg-info ms-1\">{{ labGroupFavorites().length }}</span>\n              </button>\n              <ng-template ngbNavContent>\n                <div class=\"mt-3\">\n                  <select \n                    class=\"form-select\" \n                    size=\"5\" \n                    (change)=\"onFavoriteSelected($event, labGroupFavorites())\">\n                    <option value=\"\">Select a favorite value...</option>\n                    @for (favorite of labGroupFavorites(); track favorite.id) {\n                      <option [value]=\"favorite.id\">\n                        {{ getFavoriteDisplayValue(favorite) }}\n                        @if (hasCustomDisplayValue(favorite)) { (Custom Display) }\n                      </option>\n                    }\n                  </select>\n                  <div class=\"form-text\">\n                    <i class=\"bi bi-info-circle me-1\"></i>Favorite values shared by your lab group\n                  </div>\n                </div>\n              </ng-template>\n            </li>\n          }\n\n          @if (globalFavorites().length > 0) {\n            <li [ngbNavItem]=\"'global'\">\n              <button ngbNavLink>\n                <i class=\"bi bi-globe me-1\"></i>Global\n                <span class=\"badge bg-success ms-1\">{{ globalFavorites().length }}</span>\n              </button>\n              <ng-template ngbNavContent>\n                <div class=\"mt-3\">\n                  <select \n                    class=\"form-select\" \n                    size=\"5\" \n                    (change)=\"onFavoriteSelected($event, globalFavorites())\">\n                    <option value=\"\">Select a favorite value...</option>\n                    @for (favorite of globalFavorites(); track favorite.id) {\n                      <option [value]=\"favorite.id\">\n                        {{ getFavoriteDisplayValue(favorite) }}\n                        @if (hasCustomDisplayValue(favorite)) { (Custom Display) }\n                      </option>\n                    }\n                  </select>\n                  <div class=\"form-text\">\n                    <i class=\"bi bi-info-circle me-1\"></i>Globally recommended values for this column\n                  </div>\n                </div>\n              </ng-template>\n            </li>\n          }\n        </ul>\n\n        <div [ngbNavOutlet]=\"favoritesNav\" class=\"mt-3\"></div>\n\n        <hr class=\"my-3\">\n      </div>\n    }\n\n    @if (isLoadingFavorites()) {\n      <div class=\"text-center mb-4\">\n        <div class=\"spinner-border spinner-border-sm text-primary me-2\"></div>\n        <small class=\"text-muted\">Loading favorite options...</small>\n      </div>\n      <hr class=\"my-3\">\n    }\n\n    <!-- Value Input Section -->\n    <div class=\"mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <label for=\"metadataValue\" class=\"form-label mb-0\">\n          Metadata Value\n          @if (hasOntologyType) {\n            <span class=\"badge bg-success ms-2\">\n              <i class=\"bi bi-search me-1\"></i>Autocomplete Available\n            </span>\n          }\n          @if (specialSyntaxType()) {\n            <span class=\"badge bg-info ms-2\">\n              <i class=\"bi bi-gear me-1\"></i>{{ getSpecialInputTitle() }}\n            </span>\n          }\n        </label>\n\n        @if (specialSyntaxType()) {\n          <div class=\"form-check form-switch\">\n            <input\n              class=\"form-check-input\"\n              type=\"checkbox\"\n              id=\"specialInputToggle\"\n              [checked]=\"showSpecialInput()\"\n              (change)=\"toggleSpecialInput()\">\n            <label class=\"form-check-label small text-muted\" for=\"specialInputToggle\">\n              Enhanced Editor\n            </label>\n          </div>\n        }\n      </div>\n\n      <!-- Special SDRF Syntax Input Components -->\n      @if (showSpecialInput() && specialSyntaxType()) {\n        <div class=\"border rounded p-3 mb-3 bg-body-secondary\">\n          <div class=\"mb-2\">\n            <small class=\"text-muted fw-semibold\">\n              <i class=\"bi bi-gear me-1\"></i>{{ getSpecialInputTitle() }}\n            </small>\n          </div>\n\n          @switch (specialSyntaxType()) {\n            @case ('age') {\n              <ccv-sdrf-age-input\n                [value]=\"specialInputValue()\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-age-input>\n            }\n            @case ('modification') {\n              <ccv-sdrf-modification-input\n                [value]=\"specialInputValue()\"\n                [columnId]=\"config.columnId ?? null\"\n                [templateId]=\"config.templateId ?? null\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-modification-input>\n            }\n            @case ('cleavage') {\n              <ccv-sdrf-cleavage-input\n                [value]=\"specialInputValue()\"\n                [columnId]=\"config.columnId ?? null\"\n                [templateId]=\"config.templateId ?? null\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-cleavage-input>\n            }\n            @case ('spiked_compound') {\n              <ccv-sdrf-spiked-compound-input\n                [value]=\"specialInputValue()\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-spiked-compound-input>\n            }\n          }\n\n          <div class=\"form-text mt-2\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Use the enhanced editor for structured input, or toggle off for manual text entry.\n          </div>\n        </div>\n      }\n\n      @if (hasOntologyType && !showSpecialInput()) {\n        <!-- Search type selection for ontology -->\n        <div class=\"mb-2\">\n          <small class=\"text-muted d-block mb-1\">Search Mode:</small>\n          <div class=\"btn-group btn-group-sm\" role=\"group\">\n            <button\n              type=\"button\"\n              class=\"btn\"\n              [class]=\"searchType() === 'icontains' ? 'btn-primary' : 'btn-outline-primary'\"\n              (click)=\"onSearchTypeChange('icontains')\">\n              <i class=\"bi bi-search me-1\"></i>Contains\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn\"\n              [class]=\"searchType() === 'istartswith' ? 'btn-primary' : 'btn-outline-primary'\"\n              (click)=\"onSearchTypeChange('istartswith')\">\n              <i class=\"bi bi-arrow-right me-1\"></i>Starts with\n            </button>\n          </div>\n        </div>\n\n        <!-- Typeahead input for ontology suggestions -->\n        <div class=\"input-group\">\n          <input\n            type=\"text\"\n            class=\"form-control\"\n            [class.border-success]=\"selectedFavorite() !== null\"\n            id=\"metadataValue\"\n            formControlName=\"value\"\n            placeholder=\"Type to search ontology suggestions...\"\n            [ngbTypeahead]=\"searchOntology\"\n            [resultFormatter]=\"formatSuggestion\"\n            [inputFormatter]=\"inputFormatter\"\n            (selectItem)=\"onSuggestionSelected($event)\"\n            [editable]=\"true\"\n            [showHint]=\"true\"\n            [focusFirst]=\"false\"\n            container=\"body\">\n          @if (isLoadingSuggestions()) {\n            <span class=\"input-group-text\">\n              <div class=\"spinner-border spinner-border-sm\" role=\"status\">\n                <span class=\"visually-hidden\">Loading...</span>\n              </div>\n            </span>\n          } @else {\n            <span class=\"input-group-text\">\n              <i class=\"bi bi-search text-muted\"></i>\n            </span>\n          }\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"clearValue()\"\n            title=\"Clear value\">\n            <i class=\"bi bi-x\"></i>\n          </button>\n        </div>\n        <div class=\"form-text\">\n          <i class=\"bi bi-info-circle me-1\"></i>\n          Search {{ searchType() === 'icontains' ? 'contains' : 'starts with' }} for {{ ontologyTypeLabel }} ontology\n        </div>\n      } @else if (!showSpecialInput()) {\n        <!-- Regular input when no ontology type or special input is disabled -->\n        <div class=\"input-group\">\n          <input\n            type=\"text\"\n            class=\"form-control\"\n            [class.border-success]=\"selectedFavorite() !== null\"\n            id=\"metadataValue\"\n            formControlName=\"value\"\n            placeholder=\"Enter metadata value\">\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"clearValue()\"\n            title=\"Clear value\">\n            <i class=\"bi bi-x\"></i>\n          </button>\n        </div>\n        <div class=\"form-text text-muted\">\n          @if (specialSyntaxType()) {\n            Manual text entry mode. Use the Enhanced Editor toggle for structured {{ specialSyntaxType() }} input.\n          } @else {\n            Enter the value manually (no ontology suggestions available for this column type)\n          }\n        </div>\n      }\n    </div>\n\n    <!-- Character count and value info -->\n    <div class=\"mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center\">\n        <small class=\"text-muted\">\n          Characters: {{ editForm.get('value')?.value?.length || 0 }}/500\n        </small>\n        @if (getSelectedFavoriteInfo()) {\n          <small class=\"text-info\">\n            <i class=\"bi bi-info-circle me-1\"></i>{{ getSelectedFavoriteInfo() }}\n          </small>\n        }\n      </div>\n    </div>\n\n      </form>\n    </div>\n\n    <!-- Sample Selection Panel -->\n    @if (hasMultiSampleEdit) {\n      <div class=\"col-md-4\">\n        <div class=\"border-start ps-3\">\n          <div class=\"d-flex justify-content-between align-items-center mb-3\">\n            <h6 class=\"mb-0 text-muted\">\n              <i class=\"bi bi-list-check me-1\"></i>Apply to Samples\n            </h6>\n            <span class=\"badge bg-primary\">\n              {{ selectedSampleCount }}/{{ totalSampleCount }}\n            </span>\n          </div>\n\n          <!-- Select All/Clear All Controls -->\n          <div class=\"d-flex gap-1 mb-3\">\n            <button \n              type=\"button\" \n              class=\"btn btn-outline-primary btn-sm flex-fill\"\n              (click)=\"selectAllSamples()\"\n              [disabled]=\"selectedSampleCount === totalSampleCount\">\n              <i class=\"bi bi-check-all me-1\"></i>All\n            </button>\n            <button \n              type=\"button\" \n              class=\"btn btn-outline-secondary btn-sm flex-fill\"\n              (click)=\"clearSampleSelection()\"\n              [disabled]=\"selectedSampleCount === 0\">\n              <i class=\"bi bi-x me-1\"></i>Clear\n            </button>\n          </div>\n\n          <!-- Sample List -->\n          <div class=\"sample-list\" style=\"max-height: 400px; overflow-y: auto;\">\n            @for (sample of sampleData; track sample.index) {\n              <div class=\"form-check d-flex align-items-center mb-2 p-2 rounded border-bottom\">\n                <input \n                  class=\"form-check-input me-2\" \n                  type=\"checkbox\" \n                  [id]=\"'sample-' + sample.index\"\n                  [checked]=\"isSampleSelected(sample.index)\"\n                  (change)=\"toggleSampleSelection(sample.index)\">\n                <label \n                  [for]=\"'sample-' + sample.index\" \n                  class=\"form-check-label flex-grow-1 cursor-pointer\">\n                  <div class=\"d-flex justify-content-between align-items-center\">\n                    <div>\n                      <div class=\"fw-semibold\">Sample {{ sample.index }}</div>\n                      @if (sample.sourceName) {\n                        <small class=\"text-muted\">{{ sample.sourceName }}</small>\n                      }\n                    </div>\n                    <div class=\"text-end\">\n                      <small class=\"text-muted\">Current:</small>\n                      <div class=\"small fw-mono\" [title]=\"sample.value || ''\">\n                        {{ (sample.value && sample.value.length > 15) ? (sample.value | slice:0:15) + '...' : (sample.value || '-') }}\n                      </div>\n                    </div>\n                  </div>\n                </label>\n              </div>\n            }\n          </div>\n\n          @if (selectedSampleCount > 0) {\n            <div class=\"alert alert-info mt-3 p-2\">\n              <small>\n                <i class=\"bi bi-info-circle me-1\"></i>\n                The value will be applied to {{ selectedSampleCount }} selected sample{{ selectedSampleCount !== 1 ? 's' : '' }}.\n              </small>\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n<div class=\"modal-footer\">\n  <div class=\"me-auto\">\n    @if (editForm.get('value')?.value && !isLoading() && !isFromFavoriteManagement) {\n      <div class=\"btn-group dropup\" ngbDropdown>\n        <button\n          type=\"button\"\n          class=\"btn btn-outline-warning btn-sm dropdown-toggle\"\n          ngbDropdownToggle>\n          <i class=\"bi bi-heart me-1\"></i>Add to Favorites\n        </button>\n        <div class=\"dropdown-menu\" ngbDropdownMenu>\n          <button\n            type=\"button\"\n            class=\"dropdown-item\"\n            (click)=\"addToFavorites('user')\">\n            <i class=\"bi bi-person me-2\"></i>Personal Favorite\n          </button>\n          <button\n            type=\"button\"\n            class=\"dropdown-item\"\n            (click)=\"addToFavorites('lab_group')\">\n            <i class=\"bi bi-people me-2\"></i>Lab Group Favorite\n          </button>\n          <button\n            type=\"button\"\n            class=\"dropdown-item\"\n            (click)=\"addToFavorites('global')\">\n            <i class=\"bi bi-globe me-2\"></i>Global Recommendation\n          </button>\n        </div>\n      </div>\n    }\n  </div>\n\n  <div class=\"d-flex gap-2\">\n    <button type=\"button\" class=\"btn btn-outline-secondary\" (click)=\"onCancel()\">\n      <i class=\"bi bi-x-circle me-1\"></i>Cancel\n    </button>\n    <button\n      type=\"button\"\n      class=\"btn btn-primary\"\n      (click)=\"onSubmit()\"\n      [disabled]=\"editForm.invalid || isLoading()\">\n      @if (isLoading()) {\n        <span class=\"spinner-border spinner-border-sm me-2\"></span>\n      }\n      <i class=\"bi bi-check-circle me-1\"></i>\n      Save Value\n    </button>\n  </div>\n</div>\n", styles: [".sample-list .form-check{border:1px solid transparent;transition:all .2s ease}.sample-list .form-check:hover{background-color:rgba(var(--bs-primary-rgb),.05);border-color:rgba(var(--bs-primary-rgb),.2)}.sample-list .form-check .form-check-input:checked~.form-check-label .fw-semibold{color:var(--bs-primary)}.cursor-pointer{cursor:pointer}.fw-mono{font-family:var(--bs-font-monospace)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: NgbModule }, { kind: "directive", type: i2.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i2.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i2.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i2.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2.NgbNavLinkButton, selector: "button[ngbNavLink]" }, { kind: "directive", type: i2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i2.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "container", "editable", "focusFirst", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate", "selectOnExact", "showHint", "placement", "popperOptions", "popupClass"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { kind: "ngmodule", type: NgbNavModule }, { kind: "component", type: SdrfAgeInput, selector: "ccv-sdrf-age-input", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: SdrfModificationInput, selector: "ccv-sdrf-modification-input", inputs: ["value", "templateId", "columnId"], outputs: ["valueChange"] }, { kind: "component", type: SdrfCleavageInput, selector: "ccv-sdrf-cleavage-input", inputs: ["value", "templateId", "columnId"], outputs: ["valueChange"] }, { kind: "component", type: SdrfSpikedCompoundInput, selector: "ccv-sdrf-spiked-compound-input", inputs: ["value"], outputs: ["valueChange"] }, { kind: "pipe", type: i5.SlicePipe, name: "slice" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MetadataValueEditModal, decorators: [{
@@ -3662,7 +3730,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
                         SdrfCleavageInput,
                         SdrfSpikedCompoundInput
                     ], template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-pencil-square me-2\"></i>{{ title }}\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"onCancel()\"></button>\n</div>\n\n<div class=\"modal-body\">\n  <div class=\"row\">\n    <!-- Main Content -->\n    <div [class]=\"hasMultiSampleEdit ? 'col-md-8' : 'col-12'\">\n      <form [formGroup]=\"editForm\" (ngSubmit)=\"onSubmit()\">\n\n    <!-- Column Information -->\n    <div class=\"mb-3\">\n      <div class=\"row\">\n        <div class=\"col-md-6\">\n          <small class=\"text-muted\">Column Name:</small>\n          <div class=\"fw-semibold\">{{ config.columnName }}</div>\n        </div>\n        <div class=\"col-md-6\">\n          <small class=\"text-muted\">Column Type:</small>\n          <div><span class=\"badge bg-light text-dark\">{{ config.columnType }}</span></div>\n        </div>\n      </div>\n      @if (hasOntologyType) {\n        <div class=\"mt-2\">\n          <small class=\"text-muted\">Ontology Type:</small>\n          <div><span class=\"badge bg-info\">{{ ontologyTypeLabel }}</span></div>\n        </div>\n      }\n    </div>\n\n    <hr class=\"mb-4\">\n\n    <!-- Favorite Options Section -->\n    @if (hasFavorites && !isLoadingFavorites()) {\n      <div class=\"mb-4\">\n        <h6 class=\"text-muted mb-3\">\n          <i class=\"bi bi-heart-fill me-2 text-danger\"></i>Recommended Values\n        </h6>\n\n        <!-- Favorites Navigation Tabs -->\n        <ul ngbNav #favoritesNav=\"ngbNav\" [(activeId)]=\"activeFavoritesTab\" class=\"nav-tabs\">\n          @if (userFavorites().length > 0) {\n            <li [ngbNavItem]=\"'user'\">\n              <button ngbNavLink>\n                <i class=\"bi bi-person-fill me-1\"></i>Your Favorites\n                <span class=\"badge bg-primary ms-1\">{{ userFavorites().length }}</span>\n              </button>\n              <ng-template ngbNavContent>\n                <div class=\"mt-3\">\n                  <select \n                    class=\"form-select\" \n                    size=\"5\" \n                    (change)=\"onFavoriteSelected($event, userFavorites())\">\n                    <option value=\"\">Select a favorite value...</option>\n                    @for (favorite of userFavorites(); track favorite.id) {\n                      <option [value]=\"favorite.id\">\n                        {{ getFavoriteDisplayValue(favorite) }}\n                        @if (hasCustomDisplayValue(favorite)) { (Custom Display) }\n                      </option>\n                    }\n                  </select>\n                  <div class=\"form-text\">\n                    <i class=\"bi bi-info-circle me-1\"></i>Your personal favorite values for this column\n                  </div>\n                </div>\n              </ng-template>\n            </li>\n          }\n\n          @if (labGroupFavorites().length > 0) {\n            <li [ngbNavItem]=\"'lab_group'\">\n              <button ngbNavLink>\n                <i class=\"bi bi-people-fill me-1\"></i>Lab Group\n                <span class=\"badge bg-info ms-1\">{{ labGroupFavorites().length }}</span>\n              </button>\n              <ng-template ngbNavContent>\n                <div class=\"mt-3\">\n                  <select \n                    class=\"form-select\" \n                    size=\"5\" \n                    (change)=\"onFavoriteSelected($event, labGroupFavorites())\">\n                    <option value=\"\">Select a favorite value...</option>\n                    @for (favorite of labGroupFavorites(); track favorite.id) {\n                      <option [value]=\"favorite.id\">\n                        {{ getFavoriteDisplayValue(favorite) }}\n                        @if (hasCustomDisplayValue(favorite)) { (Custom Display) }\n                      </option>\n                    }\n                  </select>\n                  <div class=\"form-text\">\n                    <i class=\"bi bi-info-circle me-1\"></i>Favorite values shared by your lab group\n                  </div>\n                </div>\n              </ng-template>\n            </li>\n          }\n\n          @if (globalFavorites().length > 0) {\n            <li [ngbNavItem]=\"'global'\">\n              <button ngbNavLink>\n                <i class=\"bi bi-globe me-1\"></i>Global\n                <span class=\"badge bg-success ms-1\">{{ globalFavorites().length }}</span>\n              </button>\n              <ng-template ngbNavContent>\n                <div class=\"mt-3\">\n                  <select \n                    class=\"form-select\" \n                    size=\"5\" \n                    (change)=\"onFavoriteSelected($event, globalFavorites())\">\n                    <option value=\"\">Select a favorite value...</option>\n                    @for (favorite of globalFavorites(); track favorite.id) {\n                      <option [value]=\"favorite.id\">\n                        {{ getFavoriteDisplayValue(favorite) }}\n                        @if (hasCustomDisplayValue(favorite)) { (Custom Display) }\n                      </option>\n                    }\n                  </select>\n                  <div class=\"form-text\">\n                    <i class=\"bi bi-info-circle me-1\"></i>Globally recommended values for this column\n                  </div>\n                </div>\n              </ng-template>\n            </li>\n          }\n        </ul>\n\n        <div [ngbNavOutlet]=\"favoritesNav\" class=\"mt-3\"></div>\n\n        <hr class=\"my-3\">\n      </div>\n    }\n\n    @if (isLoadingFavorites()) {\n      <div class=\"text-center mb-4\">\n        <div class=\"spinner-border spinner-border-sm text-primary me-2\"></div>\n        <small class=\"text-muted\">Loading favorite options...</small>\n      </div>\n      <hr class=\"my-3\">\n    }\n\n    <!-- Value Input Section -->\n    <div class=\"mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <label for=\"metadataValue\" class=\"form-label mb-0\">\n          Metadata Value\n          @if (hasOntologyType) {\n            <span class=\"badge bg-success ms-2\">\n              <i class=\"bi bi-search me-1\"></i>Autocomplete Available\n            </span>\n          }\n          @if (specialSyntaxType()) {\n            <span class=\"badge bg-info ms-2\">\n              <i class=\"bi bi-gear me-1\"></i>{{ getSpecialInputTitle() }}\n            </span>\n          }\n        </label>\n\n        @if (specialSyntaxType()) {\n          <div class=\"form-check form-switch\">\n            <input\n              class=\"form-check-input\"\n              type=\"checkbox\"\n              id=\"specialInputToggle\"\n              [checked]=\"showSpecialInput()\"\n              (change)=\"toggleSpecialInput()\">\n            <label class=\"form-check-label small text-muted\" for=\"specialInputToggle\">\n              Enhanced Editor\n            </label>\n          </div>\n        }\n      </div>\n\n      <!-- Special SDRF Syntax Input Components -->\n      @if (showSpecialInput() && specialSyntaxType()) {\n        <div class=\"border rounded p-3 mb-3 bg-body-secondary\">\n          <div class=\"mb-2\">\n            <small class=\"text-muted fw-semibold\">\n              <i class=\"bi bi-gear me-1\"></i>{{ getSpecialInputTitle() }}\n            </small>\n          </div>\n\n          @switch (specialSyntaxType()) {\n            @case ('age') {\n              <ccv-sdrf-age-input\n                [value]=\"specialInputValue()\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-age-input>\n            }\n            @case ('modification') {\n              <ccv-sdrf-modification-input\n                [value]=\"specialInputValue()\"\n                [columnId]=\"config.columnId ?? null\"\n                [templateId]=\"config.templateId ?? null\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-modification-input>\n            }\n            @case ('cleavage') {\n              <ccv-sdrf-cleavage-input\n                [value]=\"specialInputValue()\"\n                [columnId]=\"config.columnId ?? null\"\n                [templateId]=\"config.templateId ?? null\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-cleavage-input>\n            }\n            @case ('spiked_compound') {\n              <ccv-sdrf-spiked-compound-input\n                [value]=\"specialInputValue()\"\n                (valueChange)=\"onSpecialInputChange($event)\">\n              </ccv-sdrf-spiked-compound-input>\n            }\n          }\n\n          <div class=\"form-text mt-2\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Use the enhanced editor for structured input, or toggle off for manual text entry.\n          </div>\n        </div>\n      }\n\n      @if (hasOntologyType && !showSpecialInput()) {\n        <!-- Search type selection for ontology -->\n        <div class=\"mb-2\">\n          <small class=\"text-muted d-block mb-1\">Search Mode:</small>\n          <div class=\"btn-group btn-group-sm\" role=\"group\">\n            <button\n              type=\"button\"\n              class=\"btn\"\n              [class]=\"searchType() === 'icontains' ? 'btn-primary' : 'btn-outline-primary'\"\n              (click)=\"onSearchTypeChange('icontains')\">\n              <i class=\"bi bi-search me-1\"></i>Contains\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn\"\n              [class]=\"searchType() === 'istartswith' ? 'btn-primary' : 'btn-outline-primary'\"\n              (click)=\"onSearchTypeChange('istartswith')\">\n              <i class=\"bi bi-arrow-right me-1\"></i>Starts with\n            </button>\n          </div>\n        </div>\n\n        <!-- Typeahead input for ontology suggestions -->\n        <div class=\"input-group\">\n          <input\n            type=\"text\"\n            class=\"form-control\"\n            [class.border-success]=\"selectedFavorite() !== null\"\n            id=\"metadataValue\"\n            formControlName=\"value\"\n            placeholder=\"Type to search ontology suggestions...\"\n            [ngbTypeahead]=\"searchOntology\"\n            [resultFormatter]=\"formatSuggestion\"\n            [inputFormatter]=\"inputFormatter\"\n            (selectItem)=\"onSuggestionSelected($event)\"\n            [editable]=\"true\"\n            [showHint]=\"true\"\n            [focusFirst]=\"false\"\n            container=\"body\">\n          @if (isLoadingSuggestions()) {\n            <span class=\"input-group-text\">\n              <div class=\"spinner-border spinner-border-sm\" role=\"status\">\n                <span class=\"visually-hidden\">Loading...</span>\n              </div>\n            </span>\n          } @else {\n            <span class=\"input-group-text\">\n              <i class=\"bi bi-search text-muted\"></i>\n            </span>\n          }\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"clearValue()\"\n            title=\"Clear value\">\n            <i class=\"bi bi-x\"></i>\n          </button>\n        </div>\n        <div class=\"form-text\">\n          <i class=\"bi bi-info-circle me-1\"></i>\n          Search {{ searchType() === 'icontains' ? 'contains' : 'starts with' }} for {{ ontologyTypeLabel }} ontology\n        </div>\n      } @else if (!showSpecialInput()) {\n        <!-- Regular input when no ontology type or special input is disabled -->\n        <div class=\"input-group\">\n          <input\n            type=\"text\"\n            class=\"form-control\"\n            [class.border-success]=\"selectedFavorite() !== null\"\n            id=\"metadataValue\"\n            formControlName=\"value\"\n            placeholder=\"Enter metadata value\">\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"clearValue()\"\n            title=\"Clear value\">\n            <i class=\"bi bi-x\"></i>\n          </button>\n        </div>\n        <div class=\"form-text text-muted\">\n          @if (specialSyntaxType()) {\n            Manual text entry mode. Use the Enhanced Editor toggle for structured {{ specialSyntaxType() }} input.\n          } @else {\n            Enter the value manually (no ontology suggestions available for this column type)\n          }\n        </div>\n      }\n    </div>\n\n    <!-- Character count and value info -->\n    <div class=\"mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center\">\n        <small class=\"text-muted\">\n          Characters: {{ editForm.get('value')?.value?.length || 0 }}/500\n        </small>\n        @if (getSelectedFavoriteInfo()) {\n          <small class=\"text-info\">\n            <i class=\"bi bi-info-circle me-1\"></i>{{ getSelectedFavoriteInfo() }}\n          </small>\n        }\n      </div>\n    </div>\n\n      </form>\n    </div>\n\n    <!-- Sample Selection Panel -->\n    @if (hasMultiSampleEdit) {\n      <div class=\"col-md-4\">\n        <div class=\"border-start ps-3\">\n          <div class=\"d-flex justify-content-between align-items-center mb-3\">\n            <h6 class=\"mb-0 text-muted\">\n              <i class=\"bi bi-list-check me-1\"></i>Apply to Samples\n            </h6>\n            <span class=\"badge bg-primary\">\n              {{ selectedSampleCount }}/{{ totalSampleCount }}\n            </span>\n          </div>\n\n          <!-- Select All/Clear All Controls -->\n          <div class=\"d-flex gap-1 mb-3\">\n            <button \n              type=\"button\" \n              class=\"btn btn-outline-primary btn-sm flex-fill\"\n              (click)=\"selectAllSamples()\"\n              [disabled]=\"selectedSampleCount === totalSampleCount\">\n              <i class=\"bi bi-check-all me-1\"></i>All\n            </button>\n            <button \n              type=\"button\" \n              class=\"btn btn-outline-secondary btn-sm flex-fill\"\n              (click)=\"clearSampleSelection()\"\n              [disabled]=\"selectedSampleCount === 0\">\n              <i class=\"bi bi-x me-1\"></i>Clear\n            </button>\n          </div>\n\n          <!-- Sample List -->\n          <div class=\"sample-list\" style=\"max-height: 400px; overflow-y: auto;\">\n            @for (sample of sampleData; track sample.index) {\n              <div class=\"form-check d-flex align-items-center mb-2 p-2 rounded border-bottom\">\n                <input \n                  class=\"form-check-input me-2\" \n                  type=\"checkbox\" \n                  [id]=\"'sample-' + sample.index\"\n                  [checked]=\"isSampleSelected(sample.index)\"\n                  (change)=\"toggleSampleSelection(sample.index)\">\n                <label \n                  [for]=\"'sample-' + sample.index\" \n                  class=\"form-check-label flex-grow-1 cursor-pointer\">\n                  <div class=\"d-flex justify-content-between align-items-center\">\n                    <div>\n                      <div class=\"fw-semibold\">Sample {{ sample.index }}</div>\n                      @if (sample.sourceName) {\n                        <small class=\"text-muted\">{{ sample.sourceName }}</small>\n                      }\n                    </div>\n                    <div class=\"text-end\">\n                      <small class=\"text-muted\">Current:</small>\n                      <div class=\"small fw-mono\" [title]=\"sample.value || ''\">\n                        {{ (sample.value && sample.value.length > 15) ? (sample.value | slice:0:15) + '...' : (sample.value || '-') }}\n                      </div>\n                    </div>\n                  </div>\n                </label>\n              </div>\n            }\n          </div>\n\n          @if (selectedSampleCount > 0) {\n            <div class=\"alert alert-info mt-3 p-2\">\n              <small>\n                <i class=\"bi bi-info-circle me-1\"></i>\n                The value will be applied to {{ selectedSampleCount }} selected sample{{ selectedSampleCount !== 1 ? 's' : '' }}.\n              </small>\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n<div class=\"modal-footer\">\n  <div class=\"me-auto\">\n    @if (editForm.get('value')?.value && !isLoading() && !isFromFavoriteManagement) {\n      <div class=\"btn-group dropup\" ngbDropdown>\n        <button\n          type=\"button\"\n          class=\"btn btn-outline-warning btn-sm dropdown-toggle\"\n          ngbDropdownToggle>\n          <i class=\"bi bi-heart me-1\"></i>Add to Favorites\n        </button>\n        <div class=\"dropdown-menu\" ngbDropdownMenu>\n          <button\n            type=\"button\"\n            class=\"dropdown-item\"\n            (click)=\"addToFavorites('user')\">\n            <i class=\"bi bi-person me-2\"></i>Personal Favorite\n          </button>\n          <button\n            type=\"button\"\n            class=\"dropdown-item\"\n            (click)=\"addToFavorites('lab_group')\">\n            <i class=\"bi bi-people me-2\"></i>Lab Group Favorite\n          </button>\n          <button\n            type=\"button\"\n            class=\"dropdown-item\"\n            (click)=\"addToFavorites('global')\">\n            <i class=\"bi bi-globe me-2\"></i>Global Recommendation\n          </button>\n        </div>\n      </div>\n    }\n  </div>\n\n  <div class=\"d-flex gap-2\">\n    <button type=\"button\" class=\"btn btn-outline-secondary\" (click)=\"onCancel()\">\n      <i class=\"bi bi-x-circle me-1\"></i>Cancel\n    </button>\n    <button\n      type=\"button\"\n      class=\"btn btn-primary\"\n      (click)=\"onSubmit()\"\n      [disabled]=\"editForm.invalid || isLoading()\">\n      @if (isLoading()) {\n        <span class=\"spinner-border spinner-border-sm me-2\"></span>\n      }\n      <i class=\"bi bi-check-circle me-1\"></i>\n      Save Value\n    </button>\n  </div>\n</div>\n", styles: [".sample-list .form-check{border:1px solid transparent;transition:all .2s ease}.sample-list .form-check:hover{background-color:rgba(var(--bs-primary-rgb),.05);border-color:rgba(var(--bs-primary-rgb),.2)}.sample-list .form-check .form-check-input:checked~.form-check-label .fw-semibold{color:var(--bs-primary)}.cursor-pointer{cursor:pointer}.fw-mono{font-family:var(--bs-font-monospace)}\n"] }]
-        }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.NgbActiveModal }, { type: i3.AuthService }, { type: FavouriteMetadataOptionService }, { type: MetadataColumnService }, { type: MetadataColumnTemplateService }, { type: i3.LabGroupService }], propDecorators: { config: [{
+        }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.NgbActiveModal }, { type: i3.AuthService }, { type: FavouriteMetadataOptionService }, { type: MetadataColumnService }, { type: MetadataColumnTemplateService }, { type: i3.LabGroupService }, { type: OntologySearchService }], propDecorators: { config: [{
                 type: Input
             }], valueSaved: [{
                 type: Output
@@ -4651,34 +4719,41 @@ class ColumnEditModal {
         return this.hasOntologyType && this.editForm.get('enableTypeahead')?.value === true;
     }
     openValueEditModal() {
-        // Get custom filters from selected ontology type or template
-        let customFilters = this.selectedTemplate?.customOntologyFilters;
+        const ontologyTypeIndexStr = this.editForm.get('ontologyType')?.value;
+        const ontologyTypeIndex = parseInt(ontologyTypeIndexStr || '0');
+        const enableTypeahead = this.editForm.get('enableTypeahead')?.value || false;
         let ontologyType = '';
-        // If in advanced mode and an ontology type is selected, use its custom filters
-        if (this.showAdvancedMode() && this.selectedOntologyConfig) {
-            ontologyType = this.selectedOntologyConfig.value;
-            if (this.selectedOntologyConfig.customFilters) {
-                customFilters = this.selectedOntologyConfig.customFilters;
-            }
+        if (ontologyTypeIndex > 0 && ontologyTypeIndex < this.ontologyTypes.length) {
+            ontologyType = this.ontologyTypes[ontologyTypeIndex].value;
         }
         const config = {
-            columnId: this.column?.id,
             columnName: this.editForm.get('name')?.value || 'Column',
             columnType: this.editForm.get('type')?.value || '',
             ontologyType: ontologyType,
-            enableTypeahead: this.editForm.get('enableTypeahead')?.value || false,
+            enableTypeahead: enableTypeahead,
             currentValue: this.editForm.get('value')?.value || '',
-            context: this.isEdit ? 'table' : 'template',
-            templateId: this.selectedTemplate?.id || this.templateId || undefined,
-            customOntologyFilters: customFilters
+            context: this.isEdit ? 'table' : 'template'
         };
+        const hasTemplate = this.selectedTemplate || this.column?.template || this.templateId;
+        if (hasTemplate) {
+            if (this.isEdit && this.column?.id) {
+                config.columnId = this.column.id;
+            }
+            config.templateId = this.selectedTemplate?.id || this.column?.template || this.templateId || undefined;
+        }
+        else {
+            const columnName = this.editForm.get('name')?.value;
+            if (columnName) {
+                const ontologyConfig = this.getOntologyConfigForColumn(columnName);
+                config.customOntologyFilters = ontologyConfig.customFilters;
+            }
+        }
         const modalRef = this.modalService.open(MetadataValueEditModal, {
             size: 'lg',
             backdrop: 'static'
         });
         modalRef.componentInstance.config = config;
         modalRef.componentInstance.valueSaved.subscribe((result) => {
-            // Extract the actual value from the result
             const newValue = typeof result === 'string' ? result : result.value;
             this.editForm.get('value')?.setValue(newValue);
             this.editForm.get('value')?.markAsTouched();
@@ -4795,16 +4870,14 @@ class ColumnEditModal {
         // Enable controls to update values, then disable again
         this.editForm.get('name')?.enable();
         this.editForm.get('type')?.enable();
-        const ontologyTypeValue = this.getDefaultOntologyTypeForColumn(column.name);
-        const ontologyTypeIndex = ontologyTypeValue
-            ? this.ontologyTypes.findIndex(o => o.value === ontologyTypeValue)
-            : 0;
+        const ontologyConfig = this.getOntologyConfigForColumn(column.name);
+        const ontologyTypeIndex = ontologyConfig.index;
         this.editForm.patchValue({
             name: column.name,
             type: column.type,
             value: '',
-            ontologyType: ontologyTypeIndex >= 0 ? ontologyTypeIndex.toString() : '0',
-            enableTypeahead: this.shouldEnableTypeaheadForColumn(column.name),
+            ontologyType: ontologyTypeIndex.toString(),
+            enableTypeahead: ontologyTypeIndex > 0,
             mandatory: this.isColumnMandatory(column.name),
             hidden: false,
             readonly: false,
@@ -4825,41 +4898,89 @@ class ColumnEditModal {
             return !this.templates.some(template => template.columnName.toLowerCase() === officialCol.name.toLowerCase());
         });
     }
-    getDefaultOntologyTypeForColumn(columnName) {
+    getOntologyConfigForColumn(columnName) {
         const lowerName = columnName.toLowerCase();
-        // Based on backend configure_ontology_options method - use exact matches
+        const MSTermType = {
+            INSTRUMENT: 'instrument',
+            MASS_ANALYZER_TYPE: 'mass analyzer type',
+            CLEAVAGE_AGENT: 'cleavage agent',
+            SAMPLE_ATTRIBUTE: 'sample attribute',
+            ANCESTRAL_CATEGORY: 'ancestral category',
+            SEX: 'sex',
+            DEVELOPMENTAL_STAGE: 'developmental stage'
+        };
+        let ontologyType = '';
+        let customFilters = undefined;
         switch (lowerName) {
             case 'characteristics[organism]':
-                return 'species';
+                ontologyType = 'species';
+                break;
             case 'characteristics[disease]':
-                return 'human_disease';
+                ontologyType = 'human_disease';
+                break;
             case 'characteristics[organism part]':
-                return 'tissue';
+                ontologyType = 'tissue';
+                break;
             case 'characteristics[cell type]':
-                return 'cell_ontology';
+                ontologyType = 'cell_ontology';
+                break;
             case 'comment[instrument]':
-                return 'ms_unique_vocabularies';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.INSTRUMENT } };
+                break;
             case 'comment[modification parameters]':
-                return 'unimod';
+                ontologyType = 'unimod';
+                break;
             case 'comment[ms2 analyzer type]':
-                return 'ms_unique_vocabularies';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.MASS_ANALYZER_TYPE } };
+                break;
             case 'comment[cleavage agent details]':
-                return 'ms_unique_vocabularies';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.CLEAVAGE_AGENT } };
+                break;
             case 'characteristics[ancestry category]':
-                return 'ms_unique_vocabularies';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.ANCESTRAL_CATEGORY } };
+                break;
             case 'characteristics[sex]':
-                return 'ms_unique_vocabularies';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.SEX } };
+                break;
             case 'characteristics[developmental stage]':
-                return 'ms_unique_vocabularies';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.DEVELOPMENTAL_STAGE } };
+                break;
             case 'comment[label]':
-                return 'ms_unique_vocabularies';
-            default:
-                return '';
+                ontologyType = 'ms_unique_vocabularies';
+                customFilters = { ms_unique_vocabularies: { term_type: MSTermType.SAMPLE_ATTRIBUTE } };
+                break;
         }
-    }
-    shouldEnableTypeaheadForColumn(columnName) {
-        const ontologyType = this.getDefaultOntologyTypeForColumn(columnName);
-        return ontologyType.length > 0;
+        if (!ontologyType) {
+            return { index: 0, ontologyType: '', customFilters: undefined };
+        }
+        // Find the matching ontology type config with the correct custom filters
+        const index = this.ontologyTypes.findIndex(config => {
+            if (config.value !== ontologyType)
+                return false;
+            if (!customFilters)
+                return !config.customFilters || Object.keys(config.customFilters).length === 0;
+            // Match custom filters
+            if (!config.customFilters)
+                return false;
+            const configFilterKey = Object.keys(config.customFilters)[0];
+            const customFilterKey = Object.keys(customFilters)[0];
+            if (configFilterKey !== customFilterKey)
+                return false;
+            const configTermType = config.customFilters[configFilterKey]?.['term_type'];
+            const customTermType = customFilters[customFilterKey]?.['term_type'];
+            return configTermType === customTermType;
+        });
+        return {
+            index: index >= 0 ? index : 0,
+            ontologyType,
+            customFilters
+        };
     }
     isColumnMandatory(columnName) {
         const lowerName = columnName.toLowerCase();