techlify-inventory-common 18.1.0 → 18.3.0

package/fesm2022/techlify-inventory-common-product.module-BV9Cy88x.mjs

@@ -1,1168 +0,0 @@
-import * as i0 from '@angular/core';
-import { Inject, Component, Injectable, EventEmitter, Input, Output, NgModule } from '@angular/core';
-import * as i4 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import { __decorate } from 'tslib';
-import * as i2 from '@angular/forms';
-import { Validators, ReactiveFormsModule, FormsModule } from '@angular/forms';
-import * as i1 from '@angular/material/dialog';
-import { MAT_DIALOG_DATA } from '@angular/material/dialog';
-import { P as ProductService, S as StockSummaryService } from './techlify-inventory-common-techlify-inventory-common-GFYF7JCA.mjs';
-import * as i3 from 'ngx-spinner';
-import * as i1$1 from 'ngx-techlify-core';
-import { TechlifyServiceBaseClass, TechlifyFormComponentInterface, TechlifyListingControllerInterface, AuthenticationGuard, MaterialModule, SearchableSelectorModule, TimelineFilterModule, ImportCsvModule, ColumnSelectorModule } from 'ngx-techlify-core';
-import * as i7 from '@angular/material/button';
-import * as i6 from '@angular/material/form-field';
-import * as i7$1 from '@angular/material/input';
-import * as i10 from '@angular/flex-layout';
-import { FlexModule } from '@angular/flex-layout';
-import * as i6$1 from '@angular/material/table';
-import { MatTableDataSource } from '@angular/material/table';
-import { debounceTime } from 'rxjs/operators';
-import { untilDestroyed, UntilDestroy } from '@ngneat/until-destroy';
-import * as i2$1 from '@angular/router';
-import { RouterModule } from '@angular/router';
-import * as i3$1 from '@angular/material/icon';
-import * as i10$1 from '@angular/material/core';
-import * as i11 from '@angular/material/select';
-import * as i5 from '@angular/material/sort';
-import * as i10$2 from 'ngx-infinite-scroll';
-import { InfiniteScrollModule } from 'ngx-infinite-scroll';
-import moment from 'moment';
-import { T as TechlifyFormService } from './techlify-inventory-common-techlify-form-service-CiVfwYTS.mjs';
-import * as i9 from '@angular/material/datepicker';
-import { a as StockReceiptFormButtonComponent, S as StockReceiptFormModule } from './techlify-inventory-common-stock-receipt-form.module-DND0GNlf.mjs';
-import { c as StockIssueFormButtonComponent, S as StockIssuancesListComponent, a as StockIssueFormModule, b as StockIssuancesListModule } from './techlify-inventory-common-stock-issuances-list.module-Dt6gx-ji.mjs';
-import * as i3$2 from '@angular/material/card';
-import * as i2$2 from '@angular/material/tooltip';
-import * as i7$2 from '@angular/material/progress-bar';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import { S as StockReceiptsListPageComponent, a as StockReceiptsModule } from './techlify-inventory-common-stock-receipts.module-BvYaKITT.mjs';
-import * as i6$2 from '@angular/material/divider';
-
-const errorMessages$1 = {
-    title: {
-        required: "Please Enter Title",
-    },
-    description: {
-        required: "Please Enter Description",
-    },
-};
-class ProductMeasureFormComponent {
-    productService;
-    fb;
-    dialogRef;
-    data;
-    spinnerService;
-    formValidatorService;
-    errorService;
-    alertService;
-    productMeasureForm;
-    isWorking = false;
-    isUpdate = false;
-    constructor(productService, fb, dialogRef, data, spinnerService, formValidatorService, errorService, alertService) {
-        this.productService = productService;
-        this.fb = fb;
-        this.dialogRef = dialogRef;
-        this.data = data;
-        this.spinnerService = spinnerService;
-        this.formValidatorService = formValidatorService;
-        this.errorService = errorService;
-        this.alertService = alertService;
-        this.productMeasureForm = this.fb.group({
-            id: [""],
-            title: ["", Validators.compose([Validators.required])],
-            description: ["", Validators.compose([Validators.required])],
-        });
-    }
-    ngOnInit() {
-        if (this.data.details) {
-            this.isUpdate = true;
-            this.productMeasureForm.patchValue(this.data.details);
-        }
-    }
-    async save() {
-        if (!this.productMeasureForm.valid) {
-            this.alertService.addAlert("Please Fill All Required Fields", "warn");
-            this.productMeasureForm.markAllAsTouched();
-            return;
-        }
-        let productMeasure = this.productMeasureForm.value;
-        try {
-            this.spinnerService.show();
-            this.isWorking = true;
-            let result = this.isUpdate
-                ? await this.productService.updateProductMeasure(productMeasure)
-                : await this.productService.createProductMeasure(productMeasure);
-            this.dialogRef.close(result);
-        }
-        catch (error) {
-            this.errorService.handleError(error);
-        }
-        finally {
-            this.isWorking = false;
-            this.spinnerService.hide();
-        }
-    }
-    /**
-     * Method to evaluate form fields
-     */
-    isFieldValid(field) {
-        return this.formValidatorService.isFieldValid(field, this.productMeasureForm);
-    }
-    /**
-     * Method to find error in form fields
-     */
-    getErrorMessage(field) {
-        return this.formValidatorService.getErrorMessage(field, this.productMeasureForm, errorMessages$1);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductMeasureFormComponent, deps: [{ token: ProductService }, { token: i2.FormBuilder }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i3.NgxSpinnerService }, { token: i1$1.FormValidatorService }, { token: i1$1.ErrorHandlerService }, { token: i1$1.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductMeasureFormComponent, selector: "app-product-measure-form", ngImport: i0, template: "<div>\n  <form [formGroup]=\"productMeasureForm\" (ngSubmit)=\"save()\">\n    <h3 class=\"text-center\">Create/Update Product Measure</h3>\n    <div fxLayout=\"column\">\n      <div fxLayout=\"column\">\n        <mat-form-field>\n          <input\n            matInput\n            placeholder=\"Title\"\n            formControlName=\"title\"\n            required\n          />\n          <mat-error *ngIf=\"isFieldValid('title')\"\n            >{{ getErrorMessage(\"title\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field>\n          <input\n            matInput\n            placeholder=\"Description\"\n            formControlName=\"description\"\n            required\n          />\n          <mat-error *ngIf=\"isFieldValid('description')\"\n            >{{ getErrorMessage(\"description\") }}\n          </mat-error>\n        </mat-form-field>\n        <div fxFlex=\"100%\" fxLayout fxLayoutGap=\"1rem\">\n          <button\n            mat-button\n            class=\"mt-2\"\n            type=\"button\"\n            (click)=\"dialogRef.close()\"\n          >\n            Cancel\n          </button>\n          <button mat-raised-button color=\"primary\" class=\"mt-2\" type=\"submit\">\n            Save\n          </button>\n        </div>\n      </div>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i10.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductMeasureFormComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-measure-form", template: "<div>\n  <form [formGroup]=\"productMeasureForm\" (ngSubmit)=\"save()\">\n    <h3 class=\"text-center\">Create/Update Product Measure</h3>\n    <div fxLayout=\"column\">\n      <div fxLayout=\"column\">\n        <mat-form-field>\n          <input\n            matInput\n            placeholder=\"Title\"\n            formControlName=\"title\"\n            required\n          />\n          <mat-error *ngIf=\"isFieldValid('title')\"\n            >{{ getErrorMessage(\"title\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field>\n          <input\n            matInput\n            placeholder=\"Description\"\n            formControlName=\"description\"\n            required\n          />\n          <mat-error *ngIf=\"isFieldValid('description')\"\n            >{{ getErrorMessage(\"description\") }}\n          </mat-error>\n        </mat-form-field>\n        <div fxFlex=\"100%\" fxLayout fxLayoutGap=\"1rem\">\n          <button\n            mat-button\n            class=\"mt-2\"\n            type=\"button\"\n            (click)=\"dialogRef.close()\"\n          >\n            Cancel\n          </button>\n          <button mat-raised-button color=\"primary\" class=\"mt-2\" type=\"submit\">\n            Save\n          </button>\n        </div>\n      </div>\n    </div>\n  </form>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: ProductService }, { type: i2.FormBuilder }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [MAT_DIALOG_DATA]
-                }] }, { type: i3.NgxSpinnerService }, { type: i1$1.FormValidatorService }, { type: i1$1.ErrorHandlerService }, { type: i1$1.AlertService }] });
-
-let ProductMeasuresListComponent = class ProductMeasuresListComponent {
-    fb;
-    dialog;
-    filterService;
-    activatedRoute;
-    productService;
-    filterFormGroup;
-    lastPage;
-    page = 1;
-    perPage = 25;
-    totalItems = 0;
-    currentPage = 1;
-    num_items = 25;
-    routeFilters;
-    productMeasures = [];
-    columnDefinitions = [
-        { def: "#", isShow: true },
-        { def: "Title", isShow: true },
-        { def: "Description", isShow: true },
-        { def: "Actions", isShow: true },
-    ];
-    displayedColumns = ["#", "Title", "Description", "Actions"];
-    dataSource = new MatTableDataSource();
-    constructor(fb, dialog, filterService, activatedRoute, productService) {
-        this.fb = fb;
-        this.dialog = dialog;
-        this.filterService = filterService;
-        this.activatedRoute = activatedRoute;
-        this.productService = productService;
-        this.filterFormGroup = this.fb.group({
-            num_items: [this.num_items + "|" + this.currentPage],
-            search: [""],
-            type_ids: [""],
-            sort_by: [""],
-        });
-    }
-    ngOnInit() {
-        this.patchFiltersFromRoute();
-        this.listenForChanges();
-        this.loadData();
-    }
-    listenForChanges() {
-        this.filterFormGroup.valueChanges
-            .pipe(debounceTime(500), untilDestroyed(this))
-            .subscribe((changes) => {
-            this.filterService.applyFilterToRoute(this.activatedRoute, this.filterFormGroup.value);
-            this.reload();
-        });
-    }
-    patchFiltersFromRoute() {
-        this.routeFilters = this.filterService.getFiltersFromRoute(this.activatedRoute, this.filterFormGroup.value);
-        this.filterFormGroup.setValue(this.routeFilters);
-        if (this.routeFilters.type_ids) {
-            this.filterFormGroup
-                .get("type_ids")
-                .setValue(this.routeFilters.type_ids.split(",").map(Number));
-        }
-    }
-    async loadData() {
-        let filters = this.filterFormGroup.value;
-        filters.page = this.page;
-        filters.per_page = this.perPage;
-        filters.type_ids = filters.type_ids.toString();
-        filters.num_items = this.num_items + "|" + this.currentPage;
-        let res = await this.productService.getProductMeasures(filters);
-        if (this.productMeasures.length < 1) {
-            this.productMeasures = res.data;
-        }
-        else {
-            res.data.forEach((item) => this.productMeasures.push(item));
-        }
-        this.dataSource = new MatTableDataSource(this.productMeasures);
-        this.totalItems = res.total;
-        this.lastPage = res.last_page || this.page;
-    }
-    reload() {
-        this.productMeasures = [];
-        this.currentPage = 1;
-        this.loadData();
-    }
-    modifyProductMeasure(model) {
-        const dialogRef = this.dialog.open(ProductMeasureFormComponent, {
-            width: "600px",
-            data: {
-                details: model,
-            },
-        });
-        dialogRef.afterClosed().subscribe((result) => {
-            if (result) {
-                this.reload();
-            }
-        });
-    }
-    onScroll() {
-        if (this.totalItems > this.productMeasures.length) {
-            this.currentPage += 1;
-            this.loadData();
-        }
-    }
-    assignFilter(column, direction) {
-        if (column) {
-            return this.filterFormGroup
-                .get("sort_by")
-                ?.setValue(column + "|" + direction);
-        }
-    }
-    sortColumn(event) {
-        var direction = event.direction.toString().toUpperCase();
-        this.assignFilter(event.active, direction);
-    }
-    // eslint-disable-next-line @angular-eslint/use-lifecycle-interface
-    // eslint-disable-next-line @angular-eslint/no-empty-lifecycle-method
-    ngOnDestroy() {
-        //Called once, before the instance is destroyed.
-        //Add 'implements OnDestroy' to the class.
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductMeasuresListComponent, deps: [{ token: i2.FormBuilder }, { token: i1.MatDialog }, { token: i1$1.FilterService }, { token: i2$1.ActivatedRoute }, { token: ProductService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductMeasuresListComponent, selector: "app-product-measure-list", ngImport: i0, template: "<div fxLayout=\"column\">\n  <div class=\"text-center\" fxLayoutAlign=\"center center\">\n    <h3 fxLayout>\n      <span class=\"mt-1\"> Product Measures </span>\n      <button\n        mat-raised-button\n        class=\"ml-2\"\n        color=\"primary\"\n        (click)=\"modifyProductMeasure()\"\n      >\n        <mat-icon>add</mat-icon>\n        Product Measure\n      </button>\n    </h3>\n  </div>\n\n  <div fxLayout>\n    <form [formGroup]=\"filterFormGroup\" fxLayout fxLayoutGap=\"0.5rem\">\n      <mat-form-field>\n        <input\n          matInput\n          placeholder=\"Item Name, Description, etc.\"\n          formControlName=\"search\"\n        />\n      </mat-form-field>\n    </form>\n\n    <mat-form-field class=\"ml-2\" fxFlex=\"0 1 calc(11.11% - 0.5rem)\">\n      <mat-label>Columns</mat-label>\n      <mat-select [(ngModel)]=\"displayedColumns\" multiple name=\"column\">\n        <mat-option\n          *ngFor=\"let column of columnDefinitions\"\n          [value]=\"column.def\"\n          [disabled]=\"!column.isShow\"\n        >\n          {{ column?.def }}</mat-option\n        >\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <table\n    mat-table\n    #table\n    [dataSource]=\"dataSource\"\n    class=\"mat-elevation-z8 w-100 mt-4 table-hover\"\n    infiniteScroll\n    [infiniteScrollDistance]=\"2\"\n    [infiniteScrollThrottle]=\"50\"\n    (scrolled)=\"onScroll()\"\n    [fromRoot]=\"true\"\n    infiniteScrollContainer=\"mat-sidenav-content\"\n    matSort\n    (matSortChange)=\"sortColumn($event)\"\n    matSortDisableClear=\"true\"\n  >\n    <!-- # Column -->\n    <ng-container matColumnDef=\"#\">\n      <th mat-header-cell *matHeaderCellDef>#</th>\n      <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 }}</td>\n    </ng-container>\n\n    <!-- Title Column -->\n    <ng-container matColumnDef=\"Title\">\n      <th mat-header-cell mat-sort-header *matHeaderCellDef>Title</th>\n      <td mat-cell *matCellDef=\"let element\">{{ element.title }}</td>\n    </ng-container>\n\n    <!-- Description Column -->\n    <ng-container matColumnDef=\"Description\">\n      <th mat-header-cell mat-sort-header *matHeaderCellDef>Description</th>\n      <td mat-cell *matCellDef=\"let element\">{{ element.description }}</td>\n    </ng-container>\n\n    <!-- Actions Column -->\n    <ng-container matColumnDef=\"Actions\">\n      <th mat-header-cell *matHeaderCellDef>Actions</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <div class=\"text-secondary\" fxLayoutGap=\"1rem\">\n          <button mat-icon-button (click)=\"modifyProductMeasure(element)\">\n            <mat-icon>edit</mat-icon>\n          </button>\n        </div>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n  </table>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i7.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i11.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i5.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i10$2.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: i10.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i10.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], preserveWhitespaces: true });
-};
-ProductMeasuresListComponent = __decorate([
-    UntilDestroy()
-], ProductMeasuresListComponent);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductMeasuresListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-measure-list", template: "<div fxLayout=\"column\">\n  <div class=\"text-center\" fxLayoutAlign=\"center center\">\n    <h3 fxLayout>\n      <span class=\"mt-1\"> Product Measures </span>\n      <button\n        mat-raised-button\n        class=\"ml-2\"\n        color=\"primary\"\n        (click)=\"modifyProductMeasure()\"\n      >\n        <mat-icon>add</mat-icon>\n        Product Measure\n      </button>\n    </h3>\n  </div>\n\n  <div fxLayout>\n    <form [formGroup]=\"filterFormGroup\" fxLayout fxLayoutGap=\"0.5rem\">\n      <mat-form-field>\n        <input\n          matInput\n          placeholder=\"Item Name, Description, etc.\"\n          formControlName=\"search\"\n        />\n      </mat-form-field>\n    </form>\n\n    <mat-form-field class=\"ml-2\" fxFlex=\"0 1 calc(11.11% - 0.5rem)\">\n      <mat-label>Columns</mat-label>\n      <mat-select [(ngModel)]=\"displayedColumns\" multiple name=\"column\">\n        <mat-option\n          *ngFor=\"let column of columnDefinitions\"\n          [value]=\"column.def\"\n          [disabled]=\"!column.isShow\"\n        >\n          {{ column?.def }}</mat-option\n        >\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <table\n    mat-table\n    #table\n    [dataSource]=\"dataSource\"\n    class=\"mat-elevation-z8 w-100 mt-4 table-hover\"\n    infiniteScroll\n    [infiniteScrollDistance]=\"2\"\n    [infiniteScrollThrottle]=\"50\"\n    (scrolled)=\"onScroll()\"\n    [fromRoot]=\"true\"\n    infiniteScrollContainer=\"mat-sidenav-content\"\n    matSort\n    (matSortChange)=\"sortColumn($event)\"\n    matSortDisableClear=\"true\"\n  >\n    <!-- # Column -->\n    <ng-container matColumnDef=\"#\">\n      <th mat-header-cell *matHeaderCellDef>#</th>\n      <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 }}</td>\n    </ng-container>\n\n    <!-- Title Column -->\n    <ng-container matColumnDef=\"Title\">\n      <th mat-header-cell mat-sort-header *matHeaderCellDef>Title</th>\n      <td mat-cell *matCellDef=\"let element\">{{ element.title }}</td>\n    </ng-container>\n\n    <!-- Description Column -->\n    <ng-container matColumnDef=\"Description\">\n      <th mat-header-cell mat-sort-header *matHeaderCellDef>Description</th>\n      <td mat-cell *matCellDef=\"let element\">{{ element.description }}</td>\n    </ng-container>\n\n    <!-- Actions Column -->\n    <ng-container matColumnDef=\"Actions\">\n      <th mat-header-cell *matHeaderCellDef>Actions</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <div class=\"text-secondary\" fxLayoutGap=\"1rem\">\n          <button mat-icon-button (click)=\"modifyProductMeasure(element)\">\n            <mat-icon>edit</mat-icon>\n          </button>\n        </div>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n  </table>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i2.FormBuilder }, { type: i1.MatDialog }, { type: i1$1.FilterService }, { type: i2$1.ActivatedRoute }, { type: ProductService }] });
-
-class ProductFormService extends TechlifyFormService {
-    constructor() {
-        super();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormService, providedIn: "root" });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: "root",
-                }]
-        }], ctorParameters: () => [] });
-
-const initial_quantity = 0;
-const reorder_point = 10;
-const errorMessages = {
-    type_id: {
-        required: "Please Enter Type",
-    },
-    name: {
-        required: "Please Enter Name",
-    },
-    sale_price: {
-        required: "Please Enter Sales Price",
-    },
-    minimum_price: {
-        required: "Please Enter Minimum Price",
-    },
-    reorder_point: {
-        required: "Please Enter Reorder Point",
-    },
-};
-class ProductFormComponent {
-    productService;
-    fb;
-    formValidatorService;
-    alertService;
-    datePipe;
-    productFormService;
-    productForm;
-    isWorking = false;
-    isUpdate = false;
-    saved = new EventEmitter();
-    cancelled = new EventEmitter();
-    product;
-    displayedFormFields = [
-        "name",
-        "product type",
-        "sku",
-        "description",
-        "product measure",
-        "reorder point",
-        "initial quantity",
-        "initial quantity date",
-        "sales price",
-        "minimum price",
-        "maximum price",
-        "income account",
-        "expense account",
-    ];
-    displayedFormSections = [
-        "basic information",
-        "inventory information",
-        "sales information",
-        "accounts information",
-    ];
-    constructor(productService, fb, formValidatorService, alertService, datePipe, productFormService) {
-        this.productService = productService;
-        this.fb = fb;
-        this.formValidatorService = formValidatorService;
-        this.alertService = alertService;
-        this.datePipe = datePipe;
-        this.productFormService = productFormService;
-        this.productForm = this.fb.group({
-            id: [""],
-            type_id: [1, Validators.compose([Validators.required])],
-            sku: [""],
-            name: ["", Validators.compose([Validators.required])],
-            initial_quantity: [initial_quantity],
-            initial_quantity_date: [moment().format()],
-            reorder_point: [reorder_point, Validators.compose([Validators.required])],
-            description: [""],
-            sale_price: [0, Validators.compose([Validators.required])],
-            income_account_id: [""],
-            expense_account_id: [""],
-            measure_id: [1],
-            minimum_price: ["", Validators.compose([Validators.required])],
-            maximum_price: [""],
-            condition_type_id: [1],
-            current_quantity: [],
-            category_ids: [""],
-        });
-    }
-    ngOnInit() {
-        if (this.product?.id) {
-            this.isUpdate = true;
-            let data = { ...this.product };
-            if (this.product?.categories?.length > 0) {
-                data.category_ids = this.product.categories.map((category) => category?.id);
-            }
-            if (data?.initial_quantity_date) {
-                data.initial_quantity_date = moment(data.initial_quantity_date).toISOString();
-            }
-            this.productForm.patchValue(data);
-        }
-    }
-    async save() {
-        this.productForm.markAllAsTouched();
-        if (this.productForm.invalid) {
-            this.alertService.addAlert("Please Fill All Required Fields", "warn");
-            return;
-        }
-        let product = this.productForm.value;
-        if (product.maximum_price <= 0 || !product.maximum_price) {
-            product.maximum_price = product.minimum_price;
-        }
-        if (product?.initial_quantity_date) {
-            product.initial_quantity_date = moment(product.initial_quantity_date).format("YYYY-MM-DD");
-        }
-        this.isWorking = true;
-        product.with = "type,measure,incomeAccount,expenseAccount";
-        let request = this.productService.store(product);
-        if (this.isUpdate) {
-            request = this.productService.update(product);
-        }
-        request.subscribe({
-            next: (response) => {
-                this.saved.emit(response?.item);
-                this.isWorking = false;
-                this.productFormService.listUpdated(true);
-                this.alertService.addAlert("Product saved successfully!", "success");
-            },
-            error: () => (this.isWorking = false),
-        });
-    }
-    /**
-     * Method to evaluate form fields
-     */
-    isFieldValid(field) {
-        return this.formValidatorService.isFieldValid(field, this.productForm);
-    }
-    /**
-     * Method to find error in form fields
-     */
-    getErrorMessage(field) {
-        return this.formValidatorService.getErrorMessage(field, this.productForm, errorMessages);
-    }
-    /**
-     * Checks displayed Form Fields array for form field and returns boolean result
-     */
-    isFormFieldShown(fieldName) {
-        return (this.displayedFormFields.length > 0 &&
-            this.displayedFormFields.includes(fieldName));
-    }
-    /**
-     * Checks displayed Form Section array for form section and returns boolean result
-     */
-    isFormSectionShown(sectionName) {
-        return (this.displayedFormSections.length > 0 &&
-            this.displayedFormSections.includes(sectionName));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormComponent, deps: [{ token: ProductService }, { token: i2.FormBuilder }, { token: i1$1.FormValidatorService }, { token: i1$1.AlertService }, { token: i4.DatePipe }, { token: ProductFormService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductFormComponent, selector: "app-product-form", inputs: { product: "product", displayedFormFields: "displayedFormFields", displayedFormSections: "displayedFormSections" }, outputs: { saved: "saved", cancelled: "cancelled" }, ngImport: i0, template: "<form [formGroup]=\"productForm\" (submit)=\"save()\">\n  <h3 class=\"text-center\">{{ product?.id ? \"Update\" : \"Create\" }} Product</h3>\n  <div fxLayout=\"column\">\n    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('basic information')\">\n      <h3><strong>Basic Information</strong></h3>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('name')\">\n          <input matInput placeholder=\"Name\" formControlName=\"name\" required />\n          <mat-error *ngIf=\"isFieldValid('name')\"\n            >{{ getErrorMessage(\"name\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('product type')\">\n          <mat-label>Product Type</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-types\"\n            formControlName=\"type_id\"\n          >\n          </app-searchable-selector>\n          <mat-error *ngIf=\"isFieldValid('type_id')\"\n            >{{ getErrorMessage(\"type_id\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('sku')\">\n          <input matInput placeholder=\"SKU\" formControlName=\"sku\" />\n          <mat-error *ngIf=\"isFieldValid('sku')\"\n            >{{ getErrorMessage(\"sku\") }}\n          </mat-error>\n        </mat-form-field>\n\n        <mat-form-field fxFlex=\"50%\">\n          <mat-label>Category</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-categories\"\n            formControlName=\"category_ids\"\n            [multiple]=\"true\"\n          >\n          </app-searchable-selector>\n          <mat-error *ngIf=\"isFieldValid('category_ids')\">\n            {{ getErrorMessage(\"category_ids\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"100%\" *ngIf=\"isFormFieldShown('description')\">\n          <textarea\n            matInput\n            placeholder=\"Description\"\n            formControlName=\"description\"\n          ></textarea>\n        </mat-form-field>\n      </div>\n    </div>\n\n    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('inventory information')\">\n      <h3><strong>Inventory Information</strong></h3>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('product measure')\"\n        >\n          <mat-label>Measure</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-measures\"\n            formControlName=\"measure_id\"\n          >\n          </app-searchable-selector>\n          <mat-error *ngIf=\"isFieldValid('measure_id')\"\n            >{{ getErrorMessage(\"measure_id\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('reorder point')\">\n          <input\n            matInput\n            placeholder=\"Reorder Point\"\n            formControlName=\"reorder_point\"\n            type=\"number\"\n          />\n          <mat-error *ngIf=\"isFieldValid('reorder_point')\"\n            >{{ getErrorMessage(\"reorder_point\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('initial quantity')\"\n        >\n          <input\n            matInput\n            placeholder=\"Initial Quantity\"\n            formControlName=\"initial_quantity\"\n          />\n          <mat-error *ngIf=\"isFieldValid('initial_quantity')\"\n            >{{ getErrorMessage(\"initial_quantity\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('initial quantity date')\"\n        >\n          <input\n            matInput\n            [matDatepicker]=\"pickerInitialQuantityDate\"\n            placeholder=\"Initial Quantity Date\"\n            formControlName=\"initial_quantity_date\"\n          />\n          <mat-datepicker-toggle\n            matSuffix\n            [for]=\"pickerInitialQuantityDate\"\n          ></mat-datepicker-toggle>\n          <mat-datepicker #pickerInitialQuantityDate></mat-datepicker>\n          <mat-error *ngIf=\"isFieldValid('initial_quantity_date')\"\n            >{{ getErrorMessage(\"initial_quantity_date\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n    </div>\n    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('sales information')\">\n      <h3><strong>Sale Information</strong></h3>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('sales price')\">\n          <input\n            matInput\n            placeholder=\"Selling Price\"\n            formControlName=\"sale_price\"\n            required\n            type=\"number\"\n            step=\"any\"\n          />\n          <mat-error *ngIf=\"isFieldValid('sale_price')\"\n            >{{ getErrorMessage(\"sale_price\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('condition types')\"\n        >\n          <mat-label>Condition</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/condition-types\"\n            formControlName=\"condition_type_id\"\n          ></app-searchable-selector>\n        </mat-form-field>\n      </div>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('minimum price')\">\n          <input\n            matInput\n            placeholder=\"Minimum Price\"\n            formControlName=\"minimum_price\"\n            required\n            type=\"number\"\n            step=\"any\"\n          />\n          <mat-error *ngIf=\"isFieldValid('minimum_price')\"\n            >{{ getErrorMessage(\"minimum_price\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('maximum price')\">\n          <input\n            matInput\n            placeholder=\"Maximum Price\"\n            formControlName=\"maximum_price\"\n            type=\"number\"\n            step=\"any\"\n          />\n        </mat-form-field>\n      </div>\n    </div>\n    <!--    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('accounts information')\">-->\n    <!--      <h3><strong>Accounts Information</strong></h3>-->\n    <!--      <div fxLayout fxLayoutGap=\"0.5rem\">-->\n    <!--        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('income account')\">-->\n    <!--          <mat-label>Income Account</mat-label>-->\n    <!--          <app-searchable-selector apiUrl=\"api/accounts\" formControlName=\"income_account_id\"> </app-searchable-selector>-->\n    <!--        </mat-form-field>-->\n    <!--        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('expense account')\">-->\n    <!--          <mat-label>Expense Account</mat-label>-->\n    <!--          <app-searchable-selector apiUrl=\"api/accounts\" formControlName=\"expense_account_id\">-->\n    <!--          </app-searchable-selector>-->\n    <!--        </mat-form-field>-->\n    <!--      </div>-->\n    <!--    </div>-->\n    <div fxFlex=\"100%\" fxLayout fxLayoutAlign=\"end\" fxLayoutGap=\"1rem\">\n      <button\n        [disabled]=\"isWorking\"\n        mat-button\n        class=\"mt-2\"\n        type=\"button\"\n        (click)=\"cancelled.emit(true)\"\n      >\n        Cancel\n      </button>\n      <button\n        [disabled]=\"isWorking\"\n        mat-raised-button\n        color=\"primary\"\n        class=\"mt-2\"\n        type=\"submit\"\n      >\n        Save\n      </button>\n    </div>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.SearchableSelectorComponent, selector: "app-searchable-selector", inputs: ["valueField", "titleField", "subtitleField", "apiUrl", "multiple", "selectedValue", "enableSearch", "add", "addConfig", "edit", "editConfig", "sort", "sortBy", "searchField", "itemComponent", "items", "apiDataProperty", "cache", "perPage", "inDataSearch", "panelWidth", "focusSearchOnOpen", "required", "disabled", "value"], outputs: ["selectedValueChange", "selectionChange", "itemsChange"] }, { kind: "component", type: i7.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i9.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i9.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i10.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i10.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-form", template: "<form [formGroup]=\"productForm\" (submit)=\"save()\">\n  <h3 class=\"text-center\">{{ product?.id ? \"Update\" : \"Create\" }} Product</h3>\n  <div fxLayout=\"column\">\n    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('basic information')\">\n      <h3><strong>Basic Information</strong></h3>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('name')\">\n          <input matInput placeholder=\"Name\" formControlName=\"name\" required />\n          <mat-error *ngIf=\"isFieldValid('name')\"\n            >{{ getErrorMessage(\"name\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('product type')\">\n          <mat-label>Product Type</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-types\"\n            formControlName=\"type_id\"\n          >\n          </app-searchable-selector>\n          <mat-error *ngIf=\"isFieldValid('type_id')\"\n            >{{ getErrorMessage(\"type_id\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('sku')\">\n          <input matInput placeholder=\"SKU\" formControlName=\"sku\" />\n          <mat-error *ngIf=\"isFieldValid('sku')\"\n            >{{ getErrorMessage(\"sku\") }}\n          </mat-error>\n        </mat-form-field>\n\n        <mat-form-field fxFlex=\"50%\">\n          <mat-label>Category</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-categories\"\n            formControlName=\"category_ids\"\n            [multiple]=\"true\"\n          >\n          </app-searchable-selector>\n          <mat-error *ngIf=\"isFieldValid('category_ids')\">\n            {{ getErrorMessage(\"category_ids\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"100%\" *ngIf=\"isFormFieldShown('description')\">\n          <textarea\n            matInput\n            placeholder=\"Description\"\n            formControlName=\"description\"\n          ></textarea>\n        </mat-form-field>\n      </div>\n    </div>\n\n    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('inventory information')\">\n      <h3><strong>Inventory Information</strong></h3>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('product measure')\"\n        >\n          <mat-label>Measure</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-measures\"\n            formControlName=\"measure_id\"\n          >\n          </app-searchable-selector>\n          <mat-error *ngIf=\"isFieldValid('measure_id')\"\n            >{{ getErrorMessage(\"measure_id\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('reorder point')\">\n          <input\n            matInput\n            placeholder=\"Reorder Point\"\n            formControlName=\"reorder_point\"\n            type=\"number\"\n          />\n          <mat-error *ngIf=\"isFieldValid('reorder_point')\"\n            >{{ getErrorMessage(\"reorder_point\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('initial quantity')\"\n        >\n          <input\n            matInput\n            placeholder=\"Initial Quantity\"\n            formControlName=\"initial_quantity\"\n          />\n          <mat-error *ngIf=\"isFieldValid('initial_quantity')\"\n            >{{ getErrorMessage(\"initial_quantity\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('initial quantity date')\"\n        >\n          <input\n            matInput\n            [matDatepicker]=\"pickerInitialQuantityDate\"\n            placeholder=\"Initial Quantity Date\"\n            formControlName=\"initial_quantity_date\"\n          />\n          <mat-datepicker-toggle\n            matSuffix\n            [for]=\"pickerInitialQuantityDate\"\n          ></mat-datepicker-toggle>\n          <mat-datepicker #pickerInitialQuantityDate></mat-datepicker>\n          <mat-error *ngIf=\"isFieldValid('initial_quantity_date')\"\n            >{{ getErrorMessage(\"initial_quantity_date\") }}\n          </mat-error>\n        </mat-form-field>\n      </div>\n    </div>\n    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('sales information')\">\n      <h3><strong>Sale Information</strong></h3>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('sales price')\">\n          <input\n            matInput\n            placeholder=\"Selling Price\"\n            formControlName=\"sale_price\"\n            required\n            type=\"number\"\n            step=\"any\"\n          />\n          <mat-error *ngIf=\"isFieldValid('sale_price')\"\n            >{{ getErrorMessage(\"sale_price\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field\n          fxFlex=\"50%\"\n          *ngIf=\"isFormFieldShown('condition types')\"\n        >\n          <mat-label>Condition</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/condition-types\"\n            formControlName=\"condition_type_id\"\n          ></app-searchable-selector>\n        </mat-form-field>\n      </div>\n      <div fxLayout fxLayoutGap=\"0.5rem\">\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('minimum price')\">\n          <input\n            matInput\n            placeholder=\"Minimum Price\"\n            formControlName=\"minimum_price\"\n            required\n            type=\"number\"\n            step=\"any\"\n          />\n          <mat-error *ngIf=\"isFieldValid('minimum_price')\"\n            >{{ getErrorMessage(\"minimum_price\") }}\n          </mat-error>\n        </mat-form-field>\n        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('maximum price')\">\n          <input\n            matInput\n            placeholder=\"Maximum Price\"\n            formControlName=\"maximum_price\"\n            type=\"number\"\n            step=\"any\"\n          />\n        </mat-form-field>\n      </div>\n    </div>\n    <!--    <div fxLayout=\"column\" *ngIf=\"isFormSectionShown('accounts information')\">-->\n    <!--      <h3><strong>Accounts Information</strong></h3>-->\n    <!--      <div fxLayout fxLayoutGap=\"0.5rem\">-->\n    <!--        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('income account')\">-->\n    <!--          <mat-label>Income Account</mat-label>-->\n    <!--          <app-searchable-selector apiUrl=\"api/accounts\" formControlName=\"income_account_id\"> </app-searchable-selector>-->\n    <!--        </mat-form-field>-->\n    <!--        <mat-form-field fxFlex=\"50%\" *ngIf=\"isFormFieldShown('expense account')\">-->\n    <!--          <mat-label>Expense Account</mat-label>-->\n    <!--          <app-searchable-selector apiUrl=\"api/accounts\" formControlName=\"expense_account_id\">-->\n    <!--          </app-searchable-selector>-->\n    <!--        </mat-form-field>-->\n    <!--      </div>-->\n    <!--    </div>-->\n    <div fxFlex=\"100%\" fxLayout fxLayoutAlign=\"end\" fxLayoutGap=\"1rem\">\n      <button\n        [disabled]=\"isWorking\"\n        mat-button\n        class=\"mt-2\"\n        type=\"button\"\n        (click)=\"cancelled.emit(true)\"\n      >\n        Cancel\n      </button>\n      <button\n        [disabled]=\"isWorking\"\n        mat-raised-button\n        color=\"primary\"\n        class=\"mt-2\"\n        type=\"submit\"\n      >\n        Save\n      </button>\n    </div>\n  </div>\n</form>\n" }]
-        }], ctorParameters: () => [{ type: ProductService }, { type: i2.FormBuilder }, { type: i1$1.FormValidatorService }, { type: i1$1.AlertService }, { type: i4.DatePipe }, { type: ProductFormService }], propDecorators: { saved: [{
-                type: Output
-            }], cancelled: [{
-                type: Output
-            }], product: [{
-                type: Input
-            }], displayedFormFields: [{
-                type: Input
-            }], displayedFormSections: [{
-                type: Input
-            }] } });
-
-class ProductFormButtonComponent {
-    matDialog;
-    productFormService;
-    product;
-    saved = new EventEmitter();
-    constructor(matDialog, productFormService) {
-        this.matDialog = matDialog;
-        this.productFormService = productFormService;
-    }
-    showForm(templateRef) {
-        this.matDialog.open(templateRef, { width: "600px" });
-    }
-    /**
-     * Handle on product saved event.
-     *
-     * @param product
-     */
-    onProductSaved(product) {
-        this.saved.emit(product);
-        this.matDialog?.closeAll();
-        this.productFormService.listUpdated(true);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormButtonComponent, deps: [{ token: i1.MatDialog }, { token: ProductFormService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductFormButtonComponent, selector: "app-product-form-button", inputs: { product: "product" }, outputs: { saved: "saved" }, ngImport: i0, template: "<mat-icon\n  color=\"primary\"\n  class=\"cursor-pointer\"\n  [class.text-secondary]=\"product\"\n  (click)=\"showForm(addProductForm)\"\n>\n  {{ product ? \"edit\" : \"add\" }}\n</mat-icon>\n\n<ng-template #addProductForm>\n  <app-product-form\n    [product]=\"product\"\n    mat-dialog-content\n    (saved)=\"onProductSaved($event)\"\n    (cancelled)=\"matDialog.closeAll()\"\n  ></app-product-form>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ProductFormComponent, selector: "app-product-form", inputs: ["product", "displayedFormFields", "displayedFormSections"], outputs: ["saved", "cancelled"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductFormButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-form-button", template: "<mat-icon\n  color=\"primary\"\n  class=\"cursor-pointer\"\n  [class.text-secondary]=\"product\"\n  (click)=\"showForm(addProductForm)\"\n>\n  {{ product ? \"edit\" : \"add\" }}\n</mat-icon>\n\n<ng-template #addProductForm>\n  <app-product-form\n    [product]=\"product\"\n    mat-dialog-content\n    (saved)=\"onProductSaved($event)\"\n    (cancelled)=\"matDialog.closeAll()\"\n  ></app-product-form>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: i1.MatDialog }, { type: ProductFormService }], propDecorators: { product: [{
-                type: Input
-            }], saved: [{
-                type: Output
-            }] } });
-
-let ProductListComponent = class ProductListComponent {
-    fb;
-    dialog;
-    activatedRoute;
-    productService;
-    requestHelperService;
-    productFormService;
-    filterForm;
-    lastPage;
-    page = 1;
-    perPage = 25;
-    totalItems = 0;
-    currentPage = 1;
-    num_items = 25;
-    routeFilters;
-    products = [];
-    dataSource = new MatTableDataSource();
-    isLoading = false;
-    columnConfig = [
-        { label: '#', def: '#', isSelected: true, isEditable: true },
-        { label: 'Name', def: 'name', isSelected: true, isEditable: true },
-        { label: 'SKU', def: 'sku', isSelected: true, isEditable: true },
-        { label: 'Categories', def: 'categories', isSelected: true, isEditable: true },
-        { label: 'Initial Quantity', def: 'initial_quantity', isSelected: true, isEditable: true },
-        { label: 'Reorder Point', def: 'reorder_point', isSelected: true, isEditable: true },
-        { label: 'Stock Receipts', def: 'stock_receipts', isSelected: true, isEditable: true },
-        { label: 'Stock Issuances', def: 'stock_issuances', isSelected: true, isEditable: true },
-        { label: 'On Hand', def: 'on_hand', isSelected: true, isEditable: true },
-        { label: 'Sale Price', def: 'sale_price', isSelected: true, isEditable: true },
-        { label: 'Income Account', def: 'income_account', isSelected: false, isEditable: true },
-        { label: 'Expense Account', def: 'expense_account', isSelected: false, isEditable: true },
-        { label: 'Creator', def: 'creator', isSelected: false, isEditable: true },
-        { label: 'Actions', def: 'Actions', isSelected: true, isEditable: true },
-    ];
-    selectedColumns = this.columnConfig.filter(col => col.isSelected);
-    get displayedColumns() {
-        return this.selectedColumns.map(col => col.def);
-    }
-    importId;
-    constructor(fb, dialog, activatedRoute, productService, requestHelperService, productFormService) {
-        this.fb = fb;
-        this.dialog = dialog;
-        this.activatedRoute = activatedRoute;
-        this.productService = productService;
-        this.requestHelperService = requestHelperService;
-        this.productFormService = productFormService;
-        this.filterForm = this.fb.group({
-            search: [""],
-            category_ids: [""],
-            type_ids: [""],
-            income_account_ids: [""],
-            expense_account_ids: [""],
-            sort_by: [""],
-        });
-    }
-    ngOnInit() {
-        if (this.activatedRoute.snapshot.params?.["import_id"]) {
-            this.importId = parseInt(this.activatedRoute.snapshot.params?.["import_id"]);
-        }
-        // update form with URL query params
-        this.requestHelperService.updateFormWithQueryParams(this.filterForm, {
-            type_ids: { multiple: true },
-            category_ids: { multiple: true },
-            income_account_ids: { multiple: true },
-            expense_account_ids: { multiple: true },
-        });
-        // Update URL query params on filter change
-        this.filterForm.valueChanges.pipe(debounceTime(800)).subscribe(() => {
-            this.requestHelperService.updateQueryParams(this.requestHelperService.convertToFormData({
-                ...this.filterForm.value,
-            }));
-        });
-        // fetch task on params change
-        this.activatedRoute.queryParams
-            .pipe(debounceTime(800))
-            .subscribe(() => this.reload());
-        // listen form product add or update event and reload.
-        this.productFormService.isListUpdated().subscribe((val) => {
-            if (val && !this.isLoading) {
-                this.reload();
-            }
-        });
-    }
-    loadData() {
-        let params = {
-            ...this.requestHelperService.convertToFormData(this.filterForm.value),
-        };
-        params.page = this.page;
-        params.perPage = this.perPage;
-        params.num_items = this.num_items + "|" + this.currentPage;
-        params.with = "categories,lastStockReceipt,lastStockIssuance,creator";
-        if (this.importId) {
-            params.import_id = this.importId;
-        }
-        this.isLoading = true;
-        this.productService.index(params).subscribe({
-            next: (res) => {
-                this.isLoading = false;
-                this.dataSource = new MatTableDataSource(this.dataSource.data.concat(res?.data));
-                this.totalItems = res.total;
-                // stop reloading data once data loaded.
-                this.productFormService.listUpdated(false);
-            },
-            error: () => (this.isLoading = false),
-        });
-    }
-    reload() {
-        if (this.isLoading)
-            return;
-        this.dataSource = new MatTableDataSource();
-        this.currentPage = 1;
-        this.loadData();
-    }
-    modifyProduct(model) {
-        const dialogRef = this.dialog.open(ProductFormComponent, {
-            width: "600px",
-            data: {
-                details: model,
-            },
-        });
-        dialogRef.afterClosed().subscribe((result) => {
-            if (result) {
-                this.reload();
-            }
-        });
-    }
-    assignFilter(column, direction) {
-        if (column) {
-            return this.filterForm.get("sort_by")?.setValue(column + "|" + direction);
-        }
-    }
-    sortColumn(event) {
-        var direction = event.direction.toString().toUpperCase();
-        this.assignFilter(event.active, direction);
-    }
-    onScroll() {
-        if (this.totalItems > this.dataSource.data.length) {
-            this.currentPage += 1;
-            this.loadData();
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductListComponent, deps: [{ token: i2.FormBuilder }, { token: i1.MatDialog }, { token: i2$1.ActivatedRoute }, { token: ProductService }, { token: i1$1.RequestHelperService }, { token: ProductFormService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductListComponent, selector: "app-product-list", ngImport: i0, template: "<mat-card class=\"mb-3\">\n  <mat-card-content>\n    <form\n      [formGroup]=\"filterForm\"\n      class=\"d-flex justify-content-between align-items-center gap-2\"\n    >\n      <div class=\"d-flex justify-content-center align-items-center gap-2\">\n        <h3 class=\"mb-0\">Products</h3>\n        <app-product-form-button class=\"mt-2\"></app-product-form-button>\n        <span matTooltip=\"Import\" routerLink=\"import\" class=\"cursor-pointer mt-1 material-symbols-outlined\">\n          file_save\n        </span>\n        <app-column-selector\n          mode=\"icon\"\n          class=\"mb-2 d-print-none\"\n          [columnConfigs]=\"columnConfig\"\n          [(selectedColumns)]=\"selectedColumns\"\n        ></app-column-selector>\n      </div>\n\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <mat-form-field style=\"width: 120px\">\n          <input matInput placeholder=\"Product\" formControlName=\"search\" />\n        </mat-form-field>\n\n        <mat-form-field style=\"width: 120px\">\n          <mat-label>Category</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-categories\"\n            formControlName=\"category_ids\"\n            [multiple]=\"true\"\n          >\n          </app-searchable-selector>\n        </mat-form-field>\n\n        <mat-form-field style=\"width: 120px\">\n          <mat-label>Type</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-types\"\n            formControlName=\"type_ids\"\n            titleField=\"title\"\n            [multiple]=\"true\"\n          >\n          </app-searchable-selector>\n        </mat-form-field>\n        <!--        <mat-form-field style=\"width: 150px\">-->\n        <!--          <mat-label>Income Account</mat-label>-->\n        <!--          <app-searchable-selector-->\n        <!--            apiUrl=\"api/accounts\"-->\n        <!--            formControlName=\"income_account_ids\"-->\n        <!--            titleField=\"title\"-->\n        <!--            [multiple]=\"true\"-->\n        <!--          >-->\n        <!--          </app-searchable-selector>-->\n        <!--        </mat-form-field>-->\n        <!--        <mat-form-field style=\"width: 150px\">-->\n        <!--          <mat-label>Expense Account</mat-label>-->\n        <!--          <app-searchable-selector-->\n        <!--            apiUrl=\"api/accounts\"-->\n        <!--            formControlName=\"expense_account_ids\"-->\n        <!--            titleField=\"title\"-->\n        <!--            [multiple]=\"true\"-->\n        <!--          >-->\n        <!--          </app-searchable-selector>-->\n        <!--        </mat-form-field>-->\n      </div>\n    </form>\n  </mat-card-content>\n</mat-card>\n\n<mat-card>\n  <mat-card-content class=\"p-0\">\n    <table\n      mat-table\n      [dataSource]=\"dataSource\"\n      class=\"w-100\"\n      infiniteScroll\n      [infiniteScrollDistance]=\"2\"\n      [infiniteScrollThrottle]=\"50\"\n      (scrolled)=\"onScroll()\"\n      [fromRoot]=\"true\"\n      matSort\n      (matSortChange)=\"sortColumn($event)\"\n      matSortDisableClear=\"true\"\n      aria-describedby=\"Products List\"\n    >\n      <!-- # Column -->\n      <ng-container matColumnDef=\"#\">\n        <th mat-header-cell *matHeaderCellDef>#</th>\n        <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 }}</td>\n      </ng-container>\n\n      <!-- Name Column -->\n      <ng-container matColumnDef=\"name\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>Name</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <div class=\"d-flex flex-column gap-1\">\n            <a class=\"text-decoration-none text-dark\" [routerLink]=\"[element?.id, 'view']\">{{ element.name }}</a>\n            <small class=\"text-secondary\" *ngIf=\"element.type\">{{ element.type?.title }}</small>\n          </div>\n        </td>\n      </ng-container>\n\n      <!-- Categories Column -->\n      <ng-container matColumnDef=\"categories\">\n        <th mat-header-cell *matHeaderCellDef>Categories</th>\n        <td mat-cell *matCellDef=\"let element\" style=\"max-width: 200px\">\n          <div\n            *ngIf=\"element?.categories?.length > 0\"\n            class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap\"\n          >\n            <span\n              class=\"badge bg-secondary\"\n              *ngFor=\"let category of element?.categories\"\n            >\n              {{ category?.title }}\n            </span>\n          </div>\n        </td>\n      </ng-container>\n\n      <!-- SKU Column -->\n      <ng-container matColumnDef=\"sku\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>SKU</th>\n        <td mat-cell *matCellDef=\"let element\">{{ element.sku }}</td>\n      </ng-container>\n\n      <!-- Initial Quantity Column -->\n      <ng-container matColumnDef=\"initial_quantity\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>\n          Initial Quantity\n        </th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element.initial_quantity }}</p>\n          <small class=\"text-secondary\" *ngIf=\"element?.initial_quantity_date\">\n            on {{ element?.initial_quantity_date | date }}\n          </small>\n        </td>\n      </ng-container>\n\n      <!-- Stock Receipts Column -->\n      <ng-container matColumnDef=\"stock_receipts\">\n        <th mat-header-cell mat-sort-header=\"stock_receipts_sum_quantity\" *matHeaderCellDef>\n          Stock Receipts\n        </th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element?.stock_receipts_sum_quantity }}</p>\n          <small class=\"text-secondary\" *ngIf=\"element?.last_stock_receipt\">\n            last added on {{ element?.last_stock_receipt?.date | date }}\n          </small>\n        </td>\n      </ng-container>\n\n      <!-- Stock Issuances Column -->\n      <ng-container matColumnDef=\"stock_issuances\">\n        <th mat-header-cell mat-sort-header=\"stock_issuances_sum_quantity\" *matHeaderCellDef>\n          Stock Issuances\n        </th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element?.stock_issuances_sum_quantity }}</p>\n          <small class=\"text-secondary\" *ngIf=\"element?.last_stock_issuance\">\n            last issued on {{ element?.last_stock_issuance?.date | date }}\n          </small>\n        </td>\n      </ng-container>\n\n      <!-- On Hand Column -->\n      <ng-container matColumnDef=\"on_hand\">\n        <th mat-header-cell mat-sort-header=\"stock_balance\" *matHeaderCellDef>On Hand</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element?.stock_balance }}\n        </td>\n      </ng-container>\n\n      <!-- Reorder Point Column -->\n      <ng-container matColumnDef=\"reorder_point\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>Reorder Point</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element.reorder_point }}\n        </td>\n      </ng-container>\n\n      <!-- Selling Price Column -->\n      <ng-container matColumnDef=\"sale_price\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>Selling Price</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element.sale_price | currency }}\n        </td>\n      </ng-container>\n\n      <!-- Income Account Column -->\n      <ng-container matColumnDef=\"income_account\">\n        <th mat-header-cell *matHeaderCellDef>Income Account</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element?.income_account?.title }}\n        </td>\n      </ng-container>\n\n      <!-- Expense Account Column -->\n      <ng-container matColumnDef=\"expense_account\">\n        <th mat-header-cell *matHeaderCellDef>Expense Account</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element?.expense_account?.title }}\n        </td>\n      </ng-container>\n\n      <!-- Creator Column -->\n      <ng-container matColumnDef=\"creator\">\n        <th mat-header-cell *matHeaderCellDef>Creator</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n          <small class=\"text-secondary\">{{ element?.created_at | date }}</small>\n        </td>\n      </ng-container>\n\n      <!-- Actions Column -->\n      <ng-container matColumnDef=\"Actions\">\n        <th mat-header-cell *matHeaderCellDef>Actions</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <div class=\"text-secondary d-flex gap-1\">\n            <app-product-form-button\n              [product]=\"element\"\n            ></app-product-form-button>\n            <mat-icon\n              class=\"cursor-pointer\"\n              matTooltip=\"View\"\n              [routerLink]=\"[element.id, 'view']\"\n              routerLinkActive=\"route-link-active\"\n            >\n              remove_red_eye\n            </mat-icon>\n\n            <app-stock-receipt-form-button\n              [product]=\"element\"\n              (saved)=\"reload()\"\n            ></app-stock-receipt-form-button>\n\n            <app-stock-issue-form-button\n              [product]=\"element\"\n              (saved)=\"reload()\"\n            ></app-stock-issue-form-button>\n          </div>\n        </td>\n      </ng-container>\n      <tr\n        mat-header-row\n        *matHeaderRowDef=\"displayedColumns; sticky: true\"\n      ></tr>\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n    </table>\n\n    <mat-progress-bar mode=\"indeterminate\" *ngIf=\"isLoading\"></mat-progress-bar>\n  </mat-card-content>\n</mat-card>\n", dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i1$1.SearchableSelectorComponent, selector: "app-searchable-selector", inputs: ["valueField", "titleField", "subtitleField", "apiUrl", "multiple", "selectedValue", "enableSearch", "add", "addConfig", "edit", "editConfig", "sort", "sortBy", "searchField", "itemComponent", "items", "apiDataProperty", "cache", "perPage", "inDataSearch", "panelWidth", "focusSearchOnOpen", "required", "disabled", "value"], outputs: ["selectedValueChange", "selectionChange", "itemsChange"] }, { kind: "component", type: StockReceiptFormButtonComponent, selector: "app-stock-receipt-form-button", inputs: ["product", "stockReceipt", "icon"], outputs: ["saved"] }, { kind: "component", type: StockIssueFormButtonComponent, selector: "app-stock-issue-form-button", inputs: ["product", "stockIssuance", "icon", "issuableType", "issuableId"], outputs: ["saved"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i5.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i3$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$2.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i2$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i7$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i10$2.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1$1.ColumnSelectorComponent, selector: "app-column-selector", inputs: ["label", "mode", "columnConfigs", "selectedColumns"], outputs: ["selectedColumnsChange", "displayedColumnsChange"] }, { kind: "component", type: ProductFormButtonComponent, selector: "app-product-form-button", inputs: ["product"], outputs: ["saved"] }, { kind: "pipe", type: i4.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i4.DatePipe, name: "date" }], preserveWhitespaces: true });
-};
-ProductListComponent = __decorate([
-    UntilDestroy()
-], ProductListComponent);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-list", template: "<mat-card class=\"mb-3\">\n  <mat-card-content>\n    <form\n      [formGroup]=\"filterForm\"\n      class=\"d-flex justify-content-between align-items-center gap-2\"\n    >\n      <div class=\"d-flex justify-content-center align-items-center gap-2\">\n        <h3 class=\"mb-0\">Products</h3>\n        <app-product-form-button class=\"mt-2\"></app-product-form-button>\n        <span matTooltip=\"Import\" routerLink=\"import\" class=\"cursor-pointer mt-1 material-symbols-outlined\">\n          file_save\n        </span>\n        <app-column-selector\n          mode=\"icon\"\n          class=\"mb-2 d-print-none\"\n          [columnConfigs]=\"columnConfig\"\n          [(selectedColumns)]=\"selectedColumns\"\n        ></app-column-selector>\n      </div>\n\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <mat-form-field style=\"width: 120px\">\n          <input matInput placeholder=\"Product\" formControlName=\"search\" />\n        </mat-form-field>\n\n        <mat-form-field style=\"width: 120px\">\n          <mat-label>Category</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-categories\"\n            formControlName=\"category_ids\"\n            [multiple]=\"true\"\n          >\n          </app-searchable-selector>\n        </mat-form-field>\n\n        <mat-form-field style=\"width: 120px\">\n          <mat-label>Type</mat-label>\n          <app-searchable-selector\n            apiUrl=\"api/product-types\"\n            formControlName=\"type_ids\"\n            titleField=\"title\"\n            [multiple]=\"true\"\n          >\n          </app-searchable-selector>\n        </mat-form-field>\n        <!--        <mat-form-field style=\"width: 150px\">-->\n        <!--          <mat-label>Income Account</mat-label>-->\n        <!--          <app-searchable-selector-->\n        <!--            apiUrl=\"api/accounts\"-->\n        <!--            formControlName=\"income_account_ids\"-->\n        <!--            titleField=\"title\"-->\n        <!--            [multiple]=\"true\"-->\n        <!--          >-->\n        <!--          </app-searchable-selector>-->\n        <!--        </mat-form-field>-->\n        <!--        <mat-form-field style=\"width: 150px\">-->\n        <!--          <mat-label>Expense Account</mat-label>-->\n        <!--          <app-searchable-selector-->\n        <!--            apiUrl=\"api/accounts\"-->\n        <!--            formControlName=\"expense_account_ids\"-->\n        <!--            titleField=\"title\"-->\n        <!--            [multiple]=\"true\"-->\n        <!--          >-->\n        <!--          </app-searchable-selector>-->\n        <!--        </mat-form-field>-->\n      </div>\n    </form>\n  </mat-card-content>\n</mat-card>\n\n<mat-card>\n  <mat-card-content class=\"p-0\">\n    <table\n      mat-table\n      [dataSource]=\"dataSource\"\n      class=\"w-100\"\n      infiniteScroll\n      [infiniteScrollDistance]=\"2\"\n      [infiniteScrollThrottle]=\"50\"\n      (scrolled)=\"onScroll()\"\n      [fromRoot]=\"true\"\n      matSort\n      (matSortChange)=\"sortColumn($event)\"\n      matSortDisableClear=\"true\"\n      aria-describedby=\"Products List\"\n    >\n      <!-- # Column -->\n      <ng-container matColumnDef=\"#\">\n        <th mat-header-cell *matHeaderCellDef>#</th>\n        <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 }}</td>\n      </ng-container>\n\n      <!-- Name Column -->\n      <ng-container matColumnDef=\"name\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>Name</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <div class=\"d-flex flex-column gap-1\">\n            <a class=\"text-decoration-none text-dark\" [routerLink]=\"[element?.id, 'view']\">{{ element.name }}</a>\n            <small class=\"text-secondary\" *ngIf=\"element.type\">{{ element.type?.title }}</small>\n          </div>\n        </td>\n      </ng-container>\n\n      <!-- Categories Column -->\n      <ng-container matColumnDef=\"categories\">\n        <th mat-header-cell *matHeaderCellDef>Categories</th>\n        <td mat-cell *matCellDef=\"let element\" style=\"max-width: 200px\">\n          <div\n            *ngIf=\"element?.categories?.length > 0\"\n            class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap\"\n          >\n            <span\n              class=\"badge bg-secondary\"\n              *ngFor=\"let category of element?.categories\"\n            >\n              {{ category?.title }}\n            </span>\n          </div>\n        </td>\n      </ng-container>\n\n      <!-- SKU Column -->\n      <ng-container matColumnDef=\"sku\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>SKU</th>\n        <td mat-cell *matCellDef=\"let element\">{{ element.sku }}</td>\n      </ng-container>\n\n      <!-- Initial Quantity Column -->\n      <ng-container matColumnDef=\"initial_quantity\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>\n          Initial Quantity\n        </th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element.initial_quantity }}</p>\n          <small class=\"text-secondary\" *ngIf=\"element?.initial_quantity_date\">\n            on {{ element?.initial_quantity_date | date }}\n          </small>\n        </td>\n      </ng-container>\n\n      <!-- Stock Receipts Column -->\n      <ng-container matColumnDef=\"stock_receipts\">\n        <th mat-header-cell mat-sort-header=\"stock_receipts_sum_quantity\" *matHeaderCellDef>\n          Stock Receipts\n        </th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element?.stock_receipts_sum_quantity }}</p>\n          <small class=\"text-secondary\" *ngIf=\"element?.last_stock_receipt\">\n            last added on {{ element?.last_stock_receipt?.date | date }}\n          </small>\n        </td>\n      </ng-container>\n\n      <!-- Stock Issuances Column -->\n      <ng-container matColumnDef=\"stock_issuances\">\n        <th mat-header-cell mat-sort-header=\"stock_issuances_sum_quantity\" *matHeaderCellDef>\n          Stock Issuances\n        </th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element?.stock_issuances_sum_quantity }}</p>\n          <small class=\"text-secondary\" *ngIf=\"element?.last_stock_issuance\">\n            last issued on {{ element?.last_stock_issuance?.date | date }}\n          </small>\n        </td>\n      </ng-container>\n\n      <!-- On Hand Column -->\n      <ng-container matColumnDef=\"on_hand\">\n        <th mat-header-cell mat-sort-header=\"stock_balance\" *matHeaderCellDef>On Hand</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element?.stock_balance }}\n        </td>\n      </ng-container>\n\n      <!-- Reorder Point Column -->\n      <ng-container matColumnDef=\"reorder_point\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>Reorder Point</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element.reorder_point }}\n        </td>\n      </ng-container>\n\n      <!-- Selling Price Column -->\n      <ng-container matColumnDef=\"sale_price\">\n        <th mat-header-cell mat-sort-header *matHeaderCellDef>Selling Price</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element.sale_price | currency }}\n        </td>\n      </ng-container>\n\n      <!-- Income Account Column -->\n      <ng-container matColumnDef=\"income_account\">\n        <th mat-header-cell *matHeaderCellDef>Income Account</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element?.income_account?.title }}\n        </td>\n      </ng-container>\n\n      <!-- Expense Account Column -->\n      <ng-container matColumnDef=\"expense_account\">\n        <th mat-header-cell *matHeaderCellDef>Expense Account</th>\n        <td mat-cell *matCellDef=\"let element\">\n          {{ element?.expense_account?.title }}\n        </td>\n      </ng-container>\n\n      <!-- Creator Column -->\n      <ng-container matColumnDef=\"creator\">\n        <th mat-header-cell *matHeaderCellDef>Creator</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n          <small class=\"text-secondary\">{{ element?.created_at | date }}</small>\n        </td>\n      </ng-container>\n\n      <!-- Actions Column -->\n      <ng-container matColumnDef=\"Actions\">\n        <th mat-header-cell *matHeaderCellDef>Actions</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <div class=\"text-secondary d-flex gap-1\">\n            <app-product-form-button\n              [product]=\"element\"\n            ></app-product-form-button>\n            <mat-icon\n              class=\"cursor-pointer\"\n              matTooltip=\"View\"\n              [routerLink]=\"[element.id, 'view']\"\n              routerLinkActive=\"route-link-active\"\n            >\n              remove_red_eye\n            </mat-icon>\n\n            <app-stock-receipt-form-button\n              [product]=\"element\"\n              (saved)=\"reload()\"\n            ></app-stock-receipt-form-button>\n\n            <app-stock-issue-form-button\n              [product]=\"element\"\n              (saved)=\"reload()\"\n            ></app-stock-issue-form-button>\n          </div>\n        </td>\n      </ng-container>\n      <tr\n        mat-header-row\n        *matHeaderRowDef=\"displayedColumns; sticky: true\"\n      ></tr>\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n    </table>\n\n    <mat-progress-bar mode=\"indeterminate\" *ngIf=\"isLoading\"></mat-progress-bar>\n  </mat-card-content>\n</mat-card>\n" }]
-        }], ctorParameters: () => [{ type: i2.FormBuilder }, { type: i1.MatDialog }, { type: i2$1.ActivatedRoute }, { type: ProductService }, { type: i1$1.RequestHelperService }, { type: ProductFormService }] });
-
-class ProductNavBarComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductNavBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductNavBarComponent, selector: "app-product-nav-bar", ngImport: i0, template: "<div>\n  <router-outlet></router-outlet>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductNavBarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-nav-bar", template: "<div>\n  <router-outlet></router-outlet>\n</div>\n" }]
-        }] });
-
-class ProductTaxService extends TechlifyServiceBaseClass {
-    constructor(httpService) {
-        super(httpService, "product-taxes");
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxService, deps: [{ token: i1$1.HttpService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxService, providedIn: "root" });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: "root",
-                }]
-        }], ctorParameters: () => [{ type: i1$1.HttpService }] });
-
-class ProductTaxFormButtonComponent extends TechlifyFormComponentInterface {
-    matDialog;
-    productTaxService;
-    formBuilder;
-    alertService;
-    product;
-    saved = new EventEmitter();
-    isSaving;
-    constructor(matDialog, productTaxService, formValidatorService, formBuilder, alertService) {
-        super(formValidatorService);
-        this.matDialog = matDialog;
-        this.productTaxService = productTaxService;
-        this.formBuilder = formBuilder;
-        this.alertService = alertService;
-        this.errorMessages = {
-            tax_id: {
-                required: "The tax field is required.",
-            },
-        };
-        this.form = this.formBuilder.group({
-            product_id: [""],
-            tax_id: ["", Validators.required],
-        });
-    }
-    ngOnInit() {
-        if (this.product) {
-            this.form.get("product_id")?.setValue(this.product?.id);
-        }
-    }
-    showForm(templateRef) {
-        this.matDialog.open(templateRef, { width: "400px" });
-    }
-    save() {
-        this.form.markAllAsTouched();
-        if (this.form.invalid) {
-            this.alertService.addAlert("Please check the form for errors.", "error");
-            return;
-        }
-        const data = { ...this.form.value };
-        const params = {
-            with: "tax.type",
-        };
-        this.isSaving = true;
-        this.productTaxService.store(data, params).subscribe({
-            next: (response) => {
-                this.isSaving = false;
-                this.matDialog.closeAll();
-                this.alertService.addAlert("Product tax saved successfully!", "success");
-                this.saved.emit(response?.item);
-            },
-            error: () => (this.isSaving = false),
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxFormButtonComponent, deps: [{ token: i1.MatDialog }, { token: ProductTaxService }, { token: i1$1.FormValidatorService }, { token: i2.FormBuilder }, { token: i1$1.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductTaxFormButtonComponent, selector: "app-product-tax-form-button", inputs: { product: "product" }, outputs: { saved: "saved" }, usesInheritance: true, ngImport: i0, template: "<mat-icon\n  color=\"primary\"\n  class=\"cursor-pointer\"\n  (click)=\"showForm(formTemplate)\"\n>\n  add\n</mat-icon>\n\n<ng-template #formTemplate>\n  <form\n    [formGroup]=\"form\"\n    (submit)=\"save()\"\n    mat-dialog-content\n    class=\"d-flex flex-column gap-2\"\n  >\n    <h3 class=\"text-dark\">Add tax for {{ product?.name }}</h3>\n    <mat-form-field>\n      <mat-label>Tax</mat-label>\n      <app-searchable-selector\n        formControlName=\"tax_id\"\n        required\n        apiUrl=\"api/taxes\"\n        [enableSearch]=\"false\"\n      ></app-searchable-selector>\n      <mat-error *ngIf=\"isFieldValid('tax_id')\">\n        {{ getErrorMessage(\"tax_id\") }}\n      </mat-error>\n    </mat-form-field>\n\n    <div class=\"d-flex justify-content-end align-items-center gap-3\">\n      <button\n        [disabled]=\"isSaving\"\n        type=\"submit\"\n        mat-raised-button\n        color=\"primary\"\n      >\n        Save\n      </button>\n      <button\n        [disabled]=\"isSaving\"\n        type=\"button\"\n        mat-flat-button\n        mat-dialog-close\n      >\n        Cancel\n      </button>\n    </div>\n  </form>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1$1.SearchableSelectorComponent, selector: "app-searchable-selector", inputs: ["valueField", "titleField", "subtitleField", "apiUrl", "multiple", "selectedValue", "enableSearch", "add", "addConfig", "edit", "editConfig", "sort", "sortBy", "searchField", "itemComponent", "items", "apiDataProperty", "cache", "perPage", "inDataSearch", "panelWidth", "focusSearchOnOpen", "required", "disabled", "value"], outputs: ["selectedValueChange", "selectionChange", "itemsChange"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxFormButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-tax-form-button", template: "<mat-icon\n  color=\"primary\"\n  class=\"cursor-pointer\"\n  (click)=\"showForm(formTemplate)\"\n>\n  add\n</mat-icon>\n\n<ng-template #formTemplate>\n  <form\n    [formGroup]=\"form\"\n    (submit)=\"save()\"\n    mat-dialog-content\n    class=\"d-flex flex-column gap-2\"\n  >\n    <h3 class=\"text-dark\">Add tax for {{ product?.name }}</h3>\n    <mat-form-field>\n      <mat-label>Tax</mat-label>\n      <app-searchable-selector\n        formControlName=\"tax_id\"\n        required\n        apiUrl=\"api/taxes\"\n        [enableSearch]=\"false\"\n      ></app-searchable-selector>\n      <mat-error *ngIf=\"isFieldValid('tax_id')\">\n        {{ getErrorMessage(\"tax_id\") }}\n      </mat-error>\n    </mat-form-field>\n\n    <div class=\"d-flex justify-content-end align-items-center gap-3\">\n      <button\n        [disabled]=\"isSaving\"\n        type=\"submit\"\n        mat-raised-button\n        color=\"primary\"\n      >\n        Save\n      </button>\n      <button\n        [disabled]=\"isSaving\"\n        type=\"button\"\n        mat-flat-button\n        mat-dialog-close\n      >\n        Cancel\n      </button>\n    </div>\n  </form>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: i1.MatDialog }, { type: ProductTaxService }, { type: i1$1.FormValidatorService }, { type: i2.FormBuilder }, { type: i1$1.AlertService }], propDecorators: { product: [{
-                type: Input
-            }], saved: [{
-                type: Output
-            }] } });
-
-class ProductTaxDeleteButtonComponent {
-    matDialog;
-    productTaxService;
-    alertService;
-    productTax;
-    deleted = new EventEmitter();
-    isDeleting;
-    constructor(matDialog, productTaxService, alertService) {
-        this.matDialog = matDialog;
-        this.productTaxService = productTaxService;
-        this.alertService = alertService;
-    }
-    /**
-     * Delete the product.
-     */
-    delete() {
-        this.isDeleting = true;
-        this.productTaxService.delete(this.productTax).subscribe({
-            next: () => {
-                this.matDialog?.closeAll();
-                this.deleted.emit();
-                this.isDeleting = false;
-                this.alertService.addAlert("Product tax deleted successfully!", "success");
-            },
-            error: () => (this.isDeleting = false),
-        });
-    }
-    /**
-     * Show delete product dialog.
-     *
-     * @param templateRef
-     */
-    showDeleteDialog(templateRef) {
-        this.matDialog.open(templateRef, { width: "500px" });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxDeleteButtonComponent, deps: [{ token: i1.MatDialog }, { token: ProductTaxService }, { token: i1$1.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductTaxDeleteButtonComponent, selector: "app-product-tax-delete-button", inputs: { productTax: "productTax" }, outputs: { deleted: "deleted" }, ngImport: i0, template: "<mat-icon\n  class=\"cursor-pointer text-secondary\"\n  (click)=\"showDeleteDialog(deleteConfirmDialog)\"\n>\n  delete\n</mat-icon>\n\n<ng-template #deleteConfirmDialog>\n  <h3 mat-dialog-title>Delete Product Tax</h3>\n  <div mat-dialog-content>\n    Are you sure? You want to delete the product tax?\n  </div>\n  <div mat-dialog-actions class=\"d-flex justify-content-end gap-1 mb-2\">\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-raised-button\n      color=\"warn\"\n      (click)=\"delete()\"\n    >\n      Delete\n    </button>\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-flat-button\n      mat-dialog-close\n    >\n      Cancel\n    </button>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i7.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxDeleteButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-tax-delete-button", template: "<mat-icon\n  class=\"cursor-pointer text-secondary\"\n  (click)=\"showDeleteDialog(deleteConfirmDialog)\"\n>\n  delete\n</mat-icon>\n\n<ng-template #deleteConfirmDialog>\n  <h3 mat-dialog-title>Delete Product Tax</h3>\n  <div mat-dialog-content>\n    Are you sure? You want to delete the product tax?\n  </div>\n  <div mat-dialog-actions class=\"d-flex justify-content-end gap-1 mb-2\">\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-raised-button\n      color=\"warn\"\n      (click)=\"delete()\"\n    >\n      Delete\n    </button>\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-flat-button\n      mat-dialog-close\n    >\n      Cancel\n    </button>\n  </div>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: i1.MatDialog }, { type: ProductTaxService }, { type: i1$1.AlertService }], propDecorators: { productTax: [{
-                type: Input
-            }], deleted: [{
-                type: Output
-            }] } });
-
-class ProductTaxListComponent extends TechlifyListingControllerInterface {
-    product;
-    displayedColumns = ["#", "Tax", "Actions"];
-    ngOnInit() {
-        this.loadData();
-    }
-    loadData() {
-        this.models = this.product?.taxes ?? [];
-    }
-    onCreated(productTax) {
-        this.models.unshift(productTax);
-        this.models = [...this.models];
-    }
-    onDeleted(index) {
-        this.models.splice(index, 1);
-        this.models = [...this.models];
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductTaxListComponent, selector: "app-product-tax-list", inputs: { product: "product" }, usesInheritance: true, ngImport: i0, template: "<mat-card>\n  <mat-card-content\n    class=\"pb-3 d-flex justify-content-between align-items-center gap-3\"\n  >\n    <div class=\"d-flex justify-content-start gap-2\">\n      <span class=\"material-symbols-outlined\"> percent </span>\n      <strong class=\"mb-0 text-dark\">Product Taxes</strong>\n    </div>\n    <app-product-tax-form-button\n      [product]=\"product\"\n      (saved)=\"onCreated($event)\"\n    ></app-product-tax-form-button>\n  </mat-card-content>\n  <mat-divider></mat-divider>\n  <mat-card-content class=\"p-0\">\n    <table mat-table [dataSource]=\"models\" class=\"w-100\">\n      <ng-container matColumnDef=\"#\">\n        <th mat-header-cell *matHeaderCellDef>#</th>\n        <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 }}</td>\n      </ng-container>\n\n      <ng-container matColumnDef=\"Tax\">\n        <th mat-header-cell *matHeaderCellDef>Tax</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">\n            {{ element?.tax?.title }} ({{ element?.tax?.code }})\n          </p>\n          <small class=\"text-secondary\"\n            >{{ element?.tax?.value }} - {{ element?.tax?.type?.title }}</small\n          >\n        </td>\n      </ng-container>\n\n      <ng-container matColumnDef=\"Actions\">\n        <th mat-header-cell *matHeaderCellDef>Actions</th>\n        <td mat-cell *matCellDef=\"let element; let i = index\">\n          <app-product-tax-delete-button\n            [productTax]=\"element\"\n            (deleted)=\"onDeleted(i)\"\n          ></app-product-tax-delete-button>\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n    </table>\n  </mat-card-content>\n</mat-card>\n", dependencies: [{ kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i3$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i6$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: ProductTaxFormButtonComponent, selector: "app-product-tax-form-button", inputs: ["product"], outputs: ["saved"] }, { kind: "component", type: ProductTaxDeleteButtonComponent, selector: "app-product-tax-delete-button", inputs: ["productTax"], outputs: ["deleted"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-tax-list", template: "<mat-card>\n  <mat-card-content\n    class=\"pb-3 d-flex justify-content-between align-items-center gap-3\"\n  >\n    <div class=\"d-flex justify-content-start gap-2\">\n      <span class=\"material-symbols-outlined\"> percent </span>\n      <strong class=\"mb-0 text-dark\">Product Taxes</strong>\n    </div>\n    <app-product-tax-form-button\n      [product]=\"product\"\n      (saved)=\"onCreated($event)\"\n    ></app-product-tax-form-button>\n  </mat-card-content>\n  <mat-divider></mat-divider>\n  <mat-card-content class=\"p-0\">\n    <table mat-table [dataSource]=\"models\" class=\"w-100\">\n      <ng-container matColumnDef=\"#\">\n        <th mat-header-cell *matHeaderCellDef>#</th>\n        <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 }}</td>\n      </ng-container>\n\n      <ng-container matColumnDef=\"Tax\">\n        <th mat-header-cell *matHeaderCellDef>Tax</th>\n        <td mat-cell *matCellDef=\"let element\">\n          <p class=\"mb-0\">\n            {{ element?.tax?.title }} ({{ element?.tax?.code }})\n          </p>\n          <small class=\"text-secondary\"\n            >{{ element?.tax?.value }} - {{ element?.tax?.type?.title }}</small\n          >\n        </td>\n      </ng-container>\n\n      <ng-container matColumnDef=\"Actions\">\n        <th mat-header-cell *matHeaderCellDef>Actions</th>\n        <td mat-cell *matCellDef=\"let element; let i = index\">\n          <app-product-tax-delete-button\n            [productTax]=\"element\"\n            (deleted)=\"onDeleted(i)\"\n          ></app-product-tax-delete-button>\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n    </table>\n  </mat-card-content>\n</mat-card>\n" }]
-        }], propDecorators: { product: [{
-                type: Input
-            }] } });
-
-class ProductDeleteButtonComponent {
-    matDialog;
-    productService;
-    alertService;
-    product;
-    deleted = new EventEmitter();
-    isDeleting;
-    constructor(matDialog, productService, alertService) {
-        this.matDialog = matDialog;
-        this.productService = productService;
-        this.alertService = alertService;
-    }
-    /**
-     * Delete the product.
-     */
-    deleteProduct() {
-        this.isDeleting = true;
-        this.productService.delete(this.product).subscribe({
-            next: () => {
-                this.deleted.emit();
-                this.isDeleting = false;
-                this.matDialog.closeAll();
-                this.alertService.addAlert("Product deleted successfully!", "success");
-            },
-            error: () => (this.isDeleting = false),
-        });
-    }
-    /**
-     * Show delete product dialog.
-     *
-     * @param templateRef
-     */
-    showDeleteDialog(templateRef) {
-        this.matDialog.open(templateRef, { width: "500px" });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductDeleteButtonComponent, deps: [{ token: i1.MatDialog }, { token: ProductService }, { token: i1$1.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductDeleteButtonComponent, selector: "app-product-delete-button", inputs: { product: "product" }, outputs: { deleted: "deleted" }, ngImport: i0, template: "<mat-icon\n  class=\"cursor-pointer text-secondary\"\n  (click)=\"showDeleteDialog(deleteProductDialog)\"\n>\n  delete\n</mat-icon>\n\n<ng-template #deleteProductDialog>\n  <h3 mat-dialog-title>Delete Product</h3>\n  <div mat-dialog-content>\n    Are you sure? You want to delete the\n    <strong>{{ product?.name }}</strong> ?\n  </div>\n  <div mat-dialog-actions class=\"d-flex justify-content-end gap-1 mb-2\">\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-raised-button\n      color=\"warn\"\n      (click)=\"deleteProduct()\"\n    >\n      Delete\n    </button>\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-flat-button\n      mat-dialog-close\n    >\n      Cancel\n    </button>\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: i7.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductDeleteButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-delete-button", template: "<mat-icon\n  class=\"cursor-pointer text-secondary\"\n  (click)=\"showDeleteDialog(deleteProductDialog)\"\n>\n  delete\n</mat-icon>\n\n<ng-template #deleteProductDialog>\n  <h3 mat-dialog-title>Delete Product</h3>\n  <div mat-dialog-content>\n    Are you sure? You want to delete the\n    <strong>{{ product?.name }}</strong> ?\n  </div>\n  <div mat-dialog-actions class=\"d-flex justify-content-end gap-1 mb-2\">\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-raised-button\n      color=\"warn\"\n      (click)=\"deleteProduct()\"\n    >\n      Delete\n    </button>\n    <button\n      [disabled]=\"isDeleting\"\n      type=\"button\"\n      mat-flat-button\n      mat-dialog-close\n    >\n      Cancel\n    </button>\n  </div>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: i1.MatDialog }, { type: ProductService }, { type: i1$1.AlertService }], propDecorators: { product: [{
-                type: Input
-            }], deleted: [{
-                type: Output
-            }] } });
-
-class ProductBasicInfoComponent {
-    stockSummaryService;
-    product;
-    saved = new EventEmitter();
-    deleted = new EventEmitter();
-    stockSummary;
-    constructor(stockSummaryService) {
-        this.stockSummaryService = stockSummaryService;
-    }
-    ngOnInit() {
-        if (this.product) {
-            this.loadProductStocksSummary();
-        }
-    }
-    onProductSaved(product) {
-        this.product = product;
-        this.saved.emit(this.product);
-    }
-    /**
-     * Load product stocks summary.
-     */
-    loadProductStocksSummary() {
-        const params = {
-            product_ids: this.product?.id,
-            include: "stock_receipts_quantity_sum,stock_issuances_quantity_sum,stock_quantity_remaining",
-        };
-        this.stockSummaryService.summary(params).subscribe({
-            next: (response) => {
-                this.stockSummary = response;
-            },
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductBasicInfoComponent, deps: [{ token: StockSummaryService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductBasicInfoComponent, selector: "app-product-basic-info", inputs: { product: "product" }, outputs: { saved: "saved", deleted: "deleted" }, ngImport: i0, template: "<mat-card *ngIf=\"product\" class=\"w-100\">\n  <mat-card-content\n    class=\"d-flex justify-content-between align-items-center mb-1 mb-2\"\n  >\n    <div class=\"d-flex justify-content-start gap-2\">\n      <span class=\"material-symbols-outlined\"> campaign </span>\n      <strong class=\"mb-0 text-dark\">Product Information</strong>\n    </div>\n    <div class=\"d-flex justify-content-start align-items-center gap-2\">\n      <app-product-form-button\n        [product]=\"product\"\n        (saved)=\"onProductSaved($event)\"\n      ></app-product-form-button>\n      <app-product-delete-button\n        [product]=\"product\"\n        (deleted)=\"deleted.emit()\"\n      ></app-product-delete-button>\n    </div>\n  </mat-card-content>\n  <mat-divider></mat-divider>\n  <mat-card-content class=\"mt-3\">\n    <h3 class=\"mb-1 font-weight-bold\">{{ product?.name }}</h3>\n    <div class=\"d-flex flex-wrap gap-1\">\n      <span\n        class=\"badge badge-primary\"\n        *ngFor=\"let category of product?.categories\"\n      >\n        {{ category?.title }}\n      </span>\n    </div>\n  </mat-card-content>\n\n  <mat-card-content\n    class=\"mt-3 d-flex justify-content-between align-items-start\"\n  >\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">SKU</small>\n      <p class=\"mb-0\">{{ product?.sku }}</p>\n    </div>\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Measure</small>\n      <p class=\"mb-0\">{{ product?.measure?.title }}</p>\n    </div>\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Reorder Point</small>\n      <p class=\"mb-0\">{{ product?.reorder_point }}</p>\n    </div>\n  </mat-card-content>\n\n  <mat-card-content\n    class=\"mt-3 d-flex flex-column justify-content-start align-items-start gap-1\"\n  >\n    <small class=\"text-secondary\">Description</small>\n    <p class=\"mb-0\">{{ product?.description }}</p>\n  </mat-card-content>\n\n  <mat-card-content\n    class=\"mt-5 d-flex justify-content-between align-items-start\"\n  >\n    <div\n      *ngIf=\"stockSummary\"\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Stock Receipts</small>\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <span class=\"material-symbols-outlined\"> arrow_downward </span>\n        <p class=\"mb-0\" style=\"font-size: 24px\">\n          {{ stockSummary?.stock_receipts_quantity_sum }}\n        </p>\n      </div>\n      <small *ngIf=\"product?.last_stock_receipt\" class=\"text-secondary\">\n        Last Added On {{ product?.last_stock_receipt?.date | date }}\n      </small>\n    </div>\n    <div\n      *ngIf=\"stockSummary\"\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Stock Issuances</small>\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <span class=\"material-symbols-outlined\"> ungroup </span>\n        <p class=\"mb-0\" style=\"font-size: 24px\">\n          {{ stockSummary?.stock_issuances_quantity_sum }}\n        </p>\n      </div>\n      <small *ngIf=\"product?.last_stock_issuance\" class=\"text-secondary\">\n        Last Added On {{ product?.last_stock_issuance?.date | date }}\n      </small>\n    </div>\n  </mat-card-content>\n\n  <mat-card-content\n    *ngIf=\"stockSummary\"\n    class=\"mt-3 d-flex justify-content-center align-items-center\"\n  >\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">On Hand</small>\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <span class=\"material-symbols-outlined\"> inventory_2 </span>\n        <p class=\"mb-0\" style=\"font-size: 24px\">\n          {{ stockSummary?.stock_quantity_remaining }}\n        </p>\n      </div>\n    </div>\n  </mat-card-content>\n</mat-card>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i6$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: ProductFormButtonComponent, selector: "app-product-form-button", inputs: ["product"], outputs: ["saved"] }, { kind: "component", type: ProductDeleteButtonComponent, selector: "app-product-delete-button", inputs: ["product"], outputs: ["deleted"] }, { kind: "pipe", type: i4.DatePipe, name: "date" }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductBasicInfoComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-basic-info", template: "<mat-card *ngIf=\"product\" class=\"w-100\">\n  <mat-card-content\n    class=\"d-flex justify-content-between align-items-center mb-1 mb-2\"\n  >\n    <div class=\"d-flex justify-content-start gap-2\">\n      <span class=\"material-symbols-outlined\"> campaign </span>\n      <strong class=\"mb-0 text-dark\">Product Information</strong>\n    </div>\n    <div class=\"d-flex justify-content-start align-items-center gap-2\">\n      <app-product-form-button\n        [product]=\"product\"\n        (saved)=\"onProductSaved($event)\"\n      ></app-product-form-button>\n      <app-product-delete-button\n        [product]=\"product\"\n        (deleted)=\"deleted.emit()\"\n      ></app-product-delete-button>\n    </div>\n  </mat-card-content>\n  <mat-divider></mat-divider>\n  <mat-card-content class=\"mt-3\">\n    <h3 class=\"mb-1 font-weight-bold\">{{ product?.name }}</h3>\n    <div class=\"d-flex flex-wrap gap-1\">\n      <span\n        class=\"badge badge-primary\"\n        *ngFor=\"let category of product?.categories\"\n      >\n        {{ category?.title }}\n      </span>\n    </div>\n  </mat-card-content>\n\n  <mat-card-content\n    class=\"mt-3 d-flex justify-content-between align-items-start\"\n  >\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">SKU</small>\n      <p class=\"mb-0\">{{ product?.sku }}</p>\n    </div>\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Measure</small>\n      <p class=\"mb-0\">{{ product?.measure?.title }}</p>\n    </div>\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Reorder Point</small>\n      <p class=\"mb-0\">{{ product?.reorder_point }}</p>\n    </div>\n  </mat-card-content>\n\n  <mat-card-content\n    class=\"mt-3 d-flex flex-column justify-content-start align-items-start gap-1\"\n  >\n    <small class=\"text-secondary\">Description</small>\n    <p class=\"mb-0\">{{ product?.description }}</p>\n  </mat-card-content>\n\n  <mat-card-content\n    class=\"mt-5 d-flex justify-content-between align-items-start\"\n  >\n    <div\n      *ngIf=\"stockSummary\"\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Stock Receipts</small>\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <span class=\"material-symbols-outlined\"> arrow_downward </span>\n        <p class=\"mb-0\" style=\"font-size: 24px\">\n          {{ stockSummary?.stock_receipts_quantity_sum }}\n        </p>\n      </div>\n      <small *ngIf=\"product?.last_stock_receipt\" class=\"text-secondary\">\n        Last Added On {{ product?.last_stock_receipt?.date | date }}\n      </small>\n    </div>\n    <div\n      *ngIf=\"stockSummary\"\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">Stock Issuances</small>\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <span class=\"material-symbols-outlined\"> ungroup </span>\n        <p class=\"mb-0\" style=\"font-size: 24px\">\n          {{ stockSummary?.stock_issuances_quantity_sum }}\n        </p>\n      </div>\n      <small *ngIf=\"product?.last_stock_issuance\" class=\"text-secondary\">\n        Last Added On {{ product?.last_stock_issuance?.date | date }}\n      </small>\n    </div>\n  </mat-card-content>\n\n  <mat-card-content\n    *ngIf=\"stockSummary\"\n    class=\"mt-3 d-flex justify-content-center align-items-center\"\n  >\n    <div\n      class=\"d-flex flex-column justify-content-start align-items-start gap-1\"\n    >\n      <small class=\"text-secondary\">On Hand</small>\n      <div class=\"d-flex justify-content-start align-items-center gap-2\">\n        <span class=\"material-symbols-outlined\"> inventory_2 </span>\n        <p class=\"mb-0\" style=\"font-size: 24px\">\n          {{ stockSummary?.stock_quantity_remaining }}\n        </p>\n      </div>\n    </div>\n  </mat-card-content>\n</mat-card>\n" }]
-        }], ctorParameters: () => [{ type: StockSummaryService }], propDecorators: { product: [{
-                type: Input
-            }], saved: [{
-                type: Output
-            }], deleted: [{
-                type: Output
-            }] } });
-
-class ProductViewPageComponent {
-    productService;
-    activatedRoute;
-    location;
-    product;
-    id;
-    isLoading;
-    constructor(productService, activatedRoute, location) {
-        this.productService = productService;
-        this.activatedRoute = activatedRoute;
-        this.location = location;
-        this.id = this.activatedRoute.snapshot.params?.["id"];
-    }
-    ngOnInit() {
-        if (this.id) {
-            this.getProduct(this.id);
-        }
-    }
-    /**
-     * Get the product details.
-     *
-     * @param productId
-     */
-    getProduct(productId) {
-        this.isLoading = true;
-        const params = {
-            with: "type,measure,incomeAccount,expenseAccount,categories,lastStockReceipt,lastStockIssuance,taxes.tax.type",
-        };
-        this.productService.show(productId, params).subscribe({
-            next: (result) => {
-                this.isLoading = false;
-                this.product = result?.item;
-            },
-            error: () => (this.isLoading = false),
-        });
-    }
-    /**
-     * Handle the on product update event.
-     *
-     * @param product
-     */
-    onProductUpdated(product) {
-        this.getProduct(this.id);
-    }
-    /**
-     * Handle on product delete event.
-     */
-    onProductDeleted() {
-        this.location.back();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductViewPageComponent, deps: [{ token: ProductService }, { token: i2$1.ActivatedRoute }, { token: i4.Location }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductViewPageComponent, selector: "app-product-view-page", ngImport: i0, template: "<mat-progress-bar mode=\"indeterminate\" *ngIf=\"isLoading\"></mat-progress-bar>\n\n<div\n  *ngIf=\"product\"\n  class=\"d-flex justify-content-start align-items-start gap-3\"\n>\n  <div style=\"width: calc(25% - 1rem)\" class=\"d-flex flex-column gap-3\">\n    <app-product-basic-info\n      [product]=\"product\"\n      #productBasicInfoComponent\n      (deleted)=\"onProductDeleted()\"\n      (saved)=\"onProductUpdated($event)\"\n    ></app-product-basic-info>\n\n    <app-product-tax-list [product]=\"product\"></app-product-tax-list>\n  </div>\n  <div style=\"width: calc(75%)\" class=\"d-flex flex-column gap-3\">\n    <app-stock-receipts-list-page\n      [product]=\"product\"\n      (listUpdated)=\"\n        getProduct(this.id);\n        productBasicInfoComponent.loadProductStocksSummary()\n      \"\n    ></app-stock-receipts-list-page>\n\n    <app-stock-issuances-list\n      [product]=\"product\"\n      (listUpdated)=\"\n        getProduct(this.id);\n        productBasicInfoComponent.loadProductStocksSummary()\n      \"\n    ></app-stock-issuances-list>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StockReceiptsListPageComponent, selector: "app-stock-receipts-list-page", inputs: ["product"], outputs: ["listUpdated"] }, { kind: "component", type: StockIssuancesListComponent, selector: "app-stock-issuances-list", inputs: ["product", "issuableType", "issuableId", "label"], outputs: ["listUpdated"] }, { kind: "component", type: ProductTaxListComponent, selector: "app-product-tax-list", inputs: ["product"] }, { kind: "component", type: i7$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: ProductBasicInfoComponent, selector: "app-product-basic-info", inputs: ["product"], outputs: ["saved", "deleted"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductViewPageComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-view-page", template: "<mat-progress-bar mode=\"indeterminate\" *ngIf=\"isLoading\"></mat-progress-bar>\n\n<div\n  *ngIf=\"product\"\n  class=\"d-flex justify-content-start align-items-start gap-3\"\n>\n  <div style=\"width: calc(25% - 1rem)\" class=\"d-flex flex-column gap-3\">\n    <app-product-basic-info\n      [product]=\"product\"\n      #productBasicInfoComponent\n      (deleted)=\"onProductDeleted()\"\n      (saved)=\"onProductUpdated($event)\"\n    ></app-product-basic-info>\n\n    <app-product-tax-list [product]=\"product\"></app-product-tax-list>\n  </div>\n  <div style=\"width: calc(75%)\" class=\"d-flex flex-column gap-3\">\n    <app-stock-receipts-list-page\n      [product]=\"product\"\n      (listUpdated)=\"\n        getProduct(this.id);\n        productBasicInfoComponent.loadProductStocksSummary()\n      \"\n    ></app-stock-receipts-list-page>\n\n    <app-stock-issuances-list\n      [product]=\"product\"\n      (listUpdated)=\"\n        getProduct(this.id);\n        productBasicInfoComponent.loadProductStocksSummary()\n      \"\n    ></app-stock-issuances-list>\n  </div>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: ProductService }, { type: i2$1.ActivatedRoute }, { type: i4.Location }] });
-
-class ProductImportPageComponent {
-    importConfig = {
-        apiUrl: "api/products-import",
-        title: "Products",
-        importType: "product",
-        properties: [
-            {
-                label: "Name",
-                value: "name",
-                type: "text",
-            },
-            {
-                label: "SKU",
-                value: "sku",
-                type: "text",
-            },
-            {
-                label: "Initial Quantity",
-                value: "initial_quantity",
-                type: "number",
-            },
-            {
-                label: "Initial Quantity Date",
-                value: "initial_quantity_date",
-                type: "date",
-            },
-            {
-                label: "Reorder Point",
-                value: "reorder_point",
-                type: "number",
-            },
-            {
-                label: "Measure",
-                value: "measure",
-                type: "text",
-            },
-            {
-                label: "Categories",
-                value: "categories",
-                type: "text",
-            },
-        ],
-        sampleFile: {
-            name: "Products Import",
-            path: "assets/product/product-import-sample.csv",
-        },
-        importHistory: {
-            isEnabled: true,
-            type: "product",
-            apiUrl: "api/import-histories",
-        },
-        viewRouterLink: "/inventory/products/",
-    };
-    constructor() { }
-    ngOnInit() { }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductImportPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProductImportPageComponent, selector: "app-product-import-page", ngImport: i0, template: "<app-import-csv [config]=\"importConfig\"></app-import-csv>\n", styles: [""], dependencies: [{ kind: "component", type: i1$1.ImportCsvComponent, selector: "app-import-csv", inputs: ["config"] }], preserveWhitespaces: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductImportPageComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "app-product-import-page", template: "<app-import-csv [config]=\"importConfig\"></app-import-csv>\n" }]
-        }], ctorParameters: () => [] });
-
-const routes = [
-    {
-        path: "",
-        component: ProductNavBarComponent,
-        children: [
-            {
-                path: "",
-                component: ProductListComponent,
-                canLoad: [AuthenticationGuard],
-            },
-            {
-                path: "import",
-                component: ProductImportPageComponent,
-                canLoad: [AuthenticationGuard],
-            },
-            {
-                path: "measure",
-                component: ProductMeasuresListComponent,
-                canLoad: [AuthenticationGuard],
-            },
-            {
-                path: ":id/view",
-                component: ProductViewPageComponent,
-                canLoad: [AuthenticationGuard],
-            },
-            {
-                path: "**",
-                redirectTo: "",
-                pathMatch: "full",
-                canLoad: [AuthenticationGuard],
-            },
-        ],
-    },
-];
-class ProductRoutingModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ProductRoutingModule, imports: [i2$1.RouterModule], exports: [RouterModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductRoutingModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [RouterModule.forChild(routes)],
-                    exports: [RouterModule],
-                }]
-        }] });
-
-class ProductTaxModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxModule, declarations: [ProductTaxListComponent,
-            ProductTaxFormButtonComponent,
-            ProductTaxDeleteButtonComponent], imports: [CommonModule,
-            MaterialModule,
-            ReactiveFormsModule,
-            SearchableSelectorModule], exports: [ProductTaxListComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxModule, imports: [CommonModule,
-            MaterialModule,
-            ReactiveFormsModule,
-            SearchableSelectorModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductTaxModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        ProductTaxListComponent,
-                        ProductTaxFormButtonComponent,
-                        ProductTaxDeleteButtonComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        MaterialModule,
-                        ReactiveFormsModule,
-                        SearchableSelectorModule,
-                    ],
-                    exports: [ProductTaxListComponent],
-                }]
-        }] });
-
-class ProductModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ProductModule, declarations: [ProductListComponent,
-            ProductFormComponent,
-            ProductNavBarComponent,
-            ProductMeasuresListComponent,
-            ProductMeasureFormComponent,
-            ProductViewPageComponent,
-            ProductFormButtonComponent,
-            ProductDeleteButtonComponent,
-            ProductBasicInfoComponent,
-            ProductImportPageComponent], imports: [CommonModule,
-            ProductRoutingModule,
-            SearchableSelectorModule,
-            TimelineFilterModule,
-            StockReceiptFormModule,
-            StockIssueFormModule,
-            ImportCsvModule,
-            StockReceiptsModule,
-            StockIssuancesListModule,
-            ProductTaxModule,
-            MaterialModule,
-            MatProgressBarModule,
-            InfiniteScrollModule,
-            FlexModule,
-            ReactiveFormsModule,
-            FormsModule,
-            ColumnSelectorModule], exports: [ProductFormComponent,
-            ProductBasicInfoComponent,
-            ProductFormButtonComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductModule, imports: [CommonModule,
-            ProductRoutingModule,
-            SearchableSelectorModule,
-            TimelineFilterModule,
-            StockReceiptFormModule,
-            StockIssueFormModule,
-            ImportCsvModule,
-            StockReceiptsModule,
-            StockIssuancesListModule,
-            ProductTaxModule,
-            MaterialModule,
-            MatProgressBarModule,
-            InfiniteScrollModule,
-            FlexModule,
-            ReactiveFormsModule,
-            FormsModule,
-            ColumnSelectorModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProductModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        ProductListComponent,
-                        ProductFormComponent,
-                        ProductNavBarComponent,
-                        ProductMeasuresListComponent,
-                        ProductMeasureFormComponent,
-                        ProductViewPageComponent,
-                        ProductFormButtonComponent,
-                        ProductDeleteButtonComponent,
-                        ProductBasicInfoComponent,
-                        ProductImportPageComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        ProductRoutingModule,
-                        SearchableSelectorModule,
-                        TimelineFilterModule,
-                        StockReceiptFormModule,
-                        StockIssueFormModule,
-                        ImportCsvModule,
-                        StockReceiptsModule,
-                        StockIssuancesListModule,
-                        ProductTaxModule,
-                        MaterialModule,
-                        MatProgressBarModule,
-                        InfiniteScrollModule,
-                        FlexModule,
-                        ReactiveFormsModule,
-                        FormsModule,
-                        ColumnSelectorModule,
-                    ],
-                    exports: [
-                        ProductFormComponent,
-                        ProductBasicInfoComponent,
-                        ProductFormButtonComponent,
-                    ],
-                }]
-        }] });
-
-export { ProductModule };
-//# sourceMappingURL=techlify-inventory-common-product.module-BV9Cy88x.mjs.map