@noatgnu/cupcake-vanilla 1.2.17 → 1.2.19

package/fesm2022/noatgnu-cupcake-vanilla.mjs

@@ -676,6 +676,9 @@ class MetadataTableService extends BaseApiService {
     bulkUpdateStaffOnly(id, request) {
         return this.post(`${this.apiUrl}/metadata-tables/${id}/bulk_update_staff_only/`, request);
     }
+    advancedAutofill(id, request) {
+        return this.post(`${this.apiUrl}/metadata-tables/${id}/advanced_autofill/`, request);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: MetadataTableService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: MetadataTableService, providedIn: 'root' });
 }
@@ -7854,14 +7857,17 @@ class SamplePoolCreateModal {
     currentPage = signal(1, ...(ngDevMode ? [{ debugName: "currentPage" }] : []));
     samplesPerPage = 10;
     sourceNameColumn = computed(() => {
-        return this.metadataTable?.columns?.find(c => c.name === 'source name');
+        return this.metadataTable?.columns?.find(c => c.name.toLowerCase() === 'source name');
     }, ...(ngDevMode ? [{ debugName: "sourceNameColumn" }] : []));
     assayNameColumn = computed(() => {
-        return this.metadataTable?.columns?.find(c => c.name === 'assay name');
+        return this.metadataTable?.columns?.find(c => c.name.toLowerCase() === 'assay name');
     }, ...(ngDevMode ? [{ debugName: "assayNameColumn" }] : []));
     fractionIdentifierColumn = computed(() => {
-        return this.metadataTable?.columns?.find(c => c.name === 'comment[fraction identifier]');
+        return this.metadataTable?.columns?.find(c => c.name.toLowerCase() === 'comment[fraction identifier]');
     }, ...(ngDevMode ? [{ debugName: "fractionIdentifierColumn" }] : []));
+    labelColumn = computed(() => {
+        return this.metadataTable?.columns?.find(c => c.name.toLowerCase() === 'comment[label]');
+    }, ...(ngDevMode ? [{ debugName: "labelColumn" }] : []));
     constructor(fb, activeModal, samplePoolService, toastService) {
         this.fb = fb;
         this.activeModal = activeModal;
@@ -8160,11 +8166,11 @@ class SamplePoolCreateModal {
         return false;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: SamplePoolCreateModal, deps: [{ token: i1.FormBuilder }, { token: i2.NgbActiveModal }, { token: SamplePoolService }, { token: i3.ToastService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: SamplePoolCreateModal, isStandalone: true, selector: "ccv-sample-pool-create-modal", inputs: { metadataTable: "metadataTable" }, outputs: { poolCreated: "poolCreated" }, ngImport: i0, template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-plus-circle me-2\"></i>Create Sample Pool\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"onCancel()\"></button>\n</div>\n\n<div class=\"modal-body\" style=\"max-height: 70vh; overflow-y: auto;\">\n  <form [formGroup]=\"createForm\" (ngSubmit)=\"onSubmit()\">\n    \n    <!-- Pool Basic Info -->\n    <div class=\"row mb-4\">\n      <div class=\"col-12\">\n        <h6 class=\"text-primary mb-3\">\n          <i class=\"bi bi-info-circle me-2\"></i>Pool Information\n        </h6>\n      </div>\n      \n      <!-- Pool Name -->\n      <div class=\"col-md-6 mb-3\">\n        <label for=\"poolName\" class=\"form-label\">Pool Name *</label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"poolName\"\n          formControlName=\"poolName\"\n          [class.is-invalid]=\"isFieldInvalid('poolName')\"\n          placeholder=\"Enter pool name\">\n        @if (isFieldInvalid('poolName')) {\n          <div class=\"invalid-feedback\">\n            {{ getFieldError('poolName') }}\n          </div>\n        }\n      </div>\n\n\n      <!-- Description -->\n      <div class=\"col-12 mb-3\">\n        <label for=\"poolDescription\" class=\"form-label\">Description</label>\n        <textarea \n          class=\"form-control\"\n          id=\"poolDescription\"\n          formControlName=\"poolDescription\"\n          rows=\"2\"\n          placeholder=\"Optional pool description\"></textarea>\n      </div>\n\n      <!-- Reference Pool Checkbox -->\n      <div class=\"col-12 mb-3\">\n        <div class=\"form-check\">\n          <input \n            class=\"form-check-input\" \n            type=\"checkbox\" \n            id=\"isReference\" \n            formControlName=\"isReference\">\n          <label class=\"form-check-label\" for=\"isReference\">\n            <strong>Reference Pool</strong>\n            <div class=\"form-text\">Check if this is a reference pool</div>\n          </label>\n        </div>\n      </div>\n    </div>\n\n    <!-- Sample Selection Methods -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-check2-square me-2\"></i>Sample Selection\n      </h6>\n\n      <!-- Selection Mode Tabs -->\n      <div class=\"btn-group mb-3\" role=\"group\">\n        <input type=\"radio\" class=\"btn-check\" id=\"manualMode\" [value]=\"'manual'\" \n               [checked]=\"selectionMode() === 'manual'\" (click)=\"selectionMode.set('manual')\">\n        <label class=\"btn btn-outline-primary\" for=\"manualMode\">\n          <i class=\"bi bi-hand-index me-1\"></i>Manual Selection\n        </label>\n\n        <input type=\"radio\" class=\"btn-check\" id=\"rangeMode\" [value]=\"'range'\" \n               [checked]=\"selectionMode() === 'range'\" (click)=\"selectionMode.set('range')\">\n        <label class=\"btn btn-outline-primary\" for=\"rangeMode\">\n          <i class=\"bi bi-sliders me-1\"></i>Range Selection\n        </label>\n      </div>\n\n      <!-- Range Selection Controls -->\n      @if (selectionMode() === 'range') {\n        <div class=\"card mb-3\">\n          <div class=\"card-body\">\n            <div class=\"row align-items-end\">\n              <div class=\"col-md-4\">\n                <label for=\"rangeStart\" class=\"form-label\">Start Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeStart\"\n                  formControlName=\"range_start\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_start')\">\n                @if (isFieldInvalid('range_start')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_start') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <label for=\"rangeEnd\" class=\"form-label\">End Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeEnd\"\n                  formControlName=\"range_end\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_end')\">\n                @if (isFieldInvalid('range_end')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_end') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <button type=\"button\" class=\"btn btn-success w-100\" (click)=\"selectSamplesInRange()\">\n                  <i class=\"bi bi-plus-square me-1\"></i>Select Range\n                </button>\n              </div>\n            </div>\n            <div class=\"form-text mt-2\">\n              Select samples from {{ createForm.get('range_start')?.value || 1 }} \n              to {{ createForm.get('range_end')?.value || 1 }} \n              ({{ Math.abs((createForm.get('range_end')?.value || 1) - (createForm.get('range_start')?.value || 1)) + 1 }} samples)\n            </div>\n          </div>\n        </div>\n      }\n\n      <!-- Sample Table for Manual Selection -->\n      @if (selectionMode() === 'manual') {\n        <div class=\"mb-3\">\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <label class=\"form-label mb-0\">\n              Select Samples <span class=\"text-muted\">({{ selectedSamplesCount }} of {{ availableSamplesCount }} selected)</span>\n            </label>\n            <div class=\"btn-group btn-group-sm\">\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-primary\"\n                (click)=\"selectAllNonPooledSamples()\"\n                title=\"Select All\"\n              >\n                <i class=\"bi bi-check-all\"></i>\n              </button>\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-secondary\"\n                (click)=\"clearAllSelections()\"\n                title=\"Clear Selection\"\n              >\n                <i class=\"bi bi-x\"></i>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"table-responsive\">\n            <table class=\"table table-sm table-hover\">\n              <thead>\n                <tr>\n                  <th style=\"width: 50px;\">\n                    <input\n                      type=\"checkbox\"\n                      class=\"form-check-input\"\n                      [checked]=\"selectedSamplesCount === availableSamplesCount && selectedSamplesCount > 0\"\n                      [indeterminate]=\"selectedSamplesCount > 0 && selectedSamplesCount < availableSamplesCount\"\n                      (change)=\"toggleSelectAllSamples()\"\n                    />\n                  </th>\n                  <th style=\"width: 80px;\">Sample</th>\n                  <th>Source Name</th>\n                  <th>Assay Name</th>\n                  <th>Fraction Identifier</th>\n                </tr>\n              </thead>\n              <tbody>\n                @for (sample of paginatedSamples; track sample.sampleNumber) {\n                  <tr\n                    [class.table-active]=\"sample.selected\"\n                    [class.table-warning]=\"sample.pooled\"\n                    (click)=\"!sample.pooled && toggleSampleSelection(sample.sampleNumber)\"\n                    [style.cursor]=\"sample.pooled ? 'not-allowed' : 'pointer'\"\n                  >\n                    <td>\n                      <input\n                        type=\"checkbox\"\n                        class=\"form-check-input\"\n                        [checked]=\"sample.selected\"\n                        [disabled]=\"sample.pooled\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"toggleSampleSelection(sample.sampleNumber)\"\n                      />\n                    </td>\n                    <td class=\"fw-semibold\">\n                      {{ sample.sampleNumber }}\n                      @if (sample.pooled) {\n                        <i class=\"bi bi-lock-fill ms-1 text-warning\" title=\"Already in another pool\"></i>\n                      }\n                    </td>\n                    <td>{{ getColumnValueForSample(sourceNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(assayNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(fractionIdentifierColumn(), sample.sampleNumber) || '-' }}</td>\n                  </tr>\n                }\n              </tbody>\n            </table>\n          </div>\n\n          @if (totalPages > 1) {\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <small class=\"text-muted\">\n                Showing {{ ((currentPage() - 1) * samplesPerPage) + 1 }}-{{ Math.min(currentPage() * samplesPerPage, samples().length) }} of {{ samples().length }}\n              </small>\n              <ngb-pagination\n                [collectionSize]=\"samples().length\"\n                [page]=\"currentPage()\"\n                [pageSize]=\"samplesPerPage\"\n                [maxSize]=\"3\"\n                [boundaryLinks]=\"true\"\n                (pageChange)=\"goToPage($event)\"\n                size=\"sm\"\n              ></ngb-pagination>\n            </div>\n          }\n\n          <div class=\"form-text\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Select samples to add to the pool. Samples with <i class=\"bi bi-lock-fill\"></i> are already in another pool.\n          </div>\n        </div>\n      }\n\n      <!-- Selection Summary -->\n      @if (selectedSamplesCount > 0) {\n        <div class=\"alert alert-info\">\n          <div class=\"d-flex justify-content-between align-items-center\">\n            <span>\n              <i class=\"bi bi-info-circle me-2\"></i>\n              <strong>{{ selectedSamplesCount }}</strong> samples selected\n            </span>\n            <div class=\"btn-group btn-group-sm\">\n              <button type=\"button\" class=\"btn btn-outline-primary\" (click)=\"assignToPooledOnly()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled Only\n              </button>\n              <button type=\"button\" class=\"btn btn-outline-success\" (click)=\"assignToPooledAndIndependent()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled & Independent\n              </button>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <!-- Sample Configuration -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-gear me-2\"></i>Sample Configuration\n      </h6>\n      \n      <!-- Pooled Only Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledOnlySamples\" class=\"form-label\">\n          Pooled Only Samples\n          <span class=\"badge bg-primary ms-2\">{{ parseSampleNumbers(createForm.get('pooled_only_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledOnlySamples\"\n          formControlName=\"pooled_only_samples_text\"\n          placeholder=\"e.g., 1, 2, 3, 5-8\">\n        <div class=\"form-text\">\n          Enter sample numbers separated by commas. Ranges like \"5-8\" are supported.\n        </div>\n      </div>\n\n      <!-- Pooled and Independent Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledAndIndependentSamples\" class=\"form-label\">\n          Pooled & Independent Samples\n          <span class=\"badge bg-success ms-2\">{{ parseSampleNumbers(createForm.get('pooled_and_independent_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledAndIndependentSamples\"\n          formControlName=\"pooled_and_independent_samples_text\"\n          placeholder=\"e.g., 4, 9, 10-15\">\n        <div class=\"form-text\">\n          Enter sample numbers that are both pooled and run independently.\n        </div>\n      </div>\n\n      <!-- Total Count Display -->\n      <div class=\"alert\" \n           [class.alert-success]=\"totalPooledSamplesCount > 0 && totalPooledSamplesCount <= metadataTable.sampleCount\"\n           [class.alert-warning]=\"totalPooledSamplesCount === 0\"\n           [class.alert-danger]=\"totalPooledSamplesCount > metadataTable.sampleCount\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        <strong>Total Samples:</strong> {{ totalPooledSamplesCount }}\n        @if (totalPooledSamplesCount > metadataTable.sampleCount) {\n          <span class=\"text-danger ms-2\">\n            (Exceeds maximum of {{ metadataTable.sampleCount }})\n          </span>\n        } @else if (totalPooledSamplesCount === 0) {\n          <span class=\"text-warning ms-2\">\n            (Please select at least one sample)\n          </span>\n        }\n      </div>\n    </div>\n\n    <!-- Form Status -->\n    <div class=\"d-flex justify-content-between align-items-center mb-2\">\n      <small class=\"text-muted\">\n        Name: {{ createForm.get('poolName')?.value?.length || 0 }}/255 characters\n      </small>\n      @if (totalPooledSamplesCount > 0) {\n        <small class=\"text-success\">\n          <i class=\"bi bi-check-circle me-1\"></i>Ready to create\n        </small>\n      }\n    </div>\n\n  </form>\n</div>\n\n<div class=\"modal-footer\">\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]=\"createForm.invalid || isLoading() || totalPooledSamplesCount === 0 || totalPooledSamplesCount > metadataTable.sampleCount\">\n    @if (isLoading()) {\n      <span class=\"spinner-border spinner-border-sm me-2\"></span>\n    }\n    <i class=\"bi bi-plus-circle me-1\"></i>\n    Create Pool\n  </button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { 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: "component", type: i2.NgbPagination, selector: "ngb-pagination", inputs: ["disabled", "boundaryLinks", "directionLinks", "ellipses", "rotate", "collectionSize", "maxSize", "page", "pageSize", "size"], outputs: ["pageChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: SamplePoolCreateModal, isStandalone: true, selector: "ccv-sample-pool-create-modal", inputs: { metadataTable: "metadataTable" }, outputs: { poolCreated: "poolCreated" }, ngImport: i0, template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-plus-circle me-2\"></i>Create Sample Pool\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"onCancel()\"></button>\n</div>\n\n<div class=\"modal-body\" style=\"max-height: 70vh; overflow-y: auto;\">\n  <form [formGroup]=\"createForm\" (ngSubmit)=\"onSubmit()\">\n    \n    <!-- Pool Basic Info -->\n    <div class=\"row mb-4\">\n      <div class=\"col-12\">\n        <h6 class=\"text-primary mb-3\">\n          <i class=\"bi bi-info-circle me-2\"></i>Pool Information\n        </h6>\n      </div>\n      \n      <!-- Pool Name -->\n      <div class=\"col-md-6 mb-3\">\n        <label for=\"poolName\" class=\"form-label\">Pool Name *</label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"poolName\"\n          formControlName=\"poolName\"\n          [class.is-invalid]=\"isFieldInvalid('poolName')\"\n          placeholder=\"Enter pool name\">\n        @if (isFieldInvalid('poolName')) {\n          <div class=\"invalid-feedback\">\n            {{ getFieldError('poolName') }}\n          </div>\n        }\n      </div>\n\n\n      <!-- Description -->\n      <div class=\"col-12 mb-3\">\n        <label for=\"poolDescription\" class=\"form-label\">Description</label>\n        <textarea \n          class=\"form-control\"\n          id=\"poolDescription\"\n          formControlName=\"poolDescription\"\n          rows=\"2\"\n          placeholder=\"Optional pool description\"></textarea>\n      </div>\n\n      <!-- Reference Pool Checkbox -->\n      <div class=\"col-12 mb-3\">\n        <div class=\"form-check\">\n          <input \n            class=\"form-check-input\" \n            type=\"checkbox\" \n            id=\"isReference\" \n            formControlName=\"isReference\">\n          <label class=\"form-check-label\" for=\"isReference\">\n            <strong>Reference Pool</strong>\n            <div class=\"form-text\">Check if this is a reference pool</div>\n          </label>\n        </div>\n      </div>\n    </div>\n\n    <!-- Sample Selection Methods -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-check2-square me-2\"></i>Sample Selection\n      </h6>\n\n      <!-- Selection Mode Tabs -->\n      <div class=\"btn-group mb-3\" role=\"group\">\n        <input type=\"radio\" class=\"btn-check\" id=\"manualMode\" [value]=\"'manual'\" \n               [checked]=\"selectionMode() === 'manual'\" (click)=\"selectionMode.set('manual')\">\n        <label class=\"btn btn-outline-primary\" for=\"manualMode\">\n          <i class=\"bi bi-hand-index me-1\"></i>Manual Selection\n        </label>\n\n        <input type=\"radio\" class=\"btn-check\" id=\"rangeMode\" [value]=\"'range'\" \n               [checked]=\"selectionMode() === 'range'\" (click)=\"selectionMode.set('range')\">\n        <label class=\"btn btn-outline-primary\" for=\"rangeMode\">\n          <i class=\"bi bi-sliders me-1\"></i>Range Selection\n        </label>\n      </div>\n\n      <!-- Range Selection Controls -->\n      @if (selectionMode() === 'range') {\n        <div class=\"card mb-3\">\n          <div class=\"card-body\">\n            <div class=\"row align-items-end\">\n              <div class=\"col-md-4\">\n                <label for=\"rangeStart\" class=\"form-label\">Start Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeStart\"\n                  formControlName=\"range_start\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_start')\">\n                @if (isFieldInvalid('range_start')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_start') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <label for=\"rangeEnd\" class=\"form-label\">End Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeEnd\"\n                  formControlName=\"range_end\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_end')\">\n                @if (isFieldInvalid('range_end')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_end') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <button type=\"button\" class=\"btn btn-success w-100\" (click)=\"selectSamplesInRange()\">\n                  <i class=\"bi bi-plus-square me-1\"></i>Select Range\n                </button>\n              </div>\n            </div>\n            <div class=\"form-text mt-2\">\n              Select samples from {{ createForm.get('range_start')?.value || 1 }} \n              to {{ createForm.get('range_end')?.value || 1 }} \n              ({{ Math.abs((createForm.get('range_end')?.value || 1) - (createForm.get('range_start')?.value || 1)) + 1 }} samples)\n            </div>\n          </div>\n        </div>\n      }\n\n      <!-- Sample Table for Manual Selection -->\n      @if (selectionMode() === 'manual') {\n        <div class=\"mb-3\">\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <label class=\"form-label mb-0\">\n              Select Samples <span class=\"text-muted\">({{ selectedSamplesCount }} of {{ availableSamplesCount }} selected)</span>\n            </label>\n            <div class=\"btn-group btn-group-sm\">\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-primary\"\n                (click)=\"selectAllNonPooledSamples()\"\n                title=\"Select All\"\n              >\n                <i class=\"bi bi-check-all\"></i>\n              </button>\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-secondary\"\n                (click)=\"clearAllSelections()\"\n                title=\"Clear Selection\"\n              >\n                <i class=\"bi bi-x\"></i>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"table-responsive\">\n            <table class=\"table table-sm table-hover\">\n              <thead>\n                <tr>\n                  <th style=\"width: 50px;\">\n                    <input\n                      type=\"checkbox\"\n                      class=\"form-check-input\"\n                      [checked]=\"selectedSamplesCount === availableSamplesCount && selectedSamplesCount > 0\"\n                      [indeterminate]=\"selectedSamplesCount > 0 && selectedSamplesCount < availableSamplesCount\"\n                      (change)=\"toggleSelectAllSamples()\"\n                    />\n                  </th>\n                  <th style=\"width: 80px;\">Sample</th>\n                  <th>{{ sourceNameColumn()?.displayName || sourceNameColumn()?.name || 'Source Name' }}</th>\n                  <th>{{ assayNameColumn()?.displayName || assayNameColumn()?.name || 'Assay Name' }}</th>\n                  <th>{{ labelColumn()?.displayName || labelColumn()?.name || 'Label' }}</th>\n                  <th>{{ fractionIdentifierColumn()?.displayName || fractionIdentifierColumn()?.name || 'Fraction Identifier' }}</th>\n                </tr>\n              </thead>\n              <tbody>\n                @for (sample of paginatedSamples; track sample.sampleNumber) {\n                  <tr\n                    [class.table-active]=\"sample.selected\"\n                    [class.table-warning]=\"sample.pooled\"\n                    (click)=\"!sample.pooled && toggleSampleSelection(sample.sampleNumber)\"\n                    [style.cursor]=\"sample.pooled ? 'not-allowed' : 'pointer'\"\n                  >\n                    <td>\n                      <input\n                        type=\"checkbox\"\n                        class=\"form-check-input\"\n                        [checked]=\"sample.selected\"\n                        [disabled]=\"sample.pooled\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"toggleSampleSelection(sample.sampleNumber)\"\n                      />\n                    </td>\n                    <td class=\"fw-semibold\">\n                      {{ sample.sampleNumber }}\n                      @if (sample.pooled) {\n                        <i class=\"bi bi-lock-fill ms-1 text-warning\" title=\"Already in another pool\"></i>\n                      }\n                    </td>\n                    <td>{{ getColumnValueForSample(sourceNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(assayNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(labelColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(fractionIdentifierColumn(), sample.sampleNumber) || '-' }}</td>\n                  </tr>\n                }\n              </tbody>\n            </table>\n          </div>\n\n          @if (totalPages > 1) {\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <small class=\"text-muted\">\n                Showing {{ ((currentPage() - 1) * samplesPerPage) + 1 }}-{{ Math.min(currentPage() * samplesPerPage, samples().length) }} of {{ samples().length }}\n              </small>\n              <ngb-pagination\n                [collectionSize]=\"samples().length\"\n                [page]=\"currentPage()\"\n                [pageSize]=\"samplesPerPage\"\n                [maxSize]=\"3\"\n                [boundaryLinks]=\"true\"\n                (pageChange)=\"goToPage($event)\"\n                size=\"sm\"\n              ></ngb-pagination>\n            </div>\n          }\n\n          <div class=\"form-text\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Select samples to add to the pool. Samples with <i class=\"bi bi-lock-fill\"></i> are already in another pool.\n          </div>\n        </div>\n      }\n\n      <!-- Selection Summary -->\n      @if (selectedSamplesCount > 0) {\n        <div class=\"alert alert-info\">\n          <div class=\"d-flex justify-content-between align-items-center\">\n            <span>\n              <i class=\"bi bi-info-circle me-2\"></i>\n              <strong>{{ selectedSamplesCount }}</strong> samples selected\n            </span>\n            <div class=\"btn-group btn-group-sm\">\n              <button type=\"button\" class=\"btn btn-outline-primary\" (click)=\"assignToPooledOnly()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled Only\n              </button>\n              <button type=\"button\" class=\"btn btn-outline-success\" (click)=\"assignToPooledAndIndependent()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled & Independent\n              </button>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <!-- Sample Configuration -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-gear me-2\"></i>Sample Configuration\n      </h6>\n      \n      <!-- Pooled Only Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledOnlySamples\" class=\"form-label\">\n          Pooled Only Samples\n          <span class=\"badge bg-primary ms-2\">{{ parseSampleNumbers(createForm.get('pooled_only_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledOnlySamples\"\n          formControlName=\"pooled_only_samples_text\"\n          placeholder=\"e.g., 1, 2, 3, 5-8\">\n        <div class=\"form-text\">\n          Enter sample numbers separated by commas. Ranges like \"5-8\" are supported.\n        </div>\n      </div>\n\n      <!-- Pooled and Independent Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledAndIndependentSamples\" class=\"form-label\">\n          Pooled & Independent Samples\n          <span class=\"badge bg-success ms-2\">{{ parseSampleNumbers(createForm.get('pooled_and_independent_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledAndIndependentSamples\"\n          formControlName=\"pooled_and_independent_samples_text\"\n          placeholder=\"e.g., 4, 9, 10-15\">\n        <div class=\"form-text\">\n          Enter sample numbers that are both pooled and run independently.\n        </div>\n      </div>\n\n      <!-- Total Count Display -->\n      <div class=\"alert\" \n           [class.alert-success]=\"totalPooledSamplesCount > 0 && totalPooledSamplesCount <= metadataTable.sampleCount\"\n           [class.alert-warning]=\"totalPooledSamplesCount === 0\"\n           [class.alert-danger]=\"totalPooledSamplesCount > metadataTable.sampleCount\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        <strong>Total Samples:</strong> {{ totalPooledSamplesCount }}\n        @if (totalPooledSamplesCount > metadataTable.sampleCount) {\n          <span class=\"text-danger ms-2\">\n            (Exceeds maximum of {{ metadataTable.sampleCount }})\n          </span>\n        } @else if (totalPooledSamplesCount === 0) {\n          <span class=\"text-warning ms-2\">\n            (Please select at least one sample)\n          </span>\n        }\n      </div>\n    </div>\n\n    <!-- Form Status -->\n    <div class=\"d-flex justify-content-between align-items-center mb-2\">\n      <small class=\"text-muted\">\n        Name: {{ createForm.get('poolName')?.value?.length || 0 }}/255 characters\n      </small>\n      @if (totalPooledSamplesCount > 0) {\n        <small class=\"text-success\">\n          <i class=\"bi bi-check-circle me-1\"></i>Ready to create\n        </small>\n      }\n    </div>\n\n  </form>\n</div>\n\n<div class=\"modal-footer\">\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]=\"createForm.invalid || isLoading() || totalPooledSamplesCount === 0 || totalPooledSamplesCount > metadataTable.sampleCount\">\n    @if (isLoading()) {\n      <span class=\"spinner-border spinner-border-sm me-2\"></span>\n    }\n    <i class=\"bi bi-plus-circle me-1\"></i>\n    Create Pool\n  </button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { 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: "component", type: i2.NgbPagination, selector: "ngb-pagination", inputs: ["disabled", "boundaryLinks", "directionLinks", "ellipses", "rotate", "collectionSize", "maxSize", "page", "pageSize", "size"], outputs: ["pageChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: SamplePoolCreateModal, decorators: [{
             type: Component,
-            args: [{ selector: 'ccv-sample-pool-create-modal', standalone: true, imports: [CommonModule, ReactiveFormsModule, NgbModule], template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-plus-circle me-2\"></i>Create Sample Pool\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"onCancel()\"></button>\n</div>\n\n<div class=\"modal-body\" style=\"max-height: 70vh; overflow-y: auto;\">\n  <form [formGroup]=\"createForm\" (ngSubmit)=\"onSubmit()\">\n    \n    <!-- Pool Basic Info -->\n    <div class=\"row mb-4\">\n      <div class=\"col-12\">\n        <h6 class=\"text-primary mb-3\">\n          <i class=\"bi bi-info-circle me-2\"></i>Pool Information\n        </h6>\n      </div>\n      \n      <!-- Pool Name -->\n      <div class=\"col-md-6 mb-3\">\n        <label for=\"poolName\" class=\"form-label\">Pool Name *</label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"poolName\"\n          formControlName=\"poolName\"\n          [class.is-invalid]=\"isFieldInvalid('poolName')\"\n          placeholder=\"Enter pool name\">\n        @if (isFieldInvalid('poolName')) {\n          <div class=\"invalid-feedback\">\n            {{ getFieldError('poolName') }}\n          </div>\n        }\n      </div>\n\n\n      <!-- Description -->\n      <div class=\"col-12 mb-3\">\n        <label for=\"poolDescription\" class=\"form-label\">Description</label>\n        <textarea \n          class=\"form-control\"\n          id=\"poolDescription\"\n          formControlName=\"poolDescription\"\n          rows=\"2\"\n          placeholder=\"Optional pool description\"></textarea>\n      </div>\n\n      <!-- Reference Pool Checkbox -->\n      <div class=\"col-12 mb-3\">\n        <div class=\"form-check\">\n          <input \n            class=\"form-check-input\" \n            type=\"checkbox\" \n            id=\"isReference\" \n            formControlName=\"isReference\">\n          <label class=\"form-check-label\" for=\"isReference\">\n            <strong>Reference Pool</strong>\n            <div class=\"form-text\">Check if this is a reference pool</div>\n          </label>\n        </div>\n      </div>\n    </div>\n\n    <!-- Sample Selection Methods -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-check2-square me-2\"></i>Sample Selection\n      </h6>\n\n      <!-- Selection Mode Tabs -->\n      <div class=\"btn-group mb-3\" role=\"group\">\n        <input type=\"radio\" class=\"btn-check\" id=\"manualMode\" [value]=\"'manual'\" \n               [checked]=\"selectionMode() === 'manual'\" (click)=\"selectionMode.set('manual')\">\n        <label class=\"btn btn-outline-primary\" for=\"manualMode\">\n          <i class=\"bi bi-hand-index me-1\"></i>Manual Selection\n        </label>\n\n        <input type=\"radio\" class=\"btn-check\" id=\"rangeMode\" [value]=\"'range'\" \n               [checked]=\"selectionMode() === 'range'\" (click)=\"selectionMode.set('range')\">\n        <label class=\"btn btn-outline-primary\" for=\"rangeMode\">\n          <i class=\"bi bi-sliders me-1\"></i>Range Selection\n        </label>\n      </div>\n\n      <!-- Range Selection Controls -->\n      @if (selectionMode() === 'range') {\n        <div class=\"card mb-3\">\n          <div class=\"card-body\">\n            <div class=\"row align-items-end\">\n              <div class=\"col-md-4\">\n                <label for=\"rangeStart\" class=\"form-label\">Start Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeStart\"\n                  formControlName=\"range_start\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_start')\">\n                @if (isFieldInvalid('range_start')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_start') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <label for=\"rangeEnd\" class=\"form-label\">End Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeEnd\"\n                  formControlName=\"range_end\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_end')\">\n                @if (isFieldInvalid('range_end')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_end') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <button type=\"button\" class=\"btn btn-success w-100\" (click)=\"selectSamplesInRange()\">\n                  <i class=\"bi bi-plus-square me-1\"></i>Select Range\n                </button>\n              </div>\n            </div>\n            <div class=\"form-text mt-2\">\n              Select samples from {{ createForm.get('range_start')?.value || 1 }} \n              to {{ createForm.get('range_end')?.value || 1 }} \n              ({{ Math.abs((createForm.get('range_end')?.value || 1) - (createForm.get('range_start')?.value || 1)) + 1 }} samples)\n            </div>\n          </div>\n        </div>\n      }\n\n      <!-- Sample Table for Manual Selection -->\n      @if (selectionMode() === 'manual') {\n        <div class=\"mb-3\">\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <label class=\"form-label mb-0\">\n              Select Samples <span class=\"text-muted\">({{ selectedSamplesCount }} of {{ availableSamplesCount }} selected)</span>\n            </label>\n            <div class=\"btn-group btn-group-sm\">\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-primary\"\n                (click)=\"selectAllNonPooledSamples()\"\n                title=\"Select All\"\n              >\n                <i class=\"bi bi-check-all\"></i>\n              </button>\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-secondary\"\n                (click)=\"clearAllSelections()\"\n                title=\"Clear Selection\"\n              >\n                <i class=\"bi bi-x\"></i>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"table-responsive\">\n            <table class=\"table table-sm table-hover\">\n              <thead>\n                <tr>\n                  <th style=\"width: 50px;\">\n                    <input\n                      type=\"checkbox\"\n                      class=\"form-check-input\"\n                      [checked]=\"selectedSamplesCount === availableSamplesCount && selectedSamplesCount > 0\"\n                      [indeterminate]=\"selectedSamplesCount > 0 && selectedSamplesCount < availableSamplesCount\"\n                      (change)=\"toggleSelectAllSamples()\"\n                    />\n                  </th>\n                  <th style=\"width: 80px;\">Sample</th>\n                  <th>Source Name</th>\n                  <th>Assay Name</th>\n                  <th>Fraction Identifier</th>\n                </tr>\n              </thead>\n              <tbody>\n                @for (sample of paginatedSamples; track sample.sampleNumber) {\n                  <tr\n                    [class.table-active]=\"sample.selected\"\n                    [class.table-warning]=\"sample.pooled\"\n                    (click)=\"!sample.pooled && toggleSampleSelection(sample.sampleNumber)\"\n                    [style.cursor]=\"sample.pooled ? 'not-allowed' : 'pointer'\"\n                  >\n                    <td>\n                      <input\n                        type=\"checkbox\"\n                        class=\"form-check-input\"\n                        [checked]=\"sample.selected\"\n                        [disabled]=\"sample.pooled\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"toggleSampleSelection(sample.sampleNumber)\"\n                      />\n                    </td>\n                    <td class=\"fw-semibold\">\n                      {{ sample.sampleNumber }}\n                      @if (sample.pooled) {\n                        <i class=\"bi bi-lock-fill ms-1 text-warning\" title=\"Already in another pool\"></i>\n                      }\n                    </td>\n                    <td>{{ getColumnValueForSample(sourceNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(assayNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(fractionIdentifierColumn(), sample.sampleNumber) || '-' }}</td>\n                  </tr>\n                }\n              </tbody>\n            </table>\n          </div>\n\n          @if (totalPages > 1) {\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <small class=\"text-muted\">\n                Showing {{ ((currentPage() - 1) * samplesPerPage) + 1 }}-{{ Math.min(currentPage() * samplesPerPage, samples().length) }} of {{ samples().length }}\n              </small>\n              <ngb-pagination\n                [collectionSize]=\"samples().length\"\n                [page]=\"currentPage()\"\n                [pageSize]=\"samplesPerPage\"\n                [maxSize]=\"3\"\n                [boundaryLinks]=\"true\"\n                (pageChange)=\"goToPage($event)\"\n                size=\"sm\"\n              ></ngb-pagination>\n            </div>\n          }\n\n          <div class=\"form-text\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Select samples to add to the pool. Samples with <i class=\"bi bi-lock-fill\"></i> are already in another pool.\n          </div>\n        </div>\n      }\n\n      <!-- Selection Summary -->\n      @if (selectedSamplesCount > 0) {\n        <div class=\"alert alert-info\">\n          <div class=\"d-flex justify-content-between align-items-center\">\n            <span>\n              <i class=\"bi bi-info-circle me-2\"></i>\n              <strong>{{ selectedSamplesCount }}</strong> samples selected\n            </span>\n            <div class=\"btn-group btn-group-sm\">\n              <button type=\"button\" class=\"btn btn-outline-primary\" (click)=\"assignToPooledOnly()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled Only\n              </button>\n              <button type=\"button\" class=\"btn btn-outline-success\" (click)=\"assignToPooledAndIndependent()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled & Independent\n              </button>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <!-- Sample Configuration -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-gear me-2\"></i>Sample Configuration\n      </h6>\n      \n      <!-- Pooled Only Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledOnlySamples\" class=\"form-label\">\n          Pooled Only Samples\n          <span class=\"badge bg-primary ms-2\">{{ parseSampleNumbers(createForm.get('pooled_only_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledOnlySamples\"\n          formControlName=\"pooled_only_samples_text\"\n          placeholder=\"e.g., 1, 2, 3, 5-8\">\n        <div class=\"form-text\">\n          Enter sample numbers separated by commas. Ranges like \"5-8\" are supported.\n        </div>\n      </div>\n\n      <!-- Pooled and Independent Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledAndIndependentSamples\" class=\"form-label\">\n          Pooled & Independent Samples\n          <span class=\"badge bg-success ms-2\">{{ parseSampleNumbers(createForm.get('pooled_and_independent_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledAndIndependentSamples\"\n          formControlName=\"pooled_and_independent_samples_text\"\n          placeholder=\"e.g., 4, 9, 10-15\">\n        <div class=\"form-text\">\n          Enter sample numbers that are both pooled and run independently.\n        </div>\n      </div>\n\n      <!-- Total Count Display -->\n      <div class=\"alert\" \n           [class.alert-success]=\"totalPooledSamplesCount > 0 && totalPooledSamplesCount <= metadataTable.sampleCount\"\n           [class.alert-warning]=\"totalPooledSamplesCount === 0\"\n           [class.alert-danger]=\"totalPooledSamplesCount > metadataTable.sampleCount\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        <strong>Total Samples:</strong> {{ totalPooledSamplesCount }}\n        @if (totalPooledSamplesCount > metadataTable.sampleCount) {\n          <span class=\"text-danger ms-2\">\n            (Exceeds maximum of {{ metadataTable.sampleCount }})\n          </span>\n        } @else if (totalPooledSamplesCount === 0) {\n          <span class=\"text-warning ms-2\">\n            (Please select at least one sample)\n          </span>\n        }\n      </div>\n    </div>\n\n    <!-- Form Status -->\n    <div class=\"d-flex justify-content-between align-items-center mb-2\">\n      <small class=\"text-muted\">\n        Name: {{ createForm.get('poolName')?.value?.length || 0 }}/255 characters\n      </small>\n      @if (totalPooledSamplesCount > 0) {\n        <small class=\"text-success\">\n          <i class=\"bi bi-check-circle me-1\"></i>Ready to create\n        </small>\n      }\n    </div>\n\n  </form>\n</div>\n\n<div class=\"modal-footer\">\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]=\"createForm.invalid || isLoading() || totalPooledSamplesCount === 0 || totalPooledSamplesCount > metadataTable.sampleCount\">\n    @if (isLoading()) {\n      <span class=\"spinner-border spinner-border-sm me-2\"></span>\n    }\n    <i class=\"bi bi-plus-circle me-1\"></i>\n    Create Pool\n  </button>\n</div>\n" }]
+            args: [{ selector: 'ccv-sample-pool-create-modal', standalone: true, imports: [CommonModule, ReactiveFormsModule, NgbModule], template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-plus-circle me-2\"></i>Create Sample Pool\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"onCancel()\"></button>\n</div>\n\n<div class=\"modal-body\" style=\"max-height: 70vh; overflow-y: auto;\">\n  <form [formGroup]=\"createForm\" (ngSubmit)=\"onSubmit()\">\n    \n    <!-- Pool Basic Info -->\n    <div class=\"row mb-4\">\n      <div class=\"col-12\">\n        <h6 class=\"text-primary mb-3\">\n          <i class=\"bi bi-info-circle me-2\"></i>Pool Information\n        </h6>\n      </div>\n      \n      <!-- Pool Name -->\n      <div class=\"col-md-6 mb-3\">\n        <label for=\"poolName\" class=\"form-label\">Pool Name *</label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"poolName\"\n          formControlName=\"poolName\"\n          [class.is-invalid]=\"isFieldInvalid('poolName')\"\n          placeholder=\"Enter pool name\">\n        @if (isFieldInvalid('poolName')) {\n          <div class=\"invalid-feedback\">\n            {{ getFieldError('poolName') }}\n          </div>\n        }\n      </div>\n\n\n      <!-- Description -->\n      <div class=\"col-12 mb-3\">\n        <label for=\"poolDescription\" class=\"form-label\">Description</label>\n        <textarea \n          class=\"form-control\"\n          id=\"poolDescription\"\n          formControlName=\"poolDescription\"\n          rows=\"2\"\n          placeholder=\"Optional pool description\"></textarea>\n      </div>\n\n      <!-- Reference Pool Checkbox -->\n      <div class=\"col-12 mb-3\">\n        <div class=\"form-check\">\n          <input \n            class=\"form-check-input\" \n            type=\"checkbox\" \n            id=\"isReference\" \n            formControlName=\"isReference\">\n          <label class=\"form-check-label\" for=\"isReference\">\n            <strong>Reference Pool</strong>\n            <div class=\"form-text\">Check if this is a reference pool</div>\n          </label>\n        </div>\n      </div>\n    </div>\n\n    <!-- Sample Selection Methods -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-check2-square me-2\"></i>Sample Selection\n      </h6>\n\n      <!-- Selection Mode Tabs -->\n      <div class=\"btn-group mb-3\" role=\"group\">\n        <input type=\"radio\" class=\"btn-check\" id=\"manualMode\" [value]=\"'manual'\" \n               [checked]=\"selectionMode() === 'manual'\" (click)=\"selectionMode.set('manual')\">\n        <label class=\"btn btn-outline-primary\" for=\"manualMode\">\n          <i class=\"bi bi-hand-index me-1\"></i>Manual Selection\n        </label>\n\n        <input type=\"radio\" class=\"btn-check\" id=\"rangeMode\" [value]=\"'range'\" \n               [checked]=\"selectionMode() === 'range'\" (click)=\"selectionMode.set('range')\">\n        <label class=\"btn btn-outline-primary\" for=\"rangeMode\">\n          <i class=\"bi bi-sliders me-1\"></i>Range Selection\n        </label>\n      </div>\n\n      <!-- Range Selection Controls -->\n      @if (selectionMode() === 'range') {\n        <div class=\"card mb-3\">\n          <div class=\"card-body\">\n            <div class=\"row align-items-end\">\n              <div class=\"col-md-4\">\n                <label for=\"rangeStart\" class=\"form-label\">Start Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeStart\"\n                  formControlName=\"range_start\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_start')\">\n                @if (isFieldInvalid('range_start')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_start') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <label for=\"rangeEnd\" class=\"form-label\">End Sample</label>\n                <input \n                  type=\"number\" \n                  class=\"form-control\"\n                  id=\"rangeEnd\"\n                  formControlName=\"range_end\"\n                  min=\"1\"\n                  [max]=\"metadataTable.sampleCount\"\n                  [class.is-invalid]=\"isFieldInvalid('range_end')\">\n                @if (isFieldInvalid('range_end')) {\n                  <div class=\"invalid-feedback\">\n                    {{ getFieldError('range_end') }}\n                  </div>\n                }\n              </div>\n              <div class=\"col-md-4\">\n                <button type=\"button\" class=\"btn btn-success w-100\" (click)=\"selectSamplesInRange()\">\n                  <i class=\"bi bi-plus-square me-1\"></i>Select Range\n                </button>\n              </div>\n            </div>\n            <div class=\"form-text mt-2\">\n              Select samples from {{ createForm.get('range_start')?.value || 1 }} \n              to {{ createForm.get('range_end')?.value || 1 }} \n              ({{ Math.abs((createForm.get('range_end')?.value || 1) - (createForm.get('range_start')?.value || 1)) + 1 }} samples)\n            </div>\n          </div>\n        </div>\n      }\n\n      <!-- Sample Table for Manual Selection -->\n      @if (selectionMode() === 'manual') {\n        <div class=\"mb-3\">\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <label class=\"form-label mb-0\">\n              Select Samples <span class=\"text-muted\">({{ selectedSamplesCount }} of {{ availableSamplesCount }} selected)</span>\n            </label>\n            <div class=\"btn-group btn-group-sm\">\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-primary\"\n                (click)=\"selectAllNonPooledSamples()\"\n                title=\"Select All\"\n              >\n                <i class=\"bi bi-check-all\"></i>\n              </button>\n              <button\n                type=\"button\"\n                class=\"btn btn-outline-secondary\"\n                (click)=\"clearAllSelections()\"\n                title=\"Clear Selection\"\n              >\n                <i class=\"bi bi-x\"></i>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"table-responsive\">\n            <table class=\"table table-sm table-hover\">\n              <thead>\n                <tr>\n                  <th style=\"width: 50px;\">\n                    <input\n                      type=\"checkbox\"\n                      class=\"form-check-input\"\n                      [checked]=\"selectedSamplesCount === availableSamplesCount && selectedSamplesCount > 0\"\n                      [indeterminate]=\"selectedSamplesCount > 0 && selectedSamplesCount < availableSamplesCount\"\n                      (change)=\"toggleSelectAllSamples()\"\n                    />\n                  </th>\n                  <th style=\"width: 80px;\">Sample</th>\n                  <th>{{ sourceNameColumn()?.displayName || sourceNameColumn()?.name || 'Source Name' }}</th>\n                  <th>{{ assayNameColumn()?.displayName || assayNameColumn()?.name || 'Assay Name' }}</th>\n                  <th>{{ labelColumn()?.displayName || labelColumn()?.name || 'Label' }}</th>\n                  <th>{{ fractionIdentifierColumn()?.displayName || fractionIdentifierColumn()?.name || 'Fraction Identifier' }}</th>\n                </tr>\n              </thead>\n              <tbody>\n                @for (sample of paginatedSamples; track sample.sampleNumber) {\n                  <tr\n                    [class.table-active]=\"sample.selected\"\n                    [class.table-warning]=\"sample.pooled\"\n                    (click)=\"!sample.pooled && toggleSampleSelection(sample.sampleNumber)\"\n                    [style.cursor]=\"sample.pooled ? 'not-allowed' : 'pointer'\"\n                  >\n                    <td>\n                      <input\n                        type=\"checkbox\"\n                        class=\"form-check-input\"\n                        [checked]=\"sample.selected\"\n                        [disabled]=\"sample.pooled\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"toggleSampleSelection(sample.sampleNumber)\"\n                      />\n                    </td>\n                    <td class=\"fw-semibold\">\n                      {{ sample.sampleNumber }}\n                      @if (sample.pooled) {\n                        <i class=\"bi bi-lock-fill ms-1 text-warning\" title=\"Already in another pool\"></i>\n                      }\n                    </td>\n                    <td>{{ getColumnValueForSample(sourceNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(assayNameColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(labelColumn(), sample.sampleNumber) || '-' }}</td>\n                    <td>{{ getColumnValueForSample(fractionIdentifierColumn(), sample.sampleNumber) || '-' }}</td>\n                  </tr>\n                }\n              </tbody>\n            </table>\n          </div>\n\n          @if (totalPages > 1) {\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <small class=\"text-muted\">\n                Showing {{ ((currentPage() - 1) * samplesPerPage) + 1 }}-{{ Math.min(currentPage() * samplesPerPage, samples().length) }} of {{ samples().length }}\n              </small>\n              <ngb-pagination\n                [collectionSize]=\"samples().length\"\n                [page]=\"currentPage()\"\n                [pageSize]=\"samplesPerPage\"\n                [maxSize]=\"3\"\n                [boundaryLinks]=\"true\"\n                (pageChange)=\"goToPage($event)\"\n                size=\"sm\"\n              ></ngb-pagination>\n            </div>\n          }\n\n          <div class=\"form-text\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Select samples to add to the pool. Samples with <i class=\"bi bi-lock-fill\"></i> are already in another pool.\n          </div>\n        </div>\n      }\n\n      <!-- Selection Summary -->\n      @if (selectedSamplesCount > 0) {\n        <div class=\"alert alert-info\">\n          <div class=\"d-flex justify-content-between align-items-center\">\n            <span>\n              <i class=\"bi bi-info-circle me-2\"></i>\n              <strong>{{ selectedSamplesCount }}</strong> samples selected\n            </span>\n            <div class=\"btn-group btn-group-sm\">\n              <button type=\"button\" class=\"btn btn-outline-primary\" (click)=\"assignToPooledOnly()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled Only\n              </button>\n              <button type=\"button\" class=\"btn btn-outline-success\" (click)=\"assignToPooledAndIndependent()\">\n                <i class=\"bi bi-arrow-right me-1\"></i>Pooled & Independent\n              </button>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <!-- Sample Configuration -->\n    <div class=\"mb-4\">\n      <h6 class=\"text-primary mb-3\">\n        <i class=\"bi bi-gear me-2\"></i>Sample Configuration\n      </h6>\n      \n      <!-- Pooled Only Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledOnlySamples\" class=\"form-label\">\n          Pooled Only Samples\n          <span class=\"badge bg-primary ms-2\">{{ parseSampleNumbers(createForm.get('pooled_only_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledOnlySamples\"\n          formControlName=\"pooled_only_samples_text\"\n          placeholder=\"e.g., 1, 2, 3, 5-8\">\n        <div class=\"form-text\">\n          Enter sample numbers separated by commas. Ranges like \"5-8\" are supported.\n        </div>\n      </div>\n\n      <!-- Pooled and Independent Samples -->\n      <div class=\"mb-3\">\n        <label for=\"pooledAndIndependentSamples\" class=\"form-label\">\n          Pooled & Independent Samples\n          <span class=\"badge bg-success ms-2\">{{ parseSampleNumbers(createForm.get('pooled_and_independent_samples_text')?.value || '').length }} samples</span>\n        </label>\n        <input \n          type=\"text\" \n          class=\"form-control\"\n          id=\"pooledAndIndependentSamples\"\n          formControlName=\"pooled_and_independent_samples_text\"\n          placeholder=\"e.g., 4, 9, 10-15\">\n        <div class=\"form-text\">\n          Enter sample numbers that are both pooled and run independently.\n        </div>\n      </div>\n\n      <!-- Total Count Display -->\n      <div class=\"alert\" \n           [class.alert-success]=\"totalPooledSamplesCount > 0 && totalPooledSamplesCount <= metadataTable.sampleCount\"\n           [class.alert-warning]=\"totalPooledSamplesCount === 0\"\n           [class.alert-danger]=\"totalPooledSamplesCount > metadataTable.sampleCount\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        <strong>Total Samples:</strong> {{ totalPooledSamplesCount }}\n        @if (totalPooledSamplesCount > metadataTable.sampleCount) {\n          <span class=\"text-danger ms-2\">\n            (Exceeds maximum of {{ metadataTable.sampleCount }})\n          </span>\n        } @else if (totalPooledSamplesCount === 0) {\n          <span class=\"text-warning ms-2\">\n            (Please select at least one sample)\n          </span>\n        }\n      </div>\n    </div>\n\n    <!-- Form Status -->\n    <div class=\"d-flex justify-content-between align-items-center mb-2\">\n      <small class=\"text-muted\">\n        Name: {{ createForm.get('poolName')?.value?.length || 0 }}/255 characters\n      </small>\n      @if (totalPooledSamplesCount > 0) {\n        <small class=\"text-success\">\n          <i class=\"bi bi-check-circle me-1\"></i>Ready to create\n        </small>\n      }\n    </div>\n\n  </form>\n</div>\n\n<div class=\"modal-footer\">\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]=\"createForm.invalid || isLoading() || totalPooledSamplesCount === 0 || totalPooledSamplesCount > metadataTable.sampleCount\">\n    @if (isLoading()) {\n      <span class=\"spinner-border spinner-border-sm me-2\"></span>\n    }\n    <i class=\"bi bi-plus-circle me-1\"></i>\n    Create Pool\n  </button>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.NgbActiveModal }, { type: SamplePoolService }, { type: i3.ToastService }], propDecorators: { metadataTable: [{
                 type: Input
             }], poolCreated: [{
@@ -9365,12 +9371,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImpor
                 args: ['excelInput']
             }] } });
 
-class MetadataColumnAutofillModal {
+class BasicAutofillComponent {
     fb;
-    activeModal;
     config;
+    submit = new EventEmitter();
     autofillForm;
-    isSubmitting = signal(false, ...(ngDevMode ? [{ debugName: "isSubmitting" }] : []));
     fillMode = signal('template', ...(ngDevMode ? [{ debugName: "fillMode" }] : []));
     sampleIndices = signal([], ...(ngDevMode ? [{ debugName: "sampleIndices" }] : []));
     currentPage = signal(1, ...(ngDevMode ? [{ debugName: "currentPage" }] : []));
@@ -9384,14 +9389,17 @@ class MetadataColumnAutofillModal {
         return all.slice(start, start + this.pageSize);
     }, ...(ngDevMode ? [{ debugName: "paginatedSampleNumbers" }] : []));
     sourceNameColumn = computed(() => {
-        return this.config.allColumns?.find(c => c.name === 'source name');
+        return this.config.allColumns?.find(c => c.name.toLowerCase() === 'source name');
     }, ...(ngDevMode ? [{ debugName: "sourceNameColumn" }] : []));
     assayNameColumn = computed(() => {
-        return this.config.allColumns?.find(c => c.name === 'assay name');
+        return this.config.allColumns?.find(c => c.name.toLowerCase() === 'assay name');
     }, ...(ngDevMode ? [{ debugName: "assayNameColumn" }] : []));
     fractionIdentifierColumn = computed(() => {
-        return this.config.allColumns?.find(c => c.name === 'comment[fraction identifier]');
+        return this.config.allColumns?.find(c => c.name.toLowerCase() === 'comment[fraction identifier]');
     }, ...(ngDevMode ? [{ debugName: "fractionIdentifierColumn" }] : []));
+    labelColumn = computed(() => {
+        return this.config.allColumns?.find(c => c.name.toLowerCase() === 'comment[label]');
+    }, ...(ngDevMode ? [{ debugName: "labelColumn" }] : []));
     previewValues = computed(() => {
         const mode = this.fillMode();
         const indices = this.sampleIndices();
@@ -9418,15 +9426,13 @@ class MetadataColumnAutofillModal {
             }));
         }
     }, ...(ngDevMode ? [{ debugName: "previewValues" }] : []));
-    constructor(fb, activeModal) {
+    constructor(fb) {
         this.fb = fb;
-        this.activeModal = activeModal;
         this.autofillForm = this.fb.group({
             fillMode: ['template'],
             template: ['run {sample_index}', [Validators.required]],
             rangeStart: [1],
             rangeIncrement: [1],
-            applyToSelection: [true],
             selectedIndices: [[]]
         });
     }
@@ -9436,15 +9442,6 @@ class MetadataColumnAutofillModal {
             : Array.from({ length: this.config.sampleCount }, (_, i) => i + 1);
         this.sampleIndices.set(indices);
         this.autofillForm.patchValue({ selectedIndices: indices });
-        this.autofillForm.get('template')?.valueChanges.subscribe(() => {
-            this.previewValues();
-        });
-        this.autofillForm.get('rangeStart')?.valueChanges.subscribe(() => {
-            this.previewValues();
-        });
-        this.autofillForm.get('rangeIncrement')?.valueChanges.subscribe(() => {
-            this.previewValues();
-        });
     }
     generateValue(template, sampleIndex) {
         return template
@@ -9504,7 +9501,7 @@ class MetadataColumnAutofillModal {
         return false;
     }
     onSubmit() {
-        if (this.autofillForm.invalid || this.isSubmitting()) {
+        if (this.autofillForm.invalid) {
             return;
         }
         const indices = this.sampleIndices();
@@ -9528,15 +9525,12 @@ class MetadataColumnAutofillModal {
                 value: (startValue + (i * increment)).toString()
             }));
         }
-        this.activeModal.close({
+        this.submit.emit({
             fillMode: mode,
             sampleIndices: indices,
             values
         });
     }
-    close() {
-        this.activeModal.dismiss('cancel');
-    }
     useTemplate(template) {
         this.autofillForm.patchValue({ template });
     }
@@ -9544,15 +9538,217 @@ class MetadataColumnAutofillModal {
         const field = this.autofillForm.get(fieldName);
         return !!(field && field.invalid && field.touched);
     }
-    Array = Array;
     Math = Math;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: MetadataColumnAutofillModal, deps: [{ token: i1.FormBuilder }, { token: i2.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: MetadataColumnAutofillModal, isStandalone: true, selector: "ccv-metadata-column-autofill-modal", inputs: { config: "config" }, ngImport: i0, template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-magic me-2\"></i>Auto-fill Column Values\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"close()\"></button>\n</div>\n\n<div class=\"modal-body\">\n  <form [formGroup]=\"autofillForm\">\n    <div class=\"row\">\n      <div class=\"col-12 mb-3\">\n        <div class=\"alert alert-info\">\n          <i class=\"bi bi-info-circle me-2\"></i>\n          <strong>Column:</strong> {{ config.column.displayName || config.column.name }} ({{ config.column.type }})\n        </div>\n      </div>\n\n      <div class=\"col-12 mb-3\">\n        <label class=\"form-label\">Fill Mode</label>\n        <div class=\"btn-group w-100\">\n          <button\n            type=\"button\"\n            class=\"btn\"\n            [class.btn-primary]=\"fillMode() === 'template'\"\n            [class.btn-outline-secondary]=\"fillMode() !== 'template'\"\n            (click)=\"fillMode.set('template'); autofillForm.patchValue({ fillMode: 'template' })\"\n          >\n            <i class=\"bi bi-code-square me-1\"></i>Template\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn\"\n            [class.btn-primary]=\"fillMode() === 'range'\"\n            [class.btn-outline-secondary]=\"fillMode() !== 'range'\"\n            (click)=\"fillMode.set('range'); autofillForm.patchValue({ fillMode: 'range' })\"\n          >\n            <i class=\"bi bi-123 me-1\"></i>Numeric Range\n          </button>\n        </div>\n      </div>\n\n      @if (fillMode() === 'template') {\n        <div class=\"col-12 mb-3\">\n          <label for=\"template\" class=\"form-label\">\n            Value Template *\n          </label>\n          <input\n            type=\"text\"\n            id=\"template\"\n            class=\"form-control\"\n            formControlName=\"template\"\n            placeholder=\"run {sample_index}\"\n            [class.is-invalid]=\"isFieldInvalid('template')\"\n          />\n          @if (isFieldInvalid('template')) {\n            <div class=\"invalid-feedback\">Template is required</div>\n          }\n          <div class=\"form-text\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Use <code>{{ '{' }}sample_index{{ '}' }}</code>, <code>{{ '{' }}index{{ '}' }}</code>, or <code>{{ '{' }}n{{ '}' }}</code> as placeholder for sample number.\n          </div>\n        </div>\n\n        <div class=\"col-12 mb-3\">\n          <label class=\"form-label\">Quick Templates</label>\n          <div class=\"d-flex flex-wrap gap-2\">\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('run {sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>run {{ '{' }}n{{ '}' }}\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('sample_{sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>sample_{{ '{' }}n{{ '}' }}\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('assay {sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>assay {{ '{' }}n{{ '}' }}\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('replicate_{sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>replicate_{{ '{' }}n{{ '}' }}\n            </button>\n          </div>\n        </div>\n      }\n\n      @if (fillMode() === 'range') {\n        <div class=\"col-12 mb-3\">\n          <div class=\"row\">\n            <div class=\"col-6\">\n              <label for=\"rangeStart\" class=\"form-label\">\n                Start Value *\n              </label>\n              <input\n                type=\"number\"\n                id=\"rangeStart\"\n                class=\"form-control\"\n                formControlName=\"rangeStart\"\n                placeholder=\"1\"\n                [class.is-invalid]=\"isFieldInvalid('rangeStart')\"\n              />\n              @if (isFieldInvalid('rangeStart')) {\n                <div class=\"invalid-feedback\">Start value is required</div>\n              }\n              <div class=\"form-text\">\n                <i class=\"bi bi-info-circle me-1\"></i>\n                First value in the sequence\n              </div>\n            </div>\n            <div class=\"col-6\">\n              <label for=\"rangeIncrement\" class=\"form-label\">\n                Increment *\n              </label>\n              <input\n                type=\"number\"\n                id=\"rangeIncrement\"\n                class=\"form-control\"\n                formControlName=\"rangeIncrement\"\n                placeholder=\"1\"\n                [class.is-invalid]=\"isFieldInvalid('rangeIncrement')\"\n              />\n              @if (isFieldInvalid('rangeIncrement')) {\n                <div class=\"invalid-feedback\">Increment is required</div>\n              }\n              <div class=\"form-text\">\n                <i class=\"bi bi-info-circle me-1\"></i>\n                Step between values\n              </div>\n            </div>\n          </div>\n        </div>\n      }\n\n      <div class=\"col-12 mb-3\">\n        <div class=\"d-flex justify-content-between align-items-center mb-2\">\n          <label class=\"form-label mb-0\">\n            Apply to Samples <span class=\"text-muted\">({{ sampleIndices().length }} of {{ config.sampleCount }} selected)</span>\n          </label>\n          <div class=\"btn-group btn-group-sm\">\n            <button\n              type=\"button\"\n              class=\"btn btn-outline-primary\"\n              (click)=\"selectAllSamples()\"\n              title=\"Select All\"\n            >\n              <i class=\"bi bi-check-all\"></i>\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-outline-secondary\"\n              (click)=\"clearSelection()\"\n              title=\"Clear Selection\"\n            >\n              <i class=\"bi bi-x\"></i>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"table-responsive\">\n          <table class=\"table table-sm table-hover\">\n            <thead>\n              <tr>\n                <th style=\"width: 50px;\">\n                  <input\n                    type=\"checkbox\"\n                    class=\"form-check-input\"\n                    [checked]=\"sampleIndices().length === config.sampleCount\"\n                    [indeterminate]=\"sampleIndices().length > 0 && sampleIndices().length < config.sampleCount\"\n                    (change)=\"sampleIndices().length === config.sampleCount ? clearSelection() : selectAllSamples()\"\n                  />\n                </th>\n                <th style=\"width: 80px;\">Sample</th>\n                <th>Source Name</th>\n                <th>Assay Name</th>\n                <th>Fraction Identifier</th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (i of paginatedSampleNumbers(); track i) {\n                <tr\n                  [class.table-active]=\"isSampleSelected(i)\"\n                  (click)=\"toggleSample(i)\"\n                  style=\"cursor: pointer;\"\n                >\n                  <td>\n                    <input\n                      type=\"checkbox\"\n                      class=\"form-check-input\"\n                      [checked]=\"isSampleSelected(i)\"\n                      (click)=\"$event.stopPropagation()\"\n                      (change)=\"toggleSample(i)\"\n                    />\n                  </td>\n                  <td class=\"fw-semibold\">{{ i }}</td>\n                  <td>{{ getColumnValueForSample(sourceNameColumn(), i) || '-' }}</td>\n                  <td>{{ getColumnValueForSample(assayNameColumn(), i) || '-' }}</td>\n                  <td>{{ getColumnValueForSample(fractionIdentifierColumn(), i) || '-' }}</td>\n                </tr>\n              }\n            </tbody>\n          </table>\n        </div>\n\n        @if (config.sampleCount > pageSize) {\n          <div class=\"d-flex justify-content-between align-items-center mt-2\">\n            <small class=\"text-muted\">\n              Showing {{ (currentPage() - 1) * pageSize + 1 }}-{{ Math.min(currentPage() * pageSize, config.sampleCount) }} of {{ config.sampleCount }}\n            </small>\n            <ngb-pagination\n              [collectionSize]=\"config.sampleCount\"\n              [page]=\"currentPage()\"\n              [pageSize]=\"pageSize\"\n              [maxSize]=\"3\"\n              [boundaryLinks]=\"true\"\n              (pageChange)=\"onPageChange($event)\"\n              size=\"sm\"\n            ></ngb-pagination>\n          </div>\n        }\n\n        <div class=\"form-text\">\n          <i class=\"bi bi-info-circle me-1\"></i>\n          Select samples to apply auto-fill. Auto-fill will only apply to selected samples.\n        </div>\n      </div>\n\n      <div class=\"col-12\">\n        <label class=\"form-label\">\n          Preview\n          @if (previewValues().length > 0) {\n            <span class=\"text-muted\">(Showing {{ Math.min(10, previewValues().length) }} of {{ previewValues().length }})</span>\n          }\n        </label>\n\n        @if (previewValues().length === 0) {\n          <div class=\"alert alert-warning\">\n            <i class=\"bi bi-exclamation-triangle me-2\"></i>\n            No samples selected. Please select at least one sample.\n          </div>\n        } @else {\n          <div class=\"preview-list\">\n            @for (item of previewValues().slice(0, 10); track item.index) {\n              <div class=\"preview-item\">\n                <span class=\"badge bg-secondary me-2\">Sample {{ item.index }}</span>\n                <span class=\"preview-value\">{{ item.value }}</span>\n              </div>\n            }\n            @if (previewValues().length > 10) {\n              <div class=\"preview-item text-muted\">\n                <i class=\"bi bi-three-dots\"></i>\n                and {{ previewValues().length - 10 }} more...\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </form>\n</div>\n\n<div class=\"modal-footer\">\n  <button\n    type=\"button\"\n    class=\"btn btn-outline-secondary\"\n    (click)=\"close()\"\n    [disabled]=\"isSubmitting()\"\n  >\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]=\"autofillForm.invalid || sampleIndices().length === 0 || isSubmitting()\"\n  >\n    @if (isSubmitting()) {\n      <span class=\"spinner-border spinner-border-sm me-2\"></span>\n    }\n    <i class=\"bi bi-magic me-1\"></i>\n    Apply Auto-fill\n  </button>\n</div>\n", styles: [".table-responsive{max-height:400px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius)}.table-responsive table{margin-bottom:0}.table-responsive table thead{position:sticky;top:0;background-color:var(--bs-tertiary-bg);z-index:1}.table-responsive table thead th{border-bottom:2px solid var(--bs-border-color);font-weight:600;font-size:.875rem;padding:.75rem}.table-responsive table tbody tr:hover{background-color:var(--bs-secondary-bg)}.table-responsive table tbody tr.table-active{background-color:var(--bs-primary-bg-subtle)}.table-responsive table tbody tr.table-active:hover{background-color:var(--bs-primary-bg-subtle);filter:brightness(.95)}.table-responsive table tbody td{font-size:.875rem;vertical-align:middle;padding:.75rem}.preview-list{max-height:250px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius);padding:.75rem;background-color:var(--bs-tertiary-bg)}.preview-item{padding:.5rem .75rem;margin-bottom:.5rem;background-color:var(--bs-body-bg);border-radius:var(--bs-border-radius);display:flex;align-items:center;border:1px solid var(--bs-border-color)}.preview-item:last-child{margin-bottom:0}.preview-value{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-weight:500;color:var(--bs-body-color)}\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.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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { 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: NgbPaginationModule }, { kind: "component", type: i2.NgbPagination, selector: "ngb-pagination", inputs: ["disabled", "boundaryLinks", "directionLinks", "ellipses", "rotate", "collectionSize", "maxSize", "page", "pageSize", "size"], outputs: ["pageChange"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: BasicAutofillComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: BasicAutofillComponent, isStandalone: true, selector: "ccv-basic-autofill", inputs: { config: "config" }, outputs: { submit: "submit" }, ngImport: i0, template: "<form [formGroup]=\"autofillForm\">\n  <div class=\"row\">\n    <div class=\"col-12 mb-3\">\n      <div class=\"alert alert-info\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        <strong>Column:</strong> {{ config.column.displayName || config.column.name }} ({{ config.column.type }})\n      </div>\n    </div>\n\n    <div class=\"col-12 mb-3\">\n      <label class=\"form-label\">Fill Mode</label>\n      <div class=\"btn-group w-100\">\n        <button\n          type=\"button\"\n          class=\"btn\"\n          [class.btn-primary]=\"fillMode() === 'template'\"\n          [class.btn-outline-secondary]=\"fillMode() !== 'template'\"\n          (click)=\"fillMode.set('template'); autofillForm.patchValue({ fillMode: 'template' })\"\n        >\n          <i class=\"bi bi-code-square me-1\"></i>Template\n        </button>\n        <button\n          type=\"button\"\n          class=\"btn\"\n          [class.btn-primary]=\"fillMode() === 'range'\"\n          [class.btn-outline-secondary]=\"fillMode() !== 'range'\"\n          (click)=\"fillMode.set('range'); autofillForm.patchValue({ fillMode: 'range' })\"\n        >\n          <i class=\"bi bi-123 me-1\"></i>Numeric Range\n        </button>\n      </div>\n    </div>\n\n    @if (fillMode() === 'template') {\n      <div class=\"col-12 mb-3\">\n        <label for=\"template\" class=\"form-label\">\n          Value Template *\n        </label>\n        <input\n          type=\"text\"\n          id=\"template\"\n          class=\"form-control\"\n          formControlName=\"template\"\n          placeholder=\"run {sample_index}\"\n          [class.is-invalid]=\"isFieldInvalid('template')\"\n        />\n        @if (isFieldInvalid('template')) {\n          <div class=\"invalid-feedback\">Template is required</div>\n        }\n        <div class=\"form-text\">\n          <i class=\"bi bi-info-circle me-1\"></i>\n          Use <code>{{ '{' }}sample_index{{ '}' }}</code>, <code>{{ '{' }}index{{ '}' }}</code>, or <code>{{ '{' }}n{{ '}' }}</code> as placeholder for sample number.\n        </div>\n      </div>\n\n      <div class=\"col-12 mb-3\">\n        <label class=\"form-label\">Quick Templates</label>\n        <div class=\"d-flex flex-wrap gap-2\">\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('run {sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>run {{ '{' }}n{{ '}' }}\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('sample_{sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>sample_{{ '{' }}n{{ '}' }}\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('assay {sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>assay {{ '{' }}n{{ '}' }}\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('replicate_{sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>replicate_{{ '{' }}n{{ '}' }}\n          </button>\n        </div>\n      </div>\n    }\n\n    @if (fillMode() === 'range') {\n      <div class=\"col-12 mb-3\">\n        <div class=\"row\">\n          <div class=\"col-6\">\n            <label for=\"rangeStart\" class=\"form-label\">\n              Start Value *\n            </label>\n            <input\n              type=\"number\"\n              id=\"rangeStart\"\n              class=\"form-control\"\n              formControlName=\"rangeStart\"\n              placeholder=\"1\"\n              [class.is-invalid]=\"isFieldInvalid('rangeStart')\"\n            />\n            @if (isFieldInvalid('rangeStart')) {\n              <div class=\"invalid-feedback\">Start value is required</div>\n            }\n            <div class=\"form-text\">\n              <i class=\"bi bi-info-circle me-1\"></i>\n              First value in the sequence\n            </div>\n          </div>\n          <div class=\"col-6\">\n            <label for=\"rangeIncrement\" class=\"form-label\">\n              Increment *\n            </label>\n            <input\n              type=\"number\"\n              id=\"rangeIncrement\"\n              class=\"form-control\"\n              formControlName=\"rangeIncrement\"\n              placeholder=\"1\"\n              [class.is-invalid]=\"isFieldInvalid('rangeIncrement')\"\n            />\n            @if (isFieldInvalid('rangeIncrement')) {\n              <div class=\"invalid-feedback\">Increment is required</div>\n            }\n            <div class=\"form-text\">\n              <i class=\"bi bi-info-circle me-1\"></i>\n              Step between values\n            </div>\n          </div>\n        </div>\n      </div>\n    }\n\n    <div class=\"col-12 mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <label class=\"form-label mb-0\">\n          Apply to Samples <span class=\"text-muted\">({{ sampleIndices().length }} of {{ config.sampleCount }} selected)</span>\n        </label>\n        <div class=\"btn-group btn-group-sm\">\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-primary\"\n            (click)=\"selectAllSamples()\"\n            title=\"Select All\"\n          >\n            <i class=\"bi bi-check-all\"></i>\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"clearSelection()\"\n            title=\"Clear Selection\"\n          >\n            <i class=\"bi bi-x\"></i>\n          </button>\n        </div>\n      </div>\n\n      <div class=\"table-responsive\">\n        <table class=\"table table-sm table-hover\">\n          <thead>\n            <tr>\n              <th style=\"width: 50px;\">\n                <input\n                  type=\"checkbox\"\n                  class=\"form-check-input\"\n                  [checked]=\"sampleIndices().length === config.sampleCount\"\n                  [indeterminate]=\"sampleIndices().length > 0 && sampleIndices().length < config.sampleCount\"\n                  (change)=\"sampleIndices().length === config.sampleCount ? clearSelection() : selectAllSamples()\"\n                />\n              </th>\n              <th style=\"width: 80px;\">Sample</th>\n              <th>{{ sourceNameColumn()?.displayName || sourceNameColumn()?.name || 'Source Name' }}</th>\n              <th>{{ assayNameColumn()?.displayName || assayNameColumn()?.name || 'Assay Name' }}</th>\n              <th>{{ labelColumn()?.displayName || labelColumn()?.name || 'Label' }}</th>\n              <th>{{ fractionIdentifierColumn()?.displayName || fractionIdentifierColumn()?.name || 'Fraction Identifier' }}</th>\n            </tr>\n          </thead>\n          <tbody>\n            @for (i of paginatedSampleNumbers(); track i) {\n              <tr\n                [class.table-active]=\"isSampleSelected(i)\"\n                (click)=\"toggleSample(i)\"\n                style=\"cursor: pointer;\"\n              >\n                <td>\n                  <input\n                    type=\"checkbox\"\n                    class=\"form-check-input\"\n                    [checked]=\"isSampleSelected(i)\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"toggleSample(i)\"\n                  />\n                </td>\n                <td class=\"fw-semibold\">{{ i }}</td>\n                <td>{{ getColumnValueForSample(sourceNameColumn(), i) || '-' }}</td>\n                <td>{{ getColumnValueForSample(assayNameColumn(), i) || '-' }}</td>\n                <td>{{ getColumnValueForSample(labelColumn(), i) || '-' }}</td>\n                <td>{{ getColumnValueForSample(fractionIdentifierColumn(), i) || '-' }}</td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n\n      @if (config.sampleCount > pageSize) {\n        <div class=\"d-flex justify-content-between align-items-center mt-2\">\n          <small class=\"text-muted\">\n            Showing {{ (currentPage() - 1) * pageSize + 1 }}-{{ Math.min(currentPage() * pageSize, config.sampleCount) }} of {{ config.sampleCount }}\n          </small>\n          <ngb-pagination\n            [collectionSize]=\"config.sampleCount\"\n            [page]=\"currentPage()\"\n            [pageSize]=\"pageSize\"\n            [maxSize]=\"3\"\n            [boundaryLinks]=\"true\"\n            (pageChange)=\"onPageChange($event)\"\n            size=\"sm\"\n          ></ngb-pagination>\n        </div>\n      }\n\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        Select samples to apply auto-fill. Auto-fill will only apply to selected samples.\n      </div>\n    </div>\n\n    <div class=\"col-12\">\n      <label class=\"form-label\">\n        Preview\n        @if (previewValues().length > 0) {\n          <span class=\"text-muted\">(Showing {{ Math.min(10, previewValues().length) }} of {{ previewValues().length }})</span>\n        }\n      </label>\n\n      @if (previewValues().length === 0) {\n        <div class=\"alert alert-warning\">\n          <i class=\"bi bi-exclamation-triangle me-2\"></i>\n          No samples selected. Please select at least one sample.\n        </div>\n      } @else {\n        <div class=\"preview-list\">\n          @for (item of previewValues().slice(0, 10); track item.index) {\n            <div class=\"preview-item\">\n              <span class=\"badge bg-secondary me-2\">Sample {{ item.index }}</span>\n              <span class=\"preview-value\">{{ item.value }}</span>\n            </div>\n          }\n          @if (previewValues().length > 10) {\n            <div class=\"preview-item text-muted\">\n              <i class=\"bi bi-three-dots\"></i>\n              and {{ previewValues().length - 10 }} more...\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n</form>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { 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: NgbPaginationModule }, { kind: "component", type: i2.NgbPagination, selector: "ngb-pagination", inputs: ["disabled", "boundaryLinks", "directionLinks", "ellipses", "rotate", "collectionSize", "maxSize", "page", "pageSize", "size"], outputs: ["pageChange"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: BasicAutofillComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ccv-basic-autofill', standalone: true, imports: [CommonModule, ReactiveFormsModule, NgbPaginationModule], template: "<form [formGroup]=\"autofillForm\">\n  <div class=\"row\">\n    <div class=\"col-12 mb-3\">\n      <div class=\"alert alert-info\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        <strong>Column:</strong> {{ config.column.displayName || config.column.name }} ({{ config.column.type }})\n      </div>\n    </div>\n\n    <div class=\"col-12 mb-3\">\n      <label class=\"form-label\">Fill Mode</label>\n      <div class=\"btn-group w-100\">\n        <button\n          type=\"button\"\n          class=\"btn\"\n          [class.btn-primary]=\"fillMode() === 'template'\"\n          [class.btn-outline-secondary]=\"fillMode() !== 'template'\"\n          (click)=\"fillMode.set('template'); autofillForm.patchValue({ fillMode: 'template' })\"\n        >\n          <i class=\"bi bi-code-square me-1\"></i>Template\n        </button>\n        <button\n          type=\"button\"\n          class=\"btn\"\n          [class.btn-primary]=\"fillMode() === 'range'\"\n          [class.btn-outline-secondary]=\"fillMode() !== 'range'\"\n          (click)=\"fillMode.set('range'); autofillForm.patchValue({ fillMode: 'range' })\"\n        >\n          <i class=\"bi bi-123 me-1\"></i>Numeric Range\n        </button>\n      </div>\n    </div>\n\n    @if (fillMode() === 'template') {\n      <div class=\"col-12 mb-3\">\n        <label for=\"template\" class=\"form-label\">\n          Value Template *\n        </label>\n        <input\n          type=\"text\"\n          id=\"template\"\n          class=\"form-control\"\n          formControlName=\"template\"\n          placeholder=\"run {sample_index}\"\n          [class.is-invalid]=\"isFieldInvalid('template')\"\n        />\n        @if (isFieldInvalid('template')) {\n          <div class=\"invalid-feedback\">Template is required</div>\n        }\n        <div class=\"form-text\">\n          <i class=\"bi bi-info-circle me-1\"></i>\n          Use <code>{{ '{' }}sample_index{{ '}' }}</code>, <code>{{ '{' }}index{{ '}' }}</code>, or <code>{{ '{' }}n{{ '}' }}</code> as placeholder for sample number.\n        </div>\n      </div>\n\n      <div class=\"col-12 mb-3\">\n        <label class=\"form-label\">Quick Templates</label>\n        <div class=\"d-flex flex-wrap gap-2\">\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('run {sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>run {{ '{' }}n{{ '}' }}\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('sample_{sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>sample_{{ '{' }}n{{ '}' }}\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('assay {sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>assay {{ '{' }}n{{ '}' }}\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-sm btn-outline-secondary\"\n            (click)=\"useTemplate('replicate_{sample_index}')\"\n          >\n            <i class=\"bi bi-lightning me-1\"></i>replicate_{{ '{' }}n{{ '}' }}\n          </button>\n        </div>\n      </div>\n    }\n\n    @if (fillMode() === 'range') {\n      <div class=\"col-12 mb-3\">\n        <div class=\"row\">\n          <div class=\"col-6\">\n            <label for=\"rangeStart\" class=\"form-label\">\n              Start Value *\n            </label>\n            <input\n              type=\"number\"\n              id=\"rangeStart\"\n              class=\"form-control\"\n              formControlName=\"rangeStart\"\n              placeholder=\"1\"\n              [class.is-invalid]=\"isFieldInvalid('rangeStart')\"\n            />\n            @if (isFieldInvalid('rangeStart')) {\n              <div class=\"invalid-feedback\">Start value is required</div>\n            }\n            <div class=\"form-text\">\n              <i class=\"bi bi-info-circle me-1\"></i>\n              First value in the sequence\n            </div>\n          </div>\n          <div class=\"col-6\">\n            <label for=\"rangeIncrement\" class=\"form-label\">\n              Increment *\n            </label>\n            <input\n              type=\"number\"\n              id=\"rangeIncrement\"\n              class=\"form-control\"\n              formControlName=\"rangeIncrement\"\n              placeholder=\"1\"\n              [class.is-invalid]=\"isFieldInvalid('rangeIncrement')\"\n            />\n            @if (isFieldInvalid('rangeIncrement')) {\n              <div class=\"invalid-feedback\">Increment is required</div>\n            }\n            <div class=\"form-text\">\n              <i class=\"bi bi-info-circle me-1\"></i>\n              Step between values\n            </div>\n          </div>\n        </div>\n      </div>\n    }\n\n    <div class=\"col-12 mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <label class=\"form-label mb-0\">\n          Apply to Samples <span class=\"text-muted\">({{ sampleIndices().length }} of {{ config.sampleCount }} selected)</span>\n        </label>\n        <div class=\"btn-group btn-group-sm\">\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-primary\"\n            (click)=\"selectAllSamples()\"\n            title=\"Select All\"\n          >\n            <i class=\"bi bi-check-all\"></i>\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"clearSelection()\"\n            title=\"Clear Selection\"\n          >\n            <i class=\"bi bi-x\"></i>\n          </button>\n        </div>\n      </div>\n\n      <div class=\"table-responsive\">\n        <table class=\"table table-sm table-hover\">\n          <thead>\n            <tr>\n              <th style=\"width: 50px;\">\n                <input\n                  type=\"checkbox\"\n                  class=\"form-check-input\"\n                  [checked]=\"sampleIndices().length === config.sampleCount\"\n                  [indeterminate]=\"sampleIndices().length > 0 && sampleIndices().length < config.sampleCount\"\n                  (change)=\"sampleIndices().length === config.sampleCount ? clearSelection() : selectAllSamples()\"\n                />\n              </th>\n              <th style=\"width: 80px;\">Sample</th>\n              <th>{{ sourceNameColumn()?.displayName || sourceNameColumn()?.name || 'Source Name' }}</th>\n              <th>{{ assayNameColumn()?.displayName || assayNameColumn()?.name || 'Assay Name' }}</th>\n              <th>{{ labelColumn()?.displayName || labelColumn()?.name || 'Label' }}</th>\n              <th>{{ fractionIdentifierColumn()?.displayName || fractionIdentifierColumn()?.name || 'Fraction Identifier' }}</th>\n            </tr>\n          </thead>\n          <tbody>\n            @for (i of paginatedSampleNumbers(); track i) {\n              <tr\n                [class.table-active]=\"isSampleSelected(i)\"\n                (click)=\"toggleSample(i)\"\n                style=\"cursor: pointer;\"\n              >\n                <td>\n                  <input\n                    type=\"checkbox\"\n                    class=\"form-check-input\"\n                    [checked]=\"isSampleSelected(i)\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"toggleSample(i)\"\n                  />\n                </td>\n                <td class=\"fw-semibold\">{{ i }}</td>\n                <td>{{ getColumnValueForSample(sourceNameColumn(), i) || '-' }}</td>\n                <td>{{ getColumnValueForSample(assayNameColumn(), i) || '-' }}</td>\n                <td>{{ getColumnValueForSample(labelColumn(), i) || '-' }}</td>\n                <td>{{ getColumnValueForSample(fractionIdentifierColumn(), i) || '-' }}</td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n\n      @if (config.sampleCount > pageSize) {\n        <div class=\"d-flex justify-content-between align-items-center mt-2\">\n          <small class=\"text-muted\">\n            Showing {{ (currentPage() - 1) * pageSize + 1 }}-{{ Math.min(currentPage() * pageSize, config.sampleCount) }} of {{ config.sampleCount }}\n          </small>\n          <ngb-pagination\n            [collectionSize]=\"config.sampleCount\"\n            [page]=\"currentPage()\"\n            [pageSize]=\"pageSize\"\n            [maxSize]=\"3\"\n            [boundaryLinks]=\"true\"\n            (pageChange)=\"onPageChange($event)\"\n            size=\"sm\"\n          ></ngb-pagination>\n        </div>\n      }\n\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        Select samples to apply auto-fill. Auto-fill will only apply to selected samples.\n      </div>\n    </div>\n\n    <div class=\"col-12\">\n      <label class=\"form-label\">\n        Preview\n        @if (previewValues().length > 0) {\n          <span class=\"text-muted\">(Showing {{ Math.min(10, previewValues().length) }} of {{ previewValues().length }})</span>\n        }\n      </label>\n\n      @if (previewValues().length === 0) {\n        <div class=\"alert alert-warning\">\n          <i class=\"bi bi-exclamation-triangle me-2\"></i>\n          No samples selected. Please select at least one sample.\n        </div>\n      } @else {\n        <div class=\"preview-list\">\n          @for (item of previewValues().slice(0, 10); track item.index) {\n            <div class=\"preview-item\">\n              <span class=\"badge bg-secondary me-2\">Sample {{ item.index }}</span>\n              <span class=\"preview-value\">{{ item.value }}</span>\n            </div>\n          }\n          @if (previewValues().length > 10) {\n            <div class=\"preview-item text-muted\">\n              <i class=\"bi bi-three-dots\"></i>\n              and {{ previewValues().length - 10 }} more...\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n</form>\n" }]
+        }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { config: [{
+                type: Input
+            }], submit: [{
+                type: Output
+            }] } });
+
+class AdvancedAutofillComponent {
+    fb;
+    config;
+    submit = new EventEmitter();
+    advancedForm;
+    modalService = inject(NgbModal);
+    constructor(fb) {
+        this.fb = fb;
+        this.advancedForm = this.fb.group({
+            templateSamples: ['', [Validators.required]],
+            targetSampleCount: [null, [Validators.required, Validators.min(1)]],
+            fillStrategy: ['cartesian_product', [Validators.required]],
+            variations: this.fb.array([])
+        });
+    }
+    ngOnInit() {
+    }
+    get variations() {
+        return this.advancedForm.get('variations');
+    }
+    addVariation(type = 'range') {
+        const variationGroup = this.fb.group({
+            columnId: [null, [Validators.required]],
+            type: [type, [Validators.required]],
+            start: [1],
+            end: [10],
+            step: [1],
+            values: [''],
+            pattern: ['{i}'],
+            count: [10]
+        });
+        this.variations.push(variationGroup);
+    }
+    removeVariation(index) {
+        this.variations.removeAt(index);
+    }
+    getVariationType(index) {
+        return this.variations.at(index).get('type')?.value || 'range';
+    }
+    getSelectedColumn(index) {
+        const columnId = this.variations.at(index).get('columnId')?.value;
+        if (!columnId)
+            return undefined;
+        return this.config.allColumns?.find(col => col.id === columnId);
+    }
+    canOpenAutocomplete(index) {
+        const column = this.getSelectedColumn(index);
+        return !!(column?.enableTypeahead && column?.ontologyType);
+    }
+    openAutocompleteModal(index) {
+        const column = this.getSelectedColumn(index);
+        if (!column)
+            return;
+        const modalConfig = {
+            columnId: column.id,
+            columnName: column.displayName || column.name,
+            columnType: column.type,
+            ontologyType: column.ontologyType,
+            enableTypeahead: column.enableTypeahead,
+            currentValue: this.variations.at(index).get('values')?.value || '',
+            context: 'table',
+            tableId: this.config.metadataTableId
+        };
+        const modalRef = this.modalService.open(MetadataValueEditModal, {
+            size: 'lg',
+            backdrop: 'static'
+        });
+        modalRef.componentInstance.config = modalConfig;
+        modalRef.componentInstance.valueSaved.subscribe((value) => {
+            const currentValues = this.variations.at(index).get('values')?.value || '';
+            const valueArray = currentValues ? currentValues.split(',').map((v) => v.trim()).filter((v) => v) : [];
+            if (!valueArray.includes(value.trim())) {
+                valueArray.push(value.trim());
+            }
+            this.variations.at(index).get('values')?.setValue(valueArray.join(', '));
+            modalRef.close();
+        });
+    }
+    parseTemplateSamples(value) {
+        if (!value)
+            return [];
+        return value.split(',')
+            .map(v => v.trim())
+            .filter(v => v)
+            .flatMap(v => {
+            if (v.includes('-')) {
+                const [start, end] = v.split('-').map(n => parseInt(n.trim(), 10));
+                if (!isNaN(start) && !isNaN(end) && start <= end) {
+                    return Array.from({ length: end - start + 1 }, (_, i) => start + i);
+                }
+            }
+            else {
+                const num = parseInt(v, 10);
+                if (!isNaN(num))
+                    return [num];
+            }
+            return [];
+        });
+    }
+    onSubmit() {
+        if (this.advancedForm.invalid) {
+            return;
+        }
+        const formValue = this.advancedForm.value;
+        const templateSamples = this.parseTemplateSamples(formValue.templateSamples);
+        if (templateSamples.length === 0) {
+            return;
+        }
+        const variations = formValue.variations.map((v) => {
+            if (v.type === 'range') {
+                return {
+                    columnId: v.columnId,
+                    type: 'range',
+                    start: v.start,
+                    end: v.end,
+                    step: v.step || 1
+                };
+            }
+            else if (v.type === 'list') {
+                return {
+                    columnId: v.columnId,
+                    type: 'list',
+                    values: typeof v.values === 'string' ? v.values.split(',').map((s) => s.trim()) : v.values
+                };
+            }
+            else {
+                return {
+                    columnId: v.columnId,
+                    type: 'pattern',
+                    pattern: v.pattern,
+                    count: v.count
+                };
+            }
+        });
+        const request = {
+            templateSamples,
+            targetSampleCount: formValue.targetSampleCount,
+            variations,
+            fillStrategy: formValue.fillStrategy
+        };
+        this.submit.emit(request);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: AdvancedAutofillComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: AdvancedAutofillComponent, isStandalone: true, selector: "ccv-advanced-autofill", inputs: { config: "config" }, outputs: { submit: "submit" }, ngImport: i0, template: "<form [formGroup]=\"advancedForm\">\n  <div class=\"row\">\n    <div class=\"col-12 mb-3\">\n      <div class=\"alert alert-info\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        Advanced autofill allows you to generate complex sample variations using templates and multiple column variables.\n      </div>\n    </div>\n\n    <div class=\"col-md-6 mb-3\">\n      <label for=\"templateSamples\" class=\"form-label\">\n        Template Samples *\n      </label>\n      <input\n        type=\"text\"\n        id=\"templateSamples\"\n        class=\"form-control\"\n        formControlName=\"templateSamples\"\n        placeholder=\"1,2,3 or 1-5\"\n      />\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        Enter sample indices (e.g., \"1,2,3\" or \"1-5\")\n      </div>\n    </div>\n\n    <div class=\"col-md-6 mb-3\">\n      <label for=\"targetSampleCount\" class=\"form-label\">\n        Target Sample Count *\n      </label>\n      <input\n        type=\"number\"\n        id=\"targetSampleCount\"\n        class=\"form-control\"\n        formControlName=\"targetSampleCount\"\n        [max]=\"config.sampleCount\"\n        placeholder=\"Enter target count\"\n      />\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        Total samples to fill (max: {{ config.sampleCount }})\n      </div>\n    </div>\n\n    <div class=\"col-12 mb-3\">\n      <label for=\"fillStrategy\" class=\"form-label\">\n        Fill Strategy *\n      </label>\n      <select\n        id=\"fillStrategy\"\n        class=\"form-select\"\n        formControlName=\"fillStrategy\"\n      >\n        <option value=\"cartesian_product\">Cartesian Product (All Combinations)</option>\n        <option value=\"sequential\">Sequential (Cycle Each)</option>\n        <option value=\"interleaved\">Interleaved Pattern</option>\n      </select>\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        How variations are combined across samples\n      </div>\n    </div>\n\n    <div class=\"col-12 mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <label class=\"form-label mb-0\">\n          Column Variations\n        </label>\n        <div class=\"btn-group btn-group-sm\">\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-primary\"\n            (click)=\"addVariation('range')\"\n          >\n            <i class=\"bi bi-plus me-1\"></i>Range\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"addVariation('list')\"\n          >\n            <i class=\"bi bi-plus me-1\"></i>List\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-info\"\n            (click)=\"addVariation('pattern')\"\n          >\n            <i class=\"bi bi-plus me-1\"></i>Pattern\n          </button>\n        </div>\n      </div>\n\n      @if (variations.length === 0) {\n        <div class=\"alert alert-warning\">\n          <i class=\"bi bi-exclamation-triangle me-2\"></i>\n          No variations added. Click above to add column variations.\n        </div>\n      }\n\n      @for (variation of variations.controls; track $index) {\n        <div class=\"card mb-2\" [formGroupName]=\"$index\">\n          <div class=\"card-body\">\n            <div class=\"d-flex justify-content-between align-items-start mb-2\">\n              <h6 class=\"card-title mb-0\">Variation {{ $index + 1 }}</h6>\n              <button\n                type=\"button\"\n                class=\"btn btn-sm btn-outline-danger\"\n                (click)=\"removeVariation($index)\"\n              >\n                <i class=\"bi bi-trash\"></i>\n              </button>\n            </div>\n\n            <div class=\"row\">\n              <div class=\"col-md-6 mb-2\">\n                <label class=\"form-label\">Column *</label>\n                <select class=\"form-select\" formControlName=\"columnId\">\n                  <option [ngValue]=\"null\">Select Column</option>\n                  @for (col of config.allColumns || []; track col.id) {\n                    <option [ngValue]=\"col.id\">{{ col.displayName || col.name }}</option>\n                  }\n                </select>\n              </div>\n\n              <div class=\"col-md-6 mb-2\">\n                <label class=\"form-label\">Type *</label>\n                <select class=\"form-select\" formControlName=\"type\">\n                  <option value=\"range\">Range</option>\n                  <option value=\"list\">List</option>\n                  <option value=\"pattern\">Pattern</option>\n                </select>\n              </div>\n\n              @if (getVariationType($index) === 'range') {\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">Start</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"start\" />\n                </div>\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">End</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"end\" />\n                </div>\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">Step</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"step\" />\n                </div>\n              }\n\n              @if (getVariationType($index) === 'list') {\n                <div class=\"col-12 mb-2\">\n                  <label class=\"form-label\">\n                    Values (comma-separated)\n                    @if (canOpenAutocomplete($index)) {\n                      <span class=\"badge bg-success ms-2\">\n                        <i class=\"bi bi-search\"></i> Autocomplete Available\n                      </span>\n                    }\n                  </label>\n                  <div class=\"input-group\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"values\" placeholder=\"value1, value2, value3\" />\n                    @if (canOpenAutocomplete($index)) {\n                      <button\n                        type=\"button\"\n                        class=\"btn btn-outline-primary\"\n                        (click)=\"openAutocompleteModal($index)\"\n                        title=\"Open autocomplete search\">\n                        <i class=\"bi bi-search\"></i>\n                      </button>\n                    }\n                  </div>\n                  <div class=\"form-text\">\n                    @if (canOpenAutocomplete($index)) {\n                      <i class=\"bi bi-info-circle me-1\"></i>\n                      Enter values manually or use autocomplete search button\n                    } @else {\n                      <i class=\"bi bi-info-circle me-1\"></i>\n                      Enter comma-separated values\n                    }\n                  </div>\n                </div>\n              }\n\n              @if (getVariationType($index) === 'pattern') {\n                <div class=\"col-md-8 mb-2\">\n                  <label class=\"form-label\">Pattern</label>\n                  <input type=\"text\" class=\"form-control\" formControlName=\"pattern\" placeholder=\"sample_{{ '{' }}i{{ '}' }}\" />\n                  <div class=\"form-text\">Use {{ '{' }}i{{ '}' }} as placeholder</div>\n                </div>\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">Count</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"count\" />\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n</form>\n", styles: [""], 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { 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.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { 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: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: AdvancedAutofillComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ccv-advanced-autofill', standalone: true, imports: [CommonModule, ReactiveFormsModule], template: "<form [formGroup]=\"advancedForm\">\n  <div class=\"row\">\n    <div class=\"col-12 mb-3\">\n      <div class=\"alert alert-info\">\n        <i class=\"bi bi-info-circle me-2\"></i>\n        Advanced autofill allows you to generate complex sample variations using templates and multiple column variables.\n      </div>\n    </div>\n\n    <div class=\"col-md-6 mb-3\">\n      <label for=\"templateSamples\" class=\"form-label\">\n        Template Samples *\n      </label>\n      <input\n        type=\"text\"\n        id=\"templateSamples\"\n        class=\"form-control\"\n        formControlName=\"templateSamples\"\n        placeholder=\"1,2,3 or 1-5\"\n      />\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        Enter sample indices (e.g., \"1,2,3\" or \"1-5\")\n      </div>\n    </div>\n\n    <div class=\"col-md-6 mb-3\">\n      <label for=\"targetSampleCount\" class=\"form-label\">\n        Target Sample Count *\n      </label>\n      <input\n        type=\"number\"\n        id=\"targetSampleCount\"\n        class=\"form-control\"\n        formControlName=\"targetSampleCount\"\n        [max]=\"config.sampleCount\"\n        placeholder=\"Enter target count\"\n      />\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        Total samples to fill (max: {{ config.sampleCount }})\n      </div>\n    </div>\n\n    <div class=\"col-12 mb-3\">\n      <label for=\"fillStrategy\" class=\"form-label\">\n        Fill Strategy *\n      </label>\n      <select\n        id=\"fillStrategy\"\n        class=\"form-select\"\n        formControlName=\"fillStrategy\"\n      >\n        <option value=\"cartesian_product\">Cartesian Product (All Combinations)</option>\n        <option value=\"sequential\">Sequential (Cycle Each)</option>\n        <option value=\"interleaved\">Interleaved Pattern</option>\n      </select>\n      <div class=\"form-text\">\n        <i class=\"bi bi-info-circle me-1\"></i>\n        How variations are combined across samples\n      </div>\n    </div>\n\n    <div class=\"col-12 mb-3\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <label class=\"form-label mb-0\">\n          Column Variations\n        </label>\n        <div class=\"btn-group btn-group-sm\">\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-primary\"\n            (click)=\"addVariation('range')\"\n          >\n            <i class=\"bi bi-plus me-1\"></i>Range\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-secondary\"\n            (click)=\"addVariation('list')\"\n          >\n            <i class=\"bi bi-plus me-1\"></i>List\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn btn-outline-info\"\n            (click)=\"addVariation('pattern')\"\n          >\n            <i class=\"bi bi-plus me-1\"></i>Pattern\n          </button>\n        </div>\n      </div>\n\n      @if (variations.length === 0) {\n        <div class=\"alert alert-warning\">\n          <i class=\"bi bi-exclamation-triangle me-2\"></i>\n          No variations added. Click above to add column variations.\n        </div>\n      }\n\n      @for (variation of variations.controls; track $index) {\n        <div class=\"card mb-2\" [formGroupName]=\"$index\">\n          <div class=\"card-body\">\n            <div class=\"d-flex justify-content-between align-items-start mb-2\">\n              <h6 class=\"card-title mb-0\">Variation {{ $index + 1 }}</h6>\n              <button\n                type=\"button\"\n                class=\"btn btn-sm btn-outline-danger\"\n                (click)=\"removeVariation($index)\"\n              >\n                <i class=\"bi bi-trash\"></i>\n              </button>\n            </div>\n\n            <div class=\"row\">\n              <div class=\"col-md-6 mb-2\">\n                <label class=\"form-label\">Column *</label>\n                <select class=\"form-select\" formControlName=\"columnId\">\n                  <option [ngValue]=\"null\">Select Column</option>\n                  @for (col of config.allColumns || []; track col.id) {\n                    <option [ngValue]=\"col.id\">{{ col.displayName || col.name }}</option>\n                  }\n                </select>\n              </div>\n\n              <div class=\"col-md-6 mb-2\">\n                <label class=\"form-label\">Type *</label>\n                <select class=\"form-select\" formControlName=\"type\">\n                  <option value=\"range\">Range</option>\n                  <option value=\"list\">List</option>\n                  <option value=\"pattern\">Pattern</option>\n                </select>\n              </div>\n\n              @if (getVariationType($index) === 'range') {\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">Start</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"start\" />\n                </div>\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">End</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"end\" />\n                </div>\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">Step</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"step\" />\n                </div>\n              }\n\n              @if (getVariationType($index) === 'list') {\n                <div class=\"col-12 mb-2\">\n                  <label class=\"form-label\">\n                    Values (comma-separated)\n                    @if (canOpenAutocomplete($index)) {\n                      <span class=\"badge bg-success ms-2\">\n                        <i class=\"bi bi-search\"></i> Autocomplete Available\n                      </span>\n                    }\n                  </label>\n                  <div class=\"input-group\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"values\" placeholder=\"value1, value2, value3\" />\n                    @if (canOpenAutocomplete($index)) {\n                      <button\n                        type=\"button\"\n                        class=\"btn btn-outline-primary\"\n                        (click)=\"openAutocompleteModal($index)\"\n                        title=\"Open autocomplete search\">\n                        <i class=\"bi bi-search\"></i>\n                      </button>\n                    }\n                  </div>\n                  <div class=\"form-text\">\n                    @if (canOpenAutocomplete($index)) {\n                      <i class=\"bi bi-info-circle me-1\"></i>\n                      Enter values manually or use autocomplete search button\n                    } @else {\n                      <i class=\"bi bi-info-circle me-1\"></i>\n                      Enter comma-separated values\n                    }\n                  </div>\n                </div>\n              }\n\n              @if (getVariationType($index) === 'pattern') {\n                <div class=\"col-md-8 mb-2\">\n                  <label class=\"form-label\">Pattern</label>\n                  <input type=\"text\" class=\"form-control\" formControlName=\"pattern\" placeholder=\"sample_{{ '{' }}i{{ '}' }}\" />\n                  <div class=\"form-text\">Use {{ '{' }}i{{ '}' }} as placeholder</div>\n                </div>\n                <div class=\"col-md-4 mb-2\">\n                  <label class=\"form-label\">Count</label>\n                  <input type=\"number\" class=\"form-control\" formControlName=\"count\" />\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n</form>\n" }]
+        }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { config: [{
+                type: Input
+            }], submit: [{
+                type: Output
+            }] } });
+
+class MetadataColumnAutofillModal {
+    activeModal;
+    config;
+    activeTab = signal(1, ...(ngDevMode ? [{ debugName: "activeTab" }] : []));
+    basicConfig = signal(null, ...(ngDevMode ? [{ debugName: "basicConfig" }] : []));
+    advancedConfig = signal(null, ...(ngDevMode ? [{ debugName: "advancedConfig" }] : []));
+    constructor(activeModal) {
+        this.activeModal = activeModal;
+    }
+    ngOnInit() {
+        this.basicConfig.set({
+            column: this.config.column,
+            sampleCount: this.config.sampleCount,
+            selectedSampleIndices: this.config.selectedSampleIndices,
+            allColumns: this.config.allColumns
+        });
+        this.advancedConfig.set({
+            metadataTableId: this.config.metadataTableId,
+            sampleCount: this.config.sampleCount,
+            allColumns: this.config.allColumns
+        });
+    }
+    onBasicSubmit(result) {
+        this.activeModal.close({
+            mode: 'basic',
+            ...result
+        });
+    }
+    onAdvancedSubmit(request) {
+        this.activeModal.close({
+            mode: 'advanced',
+            request
+        });
+    }
+    close() {
+        this.activeModal.dismiss('cancel');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: MetadataColumnAutofillModal, deps: [{ token: i2.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: MetadataColumnAutofillModal, isStandalone: true, selector: "ccv-metadata-column-autofill-modal", inputs: { config: "config" }, ngImport: i0, template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-magic me-2\"></i>Auto-fill Column Values\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"close()\"></button>\n</div>\n\n<div class=\"modal-body\">\n  <ul ngbNav #nav=\"ngbNav\" [(activeId)]=\"activeTab\" class=\"nav-tabs mb-3\">\n    <li [ngbNavItem]=\"1\">\n      <button ngbNavLink>\n        <i class=\"bi bi-pencil me-1\"></i>Basic\n      </button>\n      <ng-template ngbNavContent>\n        @if (basicConfig()) {\n          <ccv-basic-autofill\n            [config]=\"basicConfig()!\"\n            (submit)=\"onBasicSubmit($event)\"\n          ></ccv-basic-autofill>\n        }\n      </ng-template>\n    </li>\n\n    <li [ngbNavItem]=\"2\">\n      <button ngbNavLink>\n        <i class=\"bi bi-gear me-1\"></i>Advanced\n      </button>\n      <ng-template ngbNavContent>\n        @if (advancedConfig()) {\n          <ccv-advanced-autofill\n            [config]=\"advancedConfig()!\"\n            (submit)=\"onAdvancedSubmit($event)\"\n          ></ccv-advanced-autofill>\n        }\n      </ng-template>\n    </li>\n  </ul>\n\n  <div [ngbNavOutlet]=\"nav\"></div>\n</div>\n\n<div class=\"modal-footer\">\n  <button\n    type=\"button\"\n    class=\"btn btn-outline-secondary\"\n    (click)=\"close()\"\n  >\n    <i class=\"bi bi-x-circle me-1\"></i>Cancel\n  </button>\n</div>\n", styles: [".table-responsive{max-height:400px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius)}.table-responsive table{margin-bottom:0}.table-responsive table thead{position:sticky;top:0;background-color:var(--bs-tertiary-bg);z-index:1}.table-responsive table thead th{border-bottom:2px solid var(--bs-border-color);font-weight:600;font-size:.875rem;padding:.75rem}.table-responsive table tbody tr:hover{background-color:var(--bs-secondary-bg)}.table-responsive table tbody tr.table-active{background-color:var(--bs-primary-bg-subtle)}.table-responsive table tbody tr.table-active:hover{background-color:var(--bs-primary-bg-subtle);filter:brightness(.95)}.table-responsive table tbody td{font-size:.875rem;vertical-align:middle;padding:.75rem}.preview-list{max-height:250px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius);padding:.75rem;background-color:var(--bs-tertiary-bg)}.preview-item{padding:.5rem .75rem;margin-bottom:.5rem;background-color:var(--bs-body-bg);border-radius:var(--bs-border-radius);display:flex;align-items:center;border:1px solid var(--bs-border-color)}.preview-item:last-child{margin-bottom:0}.preview-value{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-weight:500;color:var(--bs-body-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: NgbNavModule }, { 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: "component", type: BasicAutofillComponent, selector: "ccv-basic-autofill", inputs: ["config"], outputs: ["submit"] }, { kind: "component", type: AdvancedAutofillComponent, selector: "ccv-advanced-autofill", inputs: ["config"], outputs: ["submit"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: MetadataColumnAutofillModal, decorators: [{
             type: Component,
-            args: [{ selector: 'ccv-metadata-column-autofill-modal', standalone: true, imports: [CommonModule, ReactiveFormsModule, NgbPaginationModule], template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-magic me-2\"></i>Auto-fill Column Values\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"close()\"></button>\n</div>\n\n<div class=\"modal-body\">\n  <form [formGroup]=\"autofillForm\">\n    <div class=\"row\">\n      <div class=\"col-12 mb-3\">\n        <div class=\"alert alert-info\">\n          <i class=\"bi bi-info-circle me-2\"></i>\n          <strong>Column:</strong> {{ config.column.displayName || config.column.name }} ({{ config.column.type }})\n        </div>\n      </div>\n\n      <div class=\"col-12 mb-3\">\n        <label class=\"form-label\">Fill Mode</label>\n        <div class=\"btn-group w-100\">\n          <button\n            type=\"button\"\n            class=\"btn\"\n            [class.btn-primary]=\"fillMode() === 'template'\"\n            [class.btn-outline-secondary]=\"fillMode() !== 'template'\"\n            (click)=\"fillMode.set('template'); autofillForm.patchValue({ fillMode: 'template' })\"\n          >\n            <i class=\"bi bi-code-square me-1\"></i>Template\n          </button>\n          <button\n            type=\"button\"\n            class=\"btn\"\n            [class.btn-primary]=\"fillMode() === 'range'\"\n            [class.btn-outline-secondary]=\"fillMode() !== 'range'\"\n            (click)=\"fillMode.set('range'); autofillForm.patchValue({ fillMode: 'range' })\"\n          >\n            <i class=\"bi bi-123 me-1\"></i>Numeric Range\n          </button>\n        </div>\n      </div>\n\n      @if (fillMode() === 'template') {\n        <div class=\"col-12 mb-3\">\n          <label for=\"template\" class=\"form-label\">\n            Value Template *\n          </label>\n          <input\n            type=\"text\"\n            id=\"template\"\n            class=\"form-control\"\n            formControlName=\"template\"\n            placeholder=\"run {sample_index}\"\n            [class.is-invalid]=\"isFieldInvalid('template')\"\n          />\n          @if (isFieldInvalid('template')) {\n            <div class=\"invalid-feedback\">Template is required</div>\n          }\n          <div class=\"form-text\">\n            <i class=\"bi bi-info-circle me-1\"></i>\n            Use <code>{{ '{' }}sample_index{{ '}' }}</code>, <code>{{ '{' }}index{{ '}' }}</code>, or <code>{{ '{' }}n{{ '}' }}</code> as placeholder for sample number.\n          </div>\n        </div>\n\n        <div class=\"col-12 mb-3\">\n          <label class=\"form-label\">Quick Templates</label>\n          <div class=\"d-flex flex-wrap gap-2\">\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('run {sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>run {{ '{' }}n{{ '}' }}\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('sample_{sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>sample_{{ '{' }}n{{ '}' }}\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('assay {sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>assay {{ '{' }}n{{ '}' }}\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-sm btn-outline-secondary\"\n              (click)=\"useTemplate('replicate_{sample_index}')\"\n            >\n              <i class=\"bi bi-lightning me-1\"></i>replicate_{{ '{' }}n{{ '}' }}\n            </button>\n          </div>\n        </div>\n      }\n\n      @if (fillMode() === 'range') {\n        <div class=\"col-12 mb-3\">\n          <div class=\"row\">\n            <div class=\"col-6\">\n              <label for=\"rangeStart\" class=\"form-label\">\n                Start Value *\n              </label>\n              <input\n                type=\"number\"\n                id=\"rangeStart\"\n                class=\"form-control\"\n                formControlName=\"rangeStart\"\n                placeholder=\"1\"\n                [class.is-invalid]=\"isFieldInvalid('rangeStart')\"\n              />\n              @if (isFieldInvalid('rangeStart')) {\n                <div class=\"invalid-feedback\">Start value is required</div>\n              }\n              <div class=\"form-text\">\n                <i class=\"bi bi-info-circle me-1\"></i>\n                First value in the sequence\n              </div>\n            </div>\n            <div class=\"col-6\">\n              <label for=\"rangeIncrement\" class=\"form-label\">\n                Increment *\n              </label>\n              <input\n                type=\"number\"\n                id=\"rangeIncrement\"\n                class=\"form-control\"\n                formControlName=\"rangeIncrement\"\n                placeholder=\"1\"\n                [class.is-invalid]=\"isFieldInvalid('rangeIncrement')\"\n              />\n              @if (isFieldInvalid('rangeIncrement')) {\n                <div class=\"invalid-feedback\">Increment is required</div>\n              }\n              <div class=\"form-text\">\n                <i class=\"bi bi-info-circle me-1\"></i>\n                Step between values\n              </div>\n            </div>\n          </div>\n        </div>\n      }\n\n      <div class=\"col-12 mb-3\">\n        <div class=\"d-flex justify-content-between align-items-center mb-2\">\n          <label class=\"form-label mb-0\">\n            Apply to Samples <span class=\"text-muted\">({{ sampleIndices().length }} of {{ config.sampleCount }} selected)</span>\n          </label>\n          <div class=\"btn-group btn-group-sm\">\n            <button\n              type=\"button\"\n              class=\"btn btn-outline-primary\"\n              (click)=\"selectAllSamples()\"\n              title=\"Select All\"\n            >\n              <i class=\"bi bi-check-all\"></i>\n            </button>\n            <button\n              type=\"button\"\n              class=\"btn btn-outline-secondary\"\n              (click)=\"clearSelection()\"\n              title=\"Clear Selection\"\n            >\n              <i class=\"bi bi-x\"></i>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"table-responsive\">\n          <table class=\"table table-sm table-hover\">\n            <thead>\n              <tr>\n                <th style=\"width: 50px;\">\n                  <input\n                    type=\"checkbox\"\n                    class=\"form-check-input\"\n                    [checked]=\"sampleIndices().length === config.sampleCount\"\n                    [indeterminate]=\"sampleIndices().length > 0 && sampleIndices().length < config.sampleCount\"\n                    (change)=\"sampleIndices().length === config.sampleCount ? clearSelection() : selectAllSamples()\"\n                  />\n                </th>\n                <th style=\"width: 80px;\">Sample</th>\n                <th>Source Name</th>\n                <th>Assay Name</th>\n                <th>Fraction Identifier</th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (i of paginatedSampleNumbers(); track i) {\n                <tr\n                  [class.table-active]=\"isSampleSelected(i)\"\n                  (click)=\"toggleSample(i)\"\n                  style=\"cursor: pointer;\"\n                >\n                  <td>\n                    <input\n                      type=\"checkbox\"\n                      class=\"form-check-input\"\n                      [checked]=\"isSampleSelected(i)\"\n                      (click)=\"$event.stopPropagation()\"\n                      (change)=\"toggleSample(i)\"\n                    />\n                  </td>\n                  <td class=\"fw-semibold\">{{ i }}</td>\n                  <td>{{ getColumnValueForSample(sourceNameColumn(), i) || '-' }}</td>\n                  <td>{{ getColumnValueForSample(assayNameColumn(), i) || '-' }}</td>\n                  <td>{{ getColumnValueForSample(fractionIdentifierColumn(), i) || '-' }}</td>\n                </tr>\n              }\n            </tbody>\n          </table>\n        </div>\n\n        @if (config.sampleCount > pageSize) {\n          <div class=\"d-flex justify-content-between align-items-center mt-2\">\n            <small class=\"text-muted\">\n              Showing {{ (currentPage() - 1) * pageSize + 1 }}-{{ Math.min(currentPage() * pageSize, config.sampleCount) }} of {{ config.sampleCount }}\n            </small>\n            <ngb-pagination\n              [collectionSize]=\"config.sampleCount\"\n              [page]=\"currentPage()\"\n              [pageSize]=\"pageSize\"\n              [maxSize]=\"3\"\n              [boundaryLinks]=\"true\"\n              (pageChange)=\"onPageChange($event)\"\n              size=\"sm\"\n            ></ngb-pagination>\n          </div>\n        }\n\n        <div class=\"form-text\">\n          <i class=\"bi bi-info-circle me-1\"></i>\n          Select samples to apply auto-fill. Auto-fill will only apply to selected samples.\n        </div>\n      </div>\n\n      <div class=\"col-12\">\n        <label class=\"form-label\">\n          Preview\n          @if (previewValues().length > 0) {\n            <span class=\"text-muted\">(Showing {{ Math.min(10, previewValues().length) }} of {{ previewValues().length }})</span>\n          }\n        </label>\n\n        @if (previewValues().length === 0) {\n          <div class=\"alert alert-warning\">\n            <i class=\"bi bi-exclamation-triangle me-2\"></i>\n            No samples selected. Please select at least one sample.\n          </div>\n        } @else {\n          <div class=\"preview-list\">\n            @for (item of previewValues().slice(0, 10); track item.index) {\n              <div class=\"preview-item\">\n                <span class=\"badge bg-secondary me-2\">Sample {{ item.index }}</span>\n                <span class=\"preview-value\">{{ item.value }}</span>\n              </div>\n            }\n            @if (previewValues().length > 10) {\n              <div class=\"preview-item text-muted\">\n                <i class=\"bi bi-three-dots\"></i>\n                and {{ previewValues().length - 10 }} more...\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </form>\n</div>\n\n<div class=\"modal-footer\">\n  <button\n    type=\"button\"\n    class=\"btn btn-outline-secondary\"\n    (click)=\"close()\"\n    [disabled]=\"isSubmitting()\"\n  >\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]=\"autofillForm.invalid || sampleIndices().length === 0 || isSubmitting()\"\n  >\n    @if (isSubmitting()) {\n      <span class=\"spinner-border spinner-border-sm me-2\"></span>\n    }\n    <i class=\"bi bi-magic me-1\"></i>\n    Apply Auto-fill\n  </button>\n</div>\n", styles: [".table-responsive{max-height:400px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius)}.table-responsive table{margin-bottom:0}.table-responsive table thead{position:sticky;top:0;background-color:var(--bs-tertiary-bg);z-index:1}.table-responsive table thead th{border-bottom:2px solid var(--bs-border-color);font-weight:600;font-size:.875rem;padding:.75rem}.table-responsive table tbody tr:hover{background-color:var(--bs-secondary-bg)}.table-responsive table tbody tr.table-active{background-color:var(--bs-primary-bg-subtle)}.table-responsive table tbody tr.table-active:hover{background-color:var(--bs-primary-bg-subtle);filter:brightness(.95)}.table-responsive table tbody td{font-size:.875rem;vertical-align:middle;padding:.75rem}.preview-list{max-height:250px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius);padding:.75rem;background-color:var(--bs-tertiary-bg)}.preview-item{padding:.5rem .75rem;margin-bottom:.5rem;background-color:var(--bs-body-bg);border-radius:var(--bs-border-radius);display:flex;align-items:center;border:1px solid var(--bs-border-color)}.preview-item:last-child{margin-bottom:0}.preview-value{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-weight:500;color:var(--bs-body-color)}\n"] }]
-        }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.NgbActiveModal }], propDecorators: { config: [{
+            args: [{ selector: 'ccv-metadata-column-autofill-modal', standalone: true, imports: [CommonModule, NgbNavModule, BasicAutofillComponent, AdvancedAutofillComponent], template: "<div class=\"modal-header\">\n  <h4 class=\"modal-title\">\n    <i class=\"bi bi-magic me-2\"></i>Auto-fill Column Values\n  </h4>\n  <button type=\"button\" class=\"btn-close\" (click)=\"close()\"></button>\n</div>\n\n<div class=\"modal-body\">\n  <ul ngbNav #nav=\"ngbNav\" [(activeId)]=\"activeTab\" class=\"nav-tabs mb-3\">\n    <li [ngbNavItem]=\"1\">\n      <button ngbNavLink>\n        <i class=\"bi bi-pencil me-1\"></i>Basic\n      </button>\n      <ng-template ngbNavContent>\n        @if (basicConfig()) {\n          <ccv-basic-autofill\n            [config]=\"basicConfig()!\"\n            (submit)=\"onBasicSubmit($event)\"\n          ></ccv-basic-autofill>\n        }\n      </ng-template>\n    </li>\n\n    <li [ngbNavItem]=\"2\">\n      <button ngbNavLink>\n        <i class=\"bi bi-gear me-1\"></i>Advanced\n      </button>\n      <ng-template ngbNavContent>\n        @if (advancedConfig()) {\n          <ccv-advanced-autofill\n            [config]=\"advancedConfig()!\"\n            (submit)=\"onAdvancedSubmit($event)\"\n          ></ccv-advanced-autofill>\n        }\n      </ng-template>\n    </li>\n  </ul>\n\n  <div [ngbNavOutlet]=\"nav\"></div>\n</div>\n\n<div class=\"modal-footer\">\n  <button\n    type=\"button\"\n    class=\"btn btn-outline-secondary\"\n    (click)=\"close()\"\n  >\n    <i class=\"bi bi-x-circle me-1\"></i>Cancel\n  </button>\n</div>\n", styles: [".table-responsive{max-height:400px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius)}.table-responsive table{margin-bottom:0}.table-responsive table thead{position:sticky;top:0;background-color:var(--bs-tertiary-bg);z-index:1}.table-responsive table thead th{border-bottom:2px solid var(--bs-border-color);font-weight:600;font-size:.875rem;padding:.75rem}.table-responsive table tbody tr:hover{background-color:var(--bs-secondary-bg)}.table-responsive table tbody tr.table-active{background-color:var(--bs-primary-bg-subtle)}.table-responsive table tbody tr.table-active:hover{background-color:var(--bs-primary-bg-subtle);filter:brightness(.95)}.table-responsive table tbody td{font-size:.875rem;vertical-align:middle;padding:.75rem}.preview-list{max-height:250px;overflow-y:auto;border:1px solid var(--bs-border-color);border-radius:var(--bs-border-radius);padding:.75rem;background-color:var(--bs-tertiary-bg)}.preview-item{padding:.5rem .75rem;margin-bottom:.5rem;background-color:var(--bs-body-bg);border-radius:var(--bs-border-radius);display:flex;align-items:center;border:1px solid var(--bs-border-color)}.preview-item:last-child{margin-bottom:0}.preview-value{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-weight:500;color:var(--bs-body-color)}\n"] }]
+        }], ctorParameters: () => [{ type: i2.NgbActiveModal }], propDecorators: { config: [{
                 type: Input
             }] } });