tin-spa 20.14.99 → 20.14.113

package/fesm2022/tin-spa-accounting.module-Cg4vWaJE.mjs

@@ -0,0 +1,2231 @@
+import * as i0 from '@angular/core';
+import { Component, inject, ViewChild, NgModule } from '@angular/core';
+import * as i1$2 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import * as i1 from 'tin-spa/core';
+import { AccountingService, MessageService, ApiErrorService, PurchasingService, HttpService, DataServiceLib, ReceiptDialogComponent } from 'tin-spa/core';
+import { T as TilesComponent, a as TabsComponent, P as PageComponent, D as DateComponent, b as TableComponent, S as SelectLiteComponent, c as TinSpaModule, C as ChartsComponent, d as TenantTransferService, e as SpaAdminModule } from './tin-spa-tin-spa-Cqe5hYTr.mjs';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i3 from '@angular/material/button';
+import * as i3$1 from '@angular/material/icon';
+import { HttpClient } from '@angular/common/http';
+import * as i3$2 from '@angular/material/tabs';
+import * as i2 from '@angular/forms';
+import * as i7 from '@angular/material/menu';
+import * as i3$3 from '@angular/material/form-field';
+import * as i4 from '@angular/material/input';
+import * as i6 from '@angular/material/card';
+import * as i4$1 from '@angular/material/dialog';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import * as i7$1 from '@angular/material/select';
+import * as i4$2 from '@angular/material/checkbox';
+
+class AccountsComponent {
+    constructor(dataServiceLib, accountingService) {
+        this.dataServiceLib = dataServiceLib;
+        this.accountingService = accountingService;
+        // Changed: Tile config with Cash, Bank, Income MTD, and Expenses MTD
+        this.accountTileConfig = {
+            tiles: [
+                { name: 'cashBalance', alias: 'Cash', color: '#4CAF50', icon: 'payments', style: 'icon', info: 'Total balance of all cash accounts' },
+                { name: 'bankBalance', alias: 'Bank', color: '#2196F3', icon: 'account_balance', style: 'icon', info: 'Total balance of all bank accounts' },
+                { name: 'mtdIncome', alias: 'Income (MTD)', color: '#9C27B0', icon: 'trending_up', style: 'icon', info: 'Month-to-date income from revenue accounts' },
+                { name: 'mtdExpenses', alias: 'Expenses (MTD)', color: '#F44336', icon: 'trending_down', style: 'icon', info: 'Month-to-date expenses' },
+            ],
+            loadAction: { url: 'accounts/summary/tiles' },
+            loadInit: true
+        };
+        this.accountTabConfigs = [
+            {
+                ...this.accountingService.accountsTableConfig,
+                tabTitle: 'Assets',
+                loadAction: { url: 'accounts/type/asset' },
+                countAction: { url: 'accounts/count/asset' }
+            },
+            {
+                ...this.accountingService.accountsTableConfig,
+                tabTitle: 'Liabilities',
+                loadAction: { url: 'accounts/type/liability' },
+                countAction: { url: 'accounts/count/liability' }
+            },
+            {
+                ...this.accountingService.accountsTableConfig,
+                tabTitle: 'Income',
+                loadAction: { url: 'accounts/type/income' },
+                countAction: { url: 'accounts/count/income' }
+            },
+            {
+                ...this.accountingService.accountsTableConfig,
+                tabTitle: 'Expenses',
+                loadAction: { url: 'accounts/type/expense' },
+                countAction: { url: 'accounts/count/expense' }
+            },
+            {
+                ...this.accountingService.accountsTableConfig,
+                tabTitle: 'Equity',
+                loadAction: { url: 'accounts/type/equity' },
+                countAction: { url: 'accounts/count/equity' }
+            },
+            // Removed: Aggregate tab - no longer used
+        ];
+    }
+    ngOnInit() {
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountsComponent, deps: [{ token: i1.DataServiceLib }, { token: i1.AccountingService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: AccountsComponent, isStandalone: false, selector: "spa-accounts", ngImport: i0, template: `
+    <h4>Accounts</h4>
+    <hr>
+
+    <spa-tiles [config]="accountTileConfig"></spa-tiles>
+
+    <spa-tabs [tableConfigs]="accountTabConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "reloadTab", "parentDetails", "localMode", "nestingLevel"], outputs: ["formRefresh", "actionSuccess"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-accounts',
+                    template: `
+    <h4>Accounts</h4>
+    <hr>
+
+    <spa-tiles [config]="accountTileConfig"></spa-tiles>
+
+    <spa-tabs [tableConfigs]="accountTabConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i1.DataServiceLib }, { type: i1.AccountingService }] });
+
+// Accounting Aggregates component with monthly aggregated financial data
+class AggregatesComponent {
+    constructor(dataServiceLib, accountingService) {
+        this.dataServiceLib = dataServiceLib;
+        this.accountingService = accountingService;
+        this.aggregateTabConfigs = [
+            {
+                ...this.accountingService.aggregatesTableConfig,
+                tabTitle: 'Monthly Summary',
+                loadAction: { url: 'accounts/aggregates/monthly' },
+            },
+            {
+                ...this.accountingService.cashFlowAggregatesTableConfig,
+                tabTitle: 'Cash Flow',
+                loadAction: { url: 'accounts/aggregates/cashflow' },
+            },
+            {
+                ...this.accountingService.cumulativeAggregatesTableConfig,
+                tabTitle: 'Cumulative Balances',
+                loadAction: { url: 'accounts/aggregates/cumulative' },
+            },
+            {
+                ...this.accountingService.balanceSheetAggregatesTableConfig,
+                tabTitle: 'Balance Sheet',
+                loadAction: { url: 'accounts/aggregates/balancesheet' },
+            }
+        ];
+    }
+    ngOnInit() {
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AggregatesComponent, deps: [{ token: i1.DataServiceLib }, { token: i1.AccountingService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: AggregatesComponent, isStandalone: false, selector: "spa-aggregates", ngImport: i0, template: `
+    <h4>Aggregates</h4>
+    <hr>
+
+    <spa-tabs [tableConfigs]="aggregateTabConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "reloadTab", "parentDetails", "localMode", "nestingLevel"], outputs: ["formRefresh", "actionSuccess"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AggregatesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-aggregates',
+                    template: `
+    <h4>Aggregates</h4>
+    <hr>
+
+    <spa-tabs [tableConfigs]="aggregateTabConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i1.DataServiceLib }, { type: i1.AccountingService }] });
+
+// Aging report component for accounts receivable tracking
+class AgingComponent {
+    ngOnInit() {
+        this.loadSummaryData();
+    }
+    loadSummaryData() {
+        this.dataServiceLib.CallApi({ url: 'invoices/aging-summary/x' }, '').subscribe((apiResponse) => {
+            if (apiResponse.success) {
+                this.summaryData = apiResponse.data;
+            }
+            else {
+                this.apiErrorService.presentAppFailure(apiResponse, 'load', 'invoices/aging-summary/x'); // Added: was silent. summaryData stayed undefined, the *ngIf dropped the whole tile strip, and an accounts-receivable page with NO aging totals reads as "you are owed nothing" rather than "we could not work it out"
+            }
+        });
+    }
+    // Changed: Post IFRS 9 bad-debt provision — confirms, calls invoices provision custom action, shows returned summary
+    postProvision() {
+        this.messageService.confirm('Post the bad-debt provision? This posts the allowance delta per the aging matrix as a GL journal.').subscribe((result) => {
+            if (result == 'yes') {
+                this.dataServiceLib.CallApi({ url: 'invoices?action=provision', method: 'post' }, {}).subscribe((apiResponse) => {
+                    // Changed: REPLACES the old `'Error: ' + apiResponse.message` toast rather than layering on it.
+                    // That string prefixed the server's raw words with a second word for "error" and pushed the useful
+                    // part right; a leaked SQL fragment reached the user unchanged. 'action' rather than 'submit' —
+                    // this is a confirmed page button, not a form, so the 'submit' copy would describe a screen the
+                    // user is not looking at.
+                    if (apiResponse.success) {
+                        this.messageService.toast(apiResponse.message);
+                        this.loadSummaryData();
+                    }
+                    else
+                        this.apiErrorService.presentAppFailure(apiResponse, 'action', 'invoices?action=provision');
+                });
+            }
+        });
+    }
+    constructor(dataServiceLib) {
+        this.dataServiceLib = dataServiceLib;
+        this.accountingService = inject(AccountingService);
+        this.messageService = inject(MessageService); // Changed: Injected for provision confirm/toast
+        this.apiErrorService = inject(ApiErrorService); // Changed: Injected for the summary load and the provision failure
+        this.tileConfig = this.accountingService.agingTileConfig;
+        // this.tileConfig = this.accountingService.agingTileConfig;
+        this.agingTableConfigs = [
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: 'Current',
+                loadAction: { url: 'invoices/aging-current/x' },
+                countAction: { url: 'invoices/count/aging-current' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '1-30 Days',
+                loadAction: { url: 'invoices/aging-30/x' },
+                countAction: { url: 'invoices/count/aging-30' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '31-60 Days',
+                loadAction: { url: 'invoices/aging-60/x' },
+                countAction: { url: 'invoices/count/aging-60' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '61-90 Days',
+                loadAction: { url: 'invoices/aging-90/x' },
+                countAction: { url: 'invoices/count/aging-90' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '90+ Days',
+                loadAction: { url: 'invoices/aging-90plus/x' },
+                countAction: { url: 'invoices/count/aging-90plus' }
+            }
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AgingComponent, deps: [{ token: i1.DataServiceLib }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: AgingComponent, isStandalone: false, selector: "spa-aging", ngImport: i0, template: `
+    <div style="display: flex; align-items: center; justify-content: space-between;">
+      <h4>Accounts Receivable Aging</h4>
+      <!-- Changed: Post IFRS 9 bad-debt provision delta from the aging matrix -->
+      <button mat-stroked-button color="warn" (click)="postProvision()"><mat-icon>account_balance</mat-icon> Post Bad-Debt Provision</button>
+    </div>
+    <hr>
+    <div *ngIf="summaryData" class="mt-3 mb-3">
+      <spa-tiles [config]="tileConfig" [data]="summaryData"></spa-tiles>
+    </div>
+    
+    <spa-tabs [tableConfigs]="agingTableConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "reloadTab", "parentDetails", "localMode", "nestingLevel"], outputs: ["formRefresh", "actionSuccess"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AgingComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-aging',
+                    template: `
+    <div style="display: flex; align-items: center; justify-content: space-between;">
+      <h4>Accounts Receivable Aging</h4>
+      <!-- Changed: Post IFRS 9 bad-debt provision delta from the aging matrix -->
+      <button mat-stroked-button color="warn" (click)="postProvision()"><mat-icon>account_balance</mat-icon> Post Bad-Debt Provision</button>
+    </div>
+    <hr>
+    <div *ngIf="summaryData" class="mt-3 mb-3">
+      <spa-tiles [config]="tileConfig" [data]="summaryData"></spa-tiles>
+    </div>
+    
+    <spa-tabs [tableConfigs]="agingTableConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i1.DataServiceLib }] });
+
+// AP Aging report component for accounts payable tracking — mirrors AR AgingComponent pattern
+class SupplierAgingComponent {
+    ngOnInit() {
+        this.loadSummaryData();
+    }
+    loadSummaryData() {
+        this.dataServiceLib.CallApi({ url: 'purchases/aging-summary/x' }, '').subscribe((apiResponse) => {
+            if (apiResponse.success) {
+                this.summaryData = apiResponse.data;
+            }
+            else {
+                this.apiErrorService.presentAppFailure(apiResponse, 'load', 'purchases/aging-summary/x'); // Added: was silent. The tile strip vanished behind its *ngIf, so an accounts-payable page that could not compute its totals looked like a company that owes nothing
+            }
+        });
+    }
+    constructor(dataServiceLib) {
+        this.dataServiceLib = dataServiceLib;
+        this.purchasingService = inject(PurchasingService);
+        this.apiErrorService = inject(ApiErrorService); // Changed: Injected so a failed summary load says so
+        this.tileConfig = this.purchasingService.apAgingTileConfig;
+        // Changed: Build 5-tab aging table layout using AP aging base config from PurchasingService
+        this.agingTableConfigs = [
+            {
+                ...this.purchasingService.apAgingBaseTableConfig,
+                tabTitle: 'Current',
+                loadAction: { url: 'purchases/aging-current/x' },
+                countAction: { url: 'purchases/count/aging-current' }
+            },
+            {
+                ...this.purchasingService.apAgingBaseTableConfig,
+                tabTitle: '1-30 Days',
+                loadAction: { url: 'purchases/aging-30/x' },
+                countAction: { url: 'purchases/count/aging-30' }
+            },
+            {
+                ...this.purchasingService.apAgingBaseTableConfig,
+                tabTitle: '31-60 Days',
+                loadAction: { url: 'purchases/aging-60/x' },
+                countAction: { url: 'purchases/count/aging-60' }
+            },
+            {
+                ...this.purchasingService.apAgingBaseTableConfig,
+                tabTitle: '61-90 Days',
+                loadAction: { url: 'purchases/aging-90/x' },
+                countAction: { url: 'purchases/count/aging-90' }
+            },
+            {
+                ...this.purchasingService.apAgingBaseTableConfig,
+                tabTitle: '90+ Days',
+                loadAction: { url: 'purchases/aging-90plus/x' },
+                countAction: { url: 'purchases/count/aging-90plus' }
+            }
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: SupplierAgingComponent, deps: [{ token: i1.DataServiceLib }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: SupplierAgingComponent, isStandalone: false, selector: "spa-supplier-aging", ngImport: i0, template: `
+    <h4>Accounts Payable Aging</h4>
+    <hr>
+    <div *ngIf="summaryData" class="mt-3 mb-3">
+      <spa-tiles [config]="tileConfig" [data]="summaryData"></spa-tiles>
+    </div>
+
+    <spa-tabs [tableConfigs]="agingTableConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "reloadTab", "parentDetails", "localMode", "nestingLevel"], outputs: ["formRefresh", "actionSuccess"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: SupplierAgingComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-supplier-aging',
+                    template: `
+    <h4>Accounts Payable Aging</h4>
+    <hr>
+    <div *ngIf="summaryData" class="mt-3 mb-3">
+      <spa-tiles [config]="tileConfig" [data]="summaryData"></spa-tiles>
+    </div>
+
+    <spa-tabs [tableConfigs]="agingTableConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i1.DataServiceLib }] });
+
+class TransactionTypesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Transaction Types',
+            tableConfig: this.accountingService.transactionTypesTableConfig
+        };
+    }
+    ngOnInit() {
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TransactionTypesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: TransactionTypesComponent, isStandalone: false, selector: "spa-transaction-types", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TransactionTypesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-transaction-types',
+                    template: '<spa-page [config]="pageConfig"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// Transactions page
+// Changed (journal-dialog-conform): the "New Journal" button used to be drawn HERE, in a flex row above <spa-page>,
+// which floated it on the app shell outside the page. It is now journalCreateButton on transactionsTableConfig with
+// inHeader: true, so the table header renders it in line with Create Transaction. The hand-rolled
+// JournalEntryDialogComponent it opened is gone — the button now carries the house details dialog config.
+class TransactionsComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Transactions',
+            tableConfig: this.accountingService.transactionsTableConfig,
+            searchTableConfig: this.accountingService.transactionSearchTableConfig // Changed: Enable search mode with date range, description, account filters
+        };
+    }
+    ngOnInit() {
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TransactionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: TransactionsComponent, isStandalone: false, selector: "spa-transactions", ngImport: i0, template: `<spa-page [config]="pageConfig"></spa-page>`, isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TransactionsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-transactions',
+                    template: `<spa-page [config]="pageConfig"></spa-page>`,
+                    standalone: false
+                }]
+        }] });
+
+// Invoice management component for tin-spa library
+class InvoicesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.messageService = inject(MessageService);
+        this.pageConfig = {
+            title: 'Invoices',
+            tableConfig: this.accountingService.invoicesTableConfig
+        };
+    }
+    ngOnInit() {
+    }
+    // Handle action click events from the table
+    actionClicked(event) {
+        if (event.name === 'pdf') {
+            this.messageService.confirm(`Download Invoice ?`).subscribe((result) => {
+                if (result == "yes") {
+                    this.download(event.data);
+                }
+            });
+        }
+    }
+    // Download invoice as PDF
+    download(invoice) {
+        this.http.post(`${this.httpService.apiUrl}invoices/pdf?action=x`, invoice, { responseType: 'blob' })
+            .subscribe((response) => {
+            const blob = new Blob([response], { type: 'application/pdf' });
+            const url = window.URL.createObjectURL(blob);
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = `Invoice_${invoice.invoiceID}.pdf`;
+            link.click();
+            window.URL.revokeObjectURL(url);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: InvoicesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: InvoicesComponent, isStandalone: false, selector: "spa-invoices", ngImport: i0, template: '<spa-page [config]="pageConfig" (actionClick)="actionClicked($event)"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: InvoicesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-invoices',
+                    template: '<spa-page [config]="pageConfig" (actionClick)="actionClicked($event)"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// Statement page (B4) — invoice history plus open-item customer/supplier statements with Excel/PDF export
+// Changed: the two open-item tabs were hand-written markup (a flex row of totals and a raw <table>). They are
+// now the library's own spa-tiles + spa-table, driven by config in AccountingService, so the page picks up
+// every table behaviour centrally: responsive minColumns, the filter box, money formatting and empty states.
+// The PDF and Excel downloads are untouched — both are produced SERVER-SIDE and nothing here contributes to them.
+class StatementComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.pageConfig = {
+            title: 'Statement',
+            tableConfig: this.accountingService.statementTableConfig,
+            searchTableConfig: this.accountingService.statementSearchTableConfig
+        };
+        // Per-kind UI state for the customer/supplier open-item tabs.
+        // Changed: each kind carries its OWN cloned table config — two grids are on screen at once and a TableConfig
+        // is mutated by the table it belongs to, so sharing one object between the tabs would cross their state.
+        this.state = {
+            customer: {
+                entityLabel: 'Customer', entityId: null, from: null, to: null, data: null, lines: [],
+                listAction: { url: 'customers/list/x' },
+                tileConfig: this.accountingService.customerStatementTileConfig,
+                tableConfig: { ...this.accountingService.statementLinesTableConfig }
+            },
+            supplier: {
+                entityLabel: 'Supplier', entityId: null, from: null, to: null, data: null, lines: [],
+                listAction: { url: 'suppliers/list/x' },
+                tileConfig: this.accountingService.supplierStatementTileConfig,
+                tableConfig: { ...this.accountingService.statementLinesTableConfig }
+            }
+        };
+    }
+    // Changed: the customer/supplier option lists are loaded by spa-select-lite's own loadAction now, so there is
+    // no hand-rolled options fetch left here. ngOnInit is kept for the interface and for future per-kind defaults.
+    ngOnInit() { }
+    query(kind) {
+        const s = this.state[kind];
+        const params = [];
+        if (s.from)
+            params.push(`from=${s.from}`);
+        if (s.to)
+            params.push(`to=${s.to}`);
+        return params.length ? `?${params.join('&')}` : '';
+    }
+    load(kind) {
+        const s = this.state[kind];
+        if (!s.entityId)
+            return; // Added: the header refresh icon routes here too, and it must not fire before an entity is chosen
+        this.http.get(`${this.httpService.apiUrl}reports/${kind}-statement/${s.entityId}${this.query(kind)}`)
+            .subscribe(res => {
+            s.data = res?.data ?? res?.Data ?? null;
+            s.lines = s.data?.lines ?? []; // Changed: held as a stable reference — binding `data.lines || []` inline would hand spa-table a new array on every change-detection pass
+        });
+    }
+    // C8: open-item customer statement as PDF — generated entirely server-side (reports/pdf/customer-statement);
+    // this method only asks for the blob and saves it. Unchanged by the page rewrite.
+    exportPdf(kind) {
+        const s = this.state[kind];
+        this.http.get(`${this.httpService.apiUrl}reports/pdf/${kind}-statement${this.query(kind) ? this.query(kind) + '&' : '?'}${kind}Id=${s.entityId}`, { responseType: 'blob' })
+            .subscribe((response) => {
+            const url = window.URL.createObjectURL(new Blob([response], { type: 'application/pdf' }));
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = `${kind}-statement-${s.entityId}.pdf`;
+            link.click();
+            window.URL.revokeObjectURL(url);
+        });
+    }
+    export(kind) {
+        const s = this.state[kind];
+        this.http.get(`${this.httpService.apiUrl}reports/export/${kind}-statement${this.query(kind) ? this.query(kind) + '&' : '?'}${kind}Id=${s.entityId}`, { responseType: 'blob' })
+            .subscribe((response) => {
+            const url = window.URL.createObjectURL(new Blob([response], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }));
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = `${kind}-statement-${s.entityId}.xlsx`;
+            link.click();
+            window.URL.revokeObjectURL(url);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: StatementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: StatementComponent, isStandalone: false, selector: "spa-statement", ngImport: i0, template: `
+    <mat-tab-group>
+      <mat-tab label="Invoice History">
+        <div style="padding-top: 8px;">
+          <spa-page [config]="pageConfig"></spa-page>
+        </div>
+      </mat-tab>
+
+      <mat-tab label="Customer Statement">
+        <ng-container *ngTemplateOutlet="statementTab; context: { kind: 'customer' }"></ng-container>
+      </mat-tab>
+
+      <mat-tab label="Supplier Statement">
+        <ng-container *ngTemplateOutlet="statementTab; context: { kind: 'supplier' }"></ng-container>
+      </mat-tab>
+    </mat-tab-group>
+
+    <ng-template #statementTab let-kind="kind">
+      <div style="padding: 16px 0;">
+
+        <!-- Changed: library inputs instead of raw mat-form-field markup — same three filters, same Run/Export/PDF rules -->
+        <div style="display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 12px;">
+          <spa-select-lite [display]="state[kind].entityLabel" [loadAction]="state[kind].listAction" optionDisplay="name" optionValue="value" [required]="false" [(value)]="state[kind].entityId" width="240px"></spa-select-lite><!-- optionDisplay/optionValue are NOT defaulted by spa-select-common; without them every option binds undefined and nothing can be selected -->
+          <spa-date display="From" width="170px" [required]="false" [value]="state[kind].from" (valueChange)="state[kind].from = $event"></spa-date>
+          <spa-date display="To" width="170px" [required]="false" [value]="state[kind].to" (valueChange)="state[kind].to = $event"></spa-date>
+          <button mat-flat-button color="primary" (click)="load(kind)" [disabled]="!state[kind].entityId">Run</button>
+          <button mat-stroked-button (click)="export(kind)" [disabled]="!state[kind].entityId">
+            <mat-icon>download</mat-icon> Export to Excel
+          </button>
+          <button mat-stroked-button *ngIf="kind === 'customer'" (click)="exportPdf(kind)" [disabled]="!state[kind].entityId">
+            <mat-icon>picture_as_pdf</mat-icon> Download PDF
+          </button>
+        </div>
+
+        <!-- Changed: totals are spa-tiles, lines are spa-table. Nothing renders until a statement has been run,
+             which is exactly what the old *ngIf on the results card did. -->
+        <ng-container *ngIf="state[kind].data">
+          <spa-tiles [config]="state[kind].tileConfig" [data]="state[kind].data"></spa-tiles>
+          <div style="margin-top: 12px;">
+            <spa-table [config]="state[kind].tableConfig" [data]="state[kind].lines" (refreshClick)="load(kind)"></spa-table>
+          </div>
+        </ng-container>
+
+      </div>
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i3$2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: DateComponent, selector: "spa-date", inputs: ["required", "min", "max", "boundContext", "readonly", "hint", "value", "display", "placeholder", "width", "suffix", "infoMessage", "copyContent", "clearContent"], outputs: ["valueChange"] }, { kind: "component", type: TableComponent, selector: "spa-table", inputs: ["data", "tileData", "config", "localMode", "parentDetails", "reload", "activeTab", "inTab", "nestingLevel"], outputs: ["dataLoad", "totalChange", "actionSuccess", "refreshClick", "searchClick", "createClick", "actionClick", "inputChange", "actionResponse"] }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }, { kind: "component", type: SelectLiteComponent, selector: "spa-select-lite" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: StatementComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-statement',
+                    template: `
+    <mat-tab-group>
+      <mat-tab label="Invoice History">
+        <div style="padding-top: 8px;">
+          <spa-page [config]="pageConfig"></spa-page>
+        </div>
+      </mat-tab>
+
+      <mat-tab label="Customer Statement">
+        <ng-container *ngTemplateOutlet="statementTab; context: { kind: 'customer' }"></ng-container>
+      </mat-tab>
+
+      <mat-tab label="Supplier Statement">
+        <ng-container *ngTemplateOutlet="statementTab; context: { kind: 'supplier' }"></ng-container>
+      </mat-tab>
+    </mat-tab-group>
+
+    <ng-template #statementTab let-kind="kind">
+      <div style="padding: 16px 0;">
+
+        <!-- Changed: library inputs instead of raw mat-form-field markup — same three filters, same Run/Export/PDF rules -->
+        <div style="display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 12px;">
+          <spa-select-lite [display]="state[kind].entityLabel" [loadAction]="state[kind].listAction" optionDisplay="name" optionValue="value" [required]="false" [(value)]="state[kind].entityId" width="240px"></spa-select-lite><!-- optionDisplay/optionValue are NOT defaulted by spa-select-common; without them every option binds undefined and nothing can be selected -->
+          <spa-date display="From" width="170px" [required]="false" [value]="state[kind].from" (valueChange)="state[kind].from = $event"></spa-date>
+          <spa-date display="To" width="170px" [required]="false" [value]="state[kind].to" (valueChange)="state[kind].to = $event"></spa-date>
+          <button mat-flat-button color="primary" (click)="load(kind)" [disabled]="!state[kind].entityId">Run</button>
+          <button mat-stroked-button (click)="export(kind)" [disabled]="!state[kind].entityId">
+            <mat-icon>download</mat-icon> Export to Excel
+          </button>
+          <button mat-stroked-button *ngIf="kind === 'customer'" (click)="exportPdf(kind)" [disabled]="!state[kind].entityId">
+            <mat-icon>picture_as_pdf</mat-icon> Download PDF
+          </button>
+        </div>
+
+        <!-- Changed: totals are spa-tiles, lines are spa-table. Nothing renders until a statement has been run,
+             which is exactly what the old *ngIf on the results card did. -->
+        <ng-container *ngIf="state[kind].data">
+          <spa-tiles [config]="state[kind].tileConfig" [data]="state[kind].data"></spa-tiles>
+          <div style="margin-top: 12px;">
+            <spa-table [config]="state[kind].tableConfig" [data]="state[kind].lines" (refreshClick)="load(kind)"></spa-table>
+          </div>
+        </ng-container>
+
+      </div>
+    </ng-template>
+  `,
+                    standalone: false
+                }]
+        }] });
+
+// Financial Reports component with Trial Balance, P&L, Balance Sheet, General Ledger tabs + Excel exports (B5/B7) and from/to date range (Phase 1)
+class ReportsComponent {
+    constructor(dataServiceLib, accountingService) {
+        this.dataServiceLib = dataServiceLib;
+        this.accountingService = accountingService;
+        this.httpService = inject(HttpService); // Changed: For export downloads
+        this.http = inject(HttpClient); // Changed: For export downloads
+        this.from = ''; // Changed: Optional report period start
+        this.to = ''; // Changed: Optional report period end
+        this.reportTabConfigs = [];
+        this.buildTabs(); // Changed: Tabs built via method so Run can rebuild with date params
+    }
+    ngOnInit() {
+    }
+    // Changed: Append from/to query params when set — backends that ignore them are unaffected
+    withRange(url) {
+        const params = [];
+        if (this.from)
+            params.push(`from=${this.from}`);
+        if (this.to)
+            params.push(`to=${this.to}`);
+        return params.length ? `${url}?${params.join('&')}` : url;
+    }
+    // Changed: Rebuild tab configs with the current date range applied to every report URL
+    buildTabs() {
+        this.reportTabConfigs = [
+            {
+                ...this.accountingService.trialBalanceTableConfig,
+                tabTitle: 'Trial Balance',
+                loadAction: { url: this.withRange('accounts/reports/trialbalance') },
+            },
+            {
+                ...this.accountingService.pnlTableConfig,
+                tabTitle: 'Profit & Loss',
+                loadAction: { url: this.withRange('accounts/reports/pnl') },
+            },
+            {
+                ...this.accountingService.balanceSheetReportTableConfig,
+                tabTitle: 'Balance Sheet',
+                loadAction: { url: this.withRange('accounts/reports/balancesheet') },
+            },
+            {
+                ...this.accountingService.generalLedgerTableConfig,
+                tabTitle: 'General Ledger',
+                loadAction: { url: this.withRange('reports/gl') },
+            },
+            {
+                ...this.accountingService.cashFlowTableConfig,
+                tabTitle: 'Cash Flow',
+                loadAction: { url: this.withRange('reports/cash-flow') },
+            },
+            {
+                ...this.accountingService.equityChangesTableConfig,
+                tabTitle: 'Changes in Equity',
+                loadAction: { url: this.withRange('reports/equity-changes') },
+            }
+        ];
+    }
+    // Changed: Download an xlsx export from the shared reports endpoint (B7) with the selected date range applied
+    export(report) {
+        this.http.get(`${this.httpService.apiUrl}${this.withRange(`reports/export/${report}`)}`, { responseType: 'blob' })
+            .subscribe((response) => {
+            const url = window.URL.createObjectURL(new Blob([response], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }));
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = `${report}.xlsx`;
+            link.click();
+            window.URL.revokeObjectURL(url);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ReportsComponent, deps: [{ token: i1.DataServiceLib }, { token: i1.AccountingService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ReportsComponent, isStandalone: false, selector: "spa-reports", ngImport: i0, template: `
+    <div style="display: flex; align-items: center; justify-content: space-between;">
+      <h4>Financial Reports</h4>
+      <button mat-stroked-button [matMenuTriggerFor]="exportMenu">
+        <mat-icon>download</mat-icon> Export to Excel
+      </button>
+      <mat-menu #exportMenu="matMenu">
+        <button mat-menu-item (click)="export('trial-balance')">Trial Balance</button>
+        <button mat-menu-item (click)="export('pnl')">Profit &amp; Loss</button>
+        <button mat-menu-item (click)="export('balance-sheet')">Balance Sheet</button>
+        <button mat-menu-item (click)="export('gl')">General Ledger</button>
+        <button mat-menu-item (click)="export('vat-return')">VAT Return (current month)</button>
+        <button mat-menu-item (click)="export('cash-flow')">Cash Flow (current month)</button>
+        <button mat-menu-item (click)="export('equity-changes')">Changes in Equity (current month)</button>
+      </mat-menu>
+    </div>
+    <hr>
+
+    <!-- Changed: From/To date range controls applied to all report tabs (pattern copied from VatReturnComponent) -->
+    <div style="display: flex; gap: 16px; align-items: center; margin-bottom: 16px;">
+      <mat-form-field>
+        <mat-label>From</mat-label>
+        <input matInput type="date" [(ngModel)]="from">
+      </mat-form-field>
+      <mat-form-field>
+        <mat-label>To</mat-label>
+        <input matInput type="date" [(ngModel)]="to">
+      </mat-form-field>
+      <button mat-flat-button color="primary" (click)="buildTabs()">Run</button>
+    </div>
+
+    <spa-tabs [tableConfigs]="reportTabConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "reloadTab", "parentDetails", "localMode", "nestingLevel"], outputs: ["formRefresh", "actionSuccess"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ReportsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-reports',
+                    template: `
+    <div style="display: flex; align-items: center; justify-content: space-between;">
+      <h4>Financial Reports</h4>
+      <button mat-stroked-button [matMenuTriggerFor]="exportMenu">
+        <mat-icon>download</mat-icon> Export to Excel
+      </button>
+      <mat-menu #exportMenu="matMenu">
+        <button mat-menu-item (click)="export('trial-balance')">Trial Balance</button>
+        <button mat-menu-item (click)="export('pnl')">Profit &amp; Loss</button>
+        <button mat-menu-item (click)="export('balance-sheet')">Balance Sheet</button>
+        <button mat-menu-item (click)="export('gl')">General Ledger</button>
+        <button mat-menu-item (click)="export('vat-return')">VAT Return (current month)</button>
+        <button mat-menu-item (click)="export('cash-flow')">Cash Flow (current month)</button>
+        <button mat-menu-item (click)="export('equity-changes')">Changes in Equity (current month)</button>
+      </mat-menu>
+    </div>
+    <hr>
+
+    <!-- Changed: From/To date range controls applied to all report tabs (pattern copied from VatReturnComponent) -->
+    <div style="display: flex; gap: 16px; align-items: center; margin-bottom: 16px;">
+      <mat-form-field>
+        <mat-label>From</mat-label>
+        <input matInput type="date" [(ngModel)]="from">
+      </mat-form-field>
+      <mat-form-field>
+        <mat-label>To</mat-label>
+        <input matInput type="date" [(ngModel)]="to">
+      </mat-form-field>
+      <button mat-flat-button color="primary" (click)="buildTabs()">Run</button>
+    </div>
+
+    <spa-tabs [tableConfigs]="reportTabConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i1.DataServiceLib }, { type: i1.AccountingService }] });
+
+// Tax Rates management page - CRUD for VAT tax rates
+class TaxRatesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Tax Rates',
+            tableConfig: this.accountingService.taxRatesTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TaxRatesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: TaxRatesComponent, isStandalone: true, selector: "spa-tax-rates", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "ngmodule", type: TinSpaModule }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TaxRatesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-tax-rates',
+                    standalone: true,
+                    imports: [TinSpaModule],
+                    template: '<spa-page [config]="pageConfig"></spa-page>'
+                }]
+        }] });
+
+// Standing Orders management page — CRUD for recurring scheduled transactions
+class StandingOrdersComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Standing Orders',
+            tableConfig: this.accountingService.standingOrdersTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: StandingOrdersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: StandingOrdersComponent, isStandalone: true, selector: "spa-standing-orders", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "ngmodule", type: TinSpaModule }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: StandingOrdersComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-standing-orders',
+                    standalone: true,
+                    imports: [TinSpaModule],
+                    template: '<spa-page [config]="pageConfig"></spa-page>'
+                }]
+        }] });
+
+// Currency management page - CRUD for multi-currency support
+class CurrenciesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Currencies',
+            tableConfig: this.accountingService.currenciesTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: CurrenciesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: CurrenciesComponent, isStandalone: true, selector: "spa-currencies", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "ngmodule", type: TinSpaModule }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: CurrenciesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-currencies',
+                    standalone: true,
+                    imports: [TinSpaModule],
+                    template: '<spa-page [config]="pageConfig"></spa-page>'
+                }]
+        }] });
+
+// Budget management component for CRUD operations
+class BudgetsComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Budgets',
+            tableConfig: this.accountingService.budgetsTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BudgetsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: BudgetsComponent, isStandalone: false, selector: "spa-budgets", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BudgetsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-budgets',
+                    template: '<spa-page [config]="pageConfig"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// Budget vs Actual report component with budget selector, tiles, and tabbed tables
+class BudgetVsActualComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.httpService = inject(HttpService);
+        this.selectedBudgetID = null;
+        this.reportTabConfigs = [];
+        this.summaryTileConfig = { ...this.accountingService.budgetSummaryTileConfig };
+    }
+    // Load report data when a budget is selected
+    onBudgetSelected() {
+        if (!this.selectedBudgetID) {
+            this.reportTabConfigs = [];
+            return;
+        }
+        // Update tile config to load summary for selected budget
+        this.summaryTileConfig = {
+            ...this.accountingService.budgetSummaryTileConfig,
+            loadAction: { url: `budgetreport/summary/${this.selectedBudgetID}` }
+        };
+        // Build tab configs with dynamic URLs for selected budget
+        this.reportTabConfigs = [
+            {
+                ...this.accountingService.budgetVsActualByPeriodTableConfig,
+                loadAction: { url: `budgetreport/vsactual/${this.selectedBudgetID}` }
+            },
+            {
+                ...this.accountingService.budgetVsActualByAccountTableConfig,
+                loadAction: { url: `budgetreport/summary/${this.selectedBudgetID}` }
+            }
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BudgetVsActualComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: BudgetVsActualComponent, isStandalone: false, selector: "spa-budget-vs-actual", ngImport: i0, template: `
+    <h4>Budget vs Actual</h4>
+    <hr>
+
+    <div style="max-width: 300px; margin-bottom: 16px;">
+      <spa-select-lite display="Select Budget" [loadAction]="{ url: 'budgets/list/x' }" optionDisplay="name" optionValue="value" [(value)]="selectedBudgetID" (valueChange)="onBudgetSelected()"></spa-select-lite><!-- Changed: optionDisplay/optionValue are NOT defaulted by spa-select-common (both default to ""), so every option rendered blank and bound undefined — no budget could be picked. 'name'/'value' match BaseController.GetList's ListOption shape, same as the statement page -->
+    </div>
+
+    <spa-tiles *ngIf="summaryTileConfig.loadAction" [config]="summaryTileConfig"></spa-tiles>
+
+    <spa-tabs *ngIf="reportTabConfigs.length > 0" [tableConfigs]="reportTabConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "reloadTab", "parentDetails", "localMode", "nestingLevel"], outputs: ["formRefresh", "actionSuccess"] }, { kind: "component", type: SelectLiteComponent, selector: "spa-select-lite" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BudgetVsActualComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-budget-vs-actual',
+                    template: `
+    <h4>Budget vs Actual</h4>
+    <hr>
+
+    <div style="max-width: 300px; margin-bottom: 16px;">
+      <spa-select-lite display="Select Budget" [loadAction]="{ url: 'budgets/list/x' }" optionDisplay="name" optionValue="value" [(value)]="selectedBudgetID" (valueChange)="onBudgetSelected()"></spa-select-lite><!-- Changed: optionDisplay/optionValue are NOT defaulted by spa-select-common (both default to ""), so every option rendered blank and bound undefined — no budget could be picked. 'name'/'value' match BaseController.GetList's ListOption shape, same as the statement page -->
+    </div>
+
+    <spa-tiles *ngIf="summaryTileConfig.loadAction" [config]="summaryTileConfig"></spa-tiles>
+
+    <spa-tabs *ngIf="reportTabConfigs.length > 0" [tableConfigs]="reportTabConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }] });
+
+// Accounting module dashboard — pure financial/account performance (invoice-specific moved to invoicing)
+class AccountingDashboardComponent {
+    constructor() {
+        this.summaryTiles = {
+            tiles: [
+                { name: 'inflows', alias: 'Inflows (MTD)', color: '#4caf50', icon: 'arrow_downward', style: 'icon', info: 'MTD cash inflows' }, // Changed: Cash inflows tile
+                { name: 'outflows', alias: 'Outflows (MTD)', color: '#f44336', icon: 'arrow_upward', style: 'icon', info: 'MTD cash outflows' }, // Changed: Cash outflows tile
+                { name: 'netCashFlow', alias: 'Net Cash Flow', color: '#2196f3', icon: 'swap_vert', style: 'icon', info: 'Net cash movement' }, // Changed: Net cash flow tile
+                { name: 'revenue', alias: 'Revenue (MTD)', color: '#4caf50', icon: 'trending_up', style: 'icon', info: 'MTD revenue' },
+                { name: 'expenses', alias: 'Expenses (MTD)', color: '#f44336', icon: 'trending_down', style: 'icon', info: 'MTD expenses' },
+                { name: 'cashBalance', alias: 'Cash & Bank', color: '#ff9800', icon: 'account_balance_wallet', style: 'icon', info: 'Cash + bank total' },
+            ],
+            loadAction: { url: 'accounts/dashboard-summary/x' },
+            loadInit: true
+        };
+        // Changed: Replaced collectionRate/invoiceStatusSplit with profitMargin/expenseBreakdown
+        this.chartTiles = {
+            tiles: [
+                { name: 'profitMargin', alias: 'Profit Margin', color: '#4caf50', chart: { type: 'doughnut', gaugeColor: '#4caf50', height: 130, dataField: 'profitMargin' }, footer: 'Net profit / revenue', footerIcon: 'pie_chart' }, // Changed: Replaced collectionRate
+                { name: 'revenueTrendSpark', alias: 'Revenue Trend', color: '#2196f3', chart: { type: 'line', color: '#2196f3', height: 100, dataField: 'revenueTrendSpark' }, footer: 'Last 12 months', footerIcon: 'show_chart' },
+                { name: 'expenseBreakdown', alias: 'Expense Breakdown', color: '#ff9800', chart: { type: 'pie', colors: ['#f44336', '#ff5722', '#ff9800', '#ffc107', '#ffeb3b', '#9e9e9e'], height: 130, dataField: 'expenseBreakdown' }, footer: 'Top 5 + Other', footerIcon: 'donut_large' }, // Changed: Replaced invoiceStatusSplit
+                { name: 'expenseTrendSpark', alias: 'Expense Trend', color: '#f44336', chart: { type: 'bar', colors: ['#f44336', '#ef5350', '#e57373', '#ef9a9a', '#ffcdd2', '#f44336'], height: 100, dataField: 'expenseTrendSpark' }, footer: 'Last 6 months', footerIcon: 'trending_down' },
+            ],
+            loadAction: { url: 'accounts/dashboard-chart-tiles/x' },
+            loadInit: true
+        };
+        // Changed: Replaced arAging/invoiceStatus with cashFlow/transactionVolume
+        this.chartConfig = {
+            charts: [
+                { name: 'revenueTrend', title: 'Revenue vs Expenses Trend', type: 'line', height: '300px', showPoints: true, tension: 0.4, colors: ['#4caf50', '#f44336'], showLegend: true },
+                { name: 'cashFlow', title: 'Monthly Cash Flow', type: 'bar', height: '300px', colors: ['#4caf50', '#f44336'], showLegend: true }, // Changed: Replaced arAging
+                { name: 'accountBalances', title: 'Account Balances by Type', type: 'bar', height: '300px', colors: ['#2196f3', '#f44336', '#4caf50', '#ff9800', '#9c27b0'] },
+                { name: 'transactionVolume', title: 'Monthly Transaction Volume', type: 'bar', height: '300px', colors: ['#7c4dff'] }, // Changed: Replaced invoiceStatus
+            ],
+            loadAction: { url: 'accounts/dashboard-charts/x' },
+            loadInit: true,
+            columns: 2
+        };
+        // Changed: New cash/bank running balance line chart with separate data source
+        this.cashBankChartConfig = {
+            charts: [
+                { name: 'cashBankBalances', title: 'Cash & Bank Balances (30 Days)', type: 'line', height: '500px', showPoints: true, tension: 0.4, showLegend: true,
+                    options: { scales: { y: { grid: { color: '#f0f0f0', drawBorder: false }, ticks: { font: { size: 11 }, color: '#999', maxTicksLimit: 12 }, border: { display: false } } } } }, // Changed: More granular Y-axis ticks for better readability
+            ],
+            loadAction: { url: 'accounts/dashboard-cash-balances/x' },
+            loadInit: true,
+            columns: 1
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingDashboardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: AccountingDashboardComponent, isStandalone: false, selector: "spa-accounting-dashboard", ngImport: i0, template: `
+    <div class="dashboard-container">
+      <h4 class="dashboard-title"><mat-icon>account_balance</mat-icon> Accounting Dashboard</h4>
+      <spa-tiles [config]="summaryTiles"></spa-tiles>
+      <div style="margin-top: 16px;"></div>
+      <spa-tiles [config]="chartTiles"></spa-tiles>
+      <spa-charts [config]="chartConfig"></spa-charts>
+      <!-- Changed: Separate cash/bank balance chart with own data source -->
+      <spa-charts [config]="cashBankChartConfig"></spa-charts>
+    </div>
+  `, isInline: true, styles: [".dashboard-container{padding:16px}.dashboard-title{display:flex;align-items:center;gap:8px;margin-bottom:16px;color:#333;font-weight:500}\n"], dependencies: [{ kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: ChartsComponent, selector: "spa-charts", inputs: ["config", "data", "reload"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingDashboardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'spa-accounting-dashboard', template: `
+    <div class="dashboard-container">
+      <h4 class="dashboard-title"><mat-icon>account_balance</mat-icon> Accounting Dashboard</h4>
+      <spa-tiles [config]="summaryTiles"></spa-tiles>
+      <div style="margin-top: 16px;"></div>
+      <spa-tiles [config]="chartTiles"></spa-tiles>
+      <spa-charts [config]="chartConfig"></spa-charts>
+      <!-- Changed: Separate cash/bank balance chart with own data source -->
+      <spa-charts [config]="cashBankChartConfig"></spa-charts>
+    </div>
+  `, standalone: false, styles: [".dashboard-container{padding:16px}.dashboard-title{display:flex;align-items:center;gap:8px;margin-bottom:16px;color:#333;font-weight:500}\n"] }]
+        }] });
+
+// Invoice module dashboard with pipeline visibility, aging, and collection KPIs
+class InvoiceDashboardComponent {
+    constructor(dataService) {
+        this.dataService = dataService;
+        this.attentionItems = [];
+        // Changed: Summary tiles — invoice pipeline KPIs
+        this.summaryTiles = {
+            tiles: [
+                { name: 'totalInvoices', alias: 'Total Invoices', color: '#1565c0', icon: 'receipt_long', style: 'icon', info: 'All active invoices' },
+                { name: 'drafts', alias: 'Drafts', color: '#9e9e9e', icon: 'edit_note', style: 'icon', info: 'Invoices awaiting submission' },
+                { name: 'outstandingAmount', alias: 'Outstanding', color: '#ff9800', icon: 'pending', style: 'icon', prefix: '$', info: 'Total unpaid amount' },
+                { name: 'overdueCount', alias: 'Overdue', color: '#f44336', icon: 'warning', style: 'icon', info: 'Invoices past due date' },
+                { name: 'paidThisMonth', alias: 'Paid (Month)', color: '#4caf50', icon: 'check_circle', style: 'icon', info: 'Fully paid this month' },
+                { name: 'avgDaysToPay', alias: 'Avg Days to Pay', color: '#7b1fa2', icon: 'schedule', style: 'icon', suffix: ' days', info: 'Average payment turnaround' },
+            ],
+            loadAction: { url: 'invoices/dashboard-summary/x' },
+            loadInit: true
+        };
+        // Changed: Chart tiles — collection gauge, trend sparkline, status pie, aging bar
+        this.chartTiles = {
+            tiles: [
+                { name: 'collectionRate', alias: 'Collection Rate', color: '#4caf50', chart: { type: 'doughnut', gaugeColor: '#4caf50', height: 130, dataField: 'collectionRate' }, footer: 'Amount collected vs invoiced', footerIcon: 'check_circle' },
+                { name: 'invoiceTrend', alias: 'Invoice Trend', color: '#2196f3', chart: { type: 'line', color: '#2196f3', height: 100, dataField: 'invoiceTrend' }, footer: 'Last 12 months', footerIcon: 'timeline' },
+                { name: 'statusDistribution', alias: 'Status Split', color: '#ff9800', chart: { type: 'pie', colors: ['#9e9e9e', '#2196f3', '#ff9800', '#4caf50', '#f44336'], height: 130, dataField: 'statusDistribution' }, footer: 'Current distribution', footerIcon: 'pie_chart' },
+                { name: 'agingSnapshot', alias: 'Aging Snapshot', color: '#f44336', chart: { type: 'bar', colors: ['#4caf50', '#ff9800', '#ff5722', '#f44336', '#b71c1c'], height: 100, dataField: 'agingSnapshot' }, footer: 'Outstanding by age', footerIcon: 'bar_chart' },
+            ],
+            loadAction: { url: 'invoices/dashboard-chart-tiles/x' },
+            loadInit: true
+        };
+        // Changed: Full charts — revenue pipeline, aging breakdown, top customers, payment trend
+        this.chartConfig = {
+            charts: [
+                { name: 'revenuePipeline', title: 'Invoiced vs Collected', type: 'bar', height: '300px', showLegend: true, colors: ['#2196f3', '#4caf50'] },
+                { name: 'agingBreakdown', title: 'AR Aging Breakdown', type: 'bar', height: '300px', colors: ['#4caf50', '#ff9800', '#ff5722', '#f44336', '#b71c1c'] },
+                { name: 'topCustomers', title: 'Top Customers by Outstanding', type: 'bar', height: '300px', colors: ['#1565c0', '#1976d2', '#1e88e5', '#2196f3', '#42a5f5'] },
+                { name: 'paymentTrend', title: 'Payment Collection Trend', type: 'line', height: '300px', showPoints: true, tension: 0.4, colors: ['#4caf50'], showLegend: true },
+                { name: 'collectionPerformance', title: 'Collection Performance (12 Months)', type: 'line', height: '300px', showPoints: true, tension: 0.4, colors: ['#f57c00', '#4caf50'], showLegend: true }, // Changed: Avg days to pay + on-time rate trend
+            ],
+            loadAction: { url: 'invoices/dashboard-charts/x' },
+            loadInit: true,
+            columns: 2
+        };
+    }
+    ngOnInit() {
+        // Load attention items — top overdue invoices needing action
+        this.dataService.CallApi({ url: 'invoices/dashboard-attention/x' }).subscribe((res) => {
+            if (res.success)
+                this.attentionItems = res.data || [];
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: InvoiceDashboardComponent, deps: [{ token: i1.DataServiceLib }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: InvoiceDashboardComponent, isStandalone: false, selector: "spa-invoice-dashboard", ngImport: i0, template: `
+    <div class="dashboard-container">
+      <h4 class="dashboard-title"><mat-icon>receipt_long</mat-icon> Invoice Dashboard</h4>
+      <spa-tiles [config]="summaryTiles"></spa-tiles>
+      <div style="margin-top: 16px;"></div>
+      <spa-tiles [config]="chartTiles"></spa-tiles>
+
+      <!-- Attention Required sub-table -->
+      <div *ngIf="attentionItems.length > 0" class="attention-section">
+        <h5 class="section-title">
+          <mat-icon style="vertical-align: middle; margin-right: 4px; color: #f44336;">warning</mat-icon>
+          Needs Attention
+        </h5>
+        <table class="kpi-table">
+          <thead>
+            <tr>
+              <th>Invoice</th>
+              <th>Customer</th>
+              <th>Due Date</th>
+              <th>Days Overdue</th>
+              <th>Outstanding</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr *ngFor="let item of attentionItems">
+              <td>{{ item.invoiceNumber }}</td>
+              <td>{{ item.customerName }}</td>
+              <td>{{ item.dueDate | date:'mediumDate' }}</td>
+              <td style="color: #f44336; font-weight: 500;">{{ item.daysOverdue }}</td>
+              <td>{{ item.outstandingAmount | currency }}</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+
+      <spa-charts [config]="chartConfig"></spa-charts>
+    </div>
+  `, isInline: true, styles: [".dashboard-container{padding:16px}.dashboard-title{display:flex;align-items:center;gap:8px;margin-bottom:16px;color:#333;font-weight:500}.attention-section{margin-top:16px}.section-title{display:flex;align-items:center;margin-bottom:8px;color:#333;font-weight:500}.kpi-table{width:100%;border-collapse:collapse;font-size:13px}.kpi-table th{text-align:left;padding:8px 12px;background:#f5f5f5;border-bottom:2px solid #e0e0e0;font-weight:500}.kpi-table td{padding:8px 12px;border-bottom:1px solid #eee}.kpi-table tr:hover{background:#fafafa}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: ChartsComponent, selector: "spa-charts", inputs: ["config", "data", "reload"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: InvoiceDashboardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'spa-invoice-dashboard', template: `
+    <div class="dashboard-container">
+      <h4 class="dashboard-title"><mat-icon>receipt_long</mat-icon> Invoice Dashboard</h4>
+      <spa-tiles [config]="summaryTiles"></spa-tiles>
+      <div style="margin-top: 16px;"></div>
+      <spa-tiles [config]="chartTiles"></spa-tiles>
+
+      <!-- Attention Required sub-table -->
+      <div *ngIf="attentionItems.length > 0" class="attention-section">
+        <h5 class="section-title">
+          <mat-icon style="vertical-align: middle; margin-right: 4px; color: #f44336;">warning</mat-icon>
+          Needs Attention
+        </h5>
+        <table class="kpi-table">
+          <thead>
+            <tr>
+              <th>Invoice</th>
+              <th>Customer</th>
+              <th>Due Date</th>
+              <th>Days Overdue</th>
+              <th>Outstanding</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr *ngFor="let item of attentionItems">
+              <td>{{ item.invoiceNumber }}</td>
+              <td>{{ item.customerName }}</td>
+              <td>{{ item.dueDate | date:'mediumDate' }}</td>
+              <td style="color: #f44336; font-weight: 500;">{{ item.daysOverdue }}</td>
+              <td>{{ item.outstandingAmount | currency }}</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+
+      <spa-charts [config]="chartConfig"></spa-charts>
+    </div>
+  `, standalone: false, styles: [".dashboard-container{padding:16px}.dashboard-title{display:flex;align-items:center;gap:8px;margin-bottom:16px;color:#333;font-weight:500}.attention-section{margin-top:16px}.section-title{display:flex;align-items:center;margin-bottom:8px;color:#333;font-weight:500}.kpi-table{width:100%;border-collapse:collapse;font-size:13px}.kpi-table th{text-align:left;padding:8px 12px;background:#f5f5f5;border-bottom:2px solid #e0e0e0;font-weight:500}.kpi-table td{padding:8px 12px;border-bottom:1px solid #eee}.kpi-table tr:hover{background:#fafafa}\n"] }]
+        }], ctorParameters: () => [{ type: i1.DataServiceLib }] });
+
+// Credit Notes page (B6) — invoice corrections/returns with GL reversal posting
+class CreditNotesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Credit Notes',
+            tableConfig: this.accountingService.creditNotesTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: CreditNotesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: CreditNotesComponent, isStandalone: false, selector: "spa-credit-notes", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: CreditNotesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-credit-notes',
+                    template: '<spa-page [config]="pageConfig"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// VAT Return page (B2) — ZIMRA VAT7-style summary for a selected tax period
+// Phase 2 compliance: sales splits (standard/zero-rated/exempt), per-currency breakdown, GL reconciliation, WHT remittance tab
+class VatReturnComponent {
+    constructor() {
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.from = '';
+        this.to = '';
+        this.data = null;
+        this.whtData = []; // Added: WHT remittance rows for the selected period
+    }
+    ngOnInit() {
+        // Default period: current calendar month
+        const now = new Date();
+        this.from = new Date(now.getFullYear(), now.getMonth(), 1).toISOString().substring(0, 10);
+        this.to = new Date(now.getFullYear(), now.getMonth() + 1, 0).toISOString().substring(0, 10);
+        this.load();
+    }
+    load() {
+        this.http.get(`${this.httpService.apiUrl}reports/vat-return?from=${this.from}&to=${this.to}`)
+            .subscribe(res => this.data = res?.data ?? res?.Data ?? null);
+        // Added: load WHT remittance rows for the same period (SupplierPayments criteria, value = "from,to")
+        this.http.get(`${this.httpService.apiUrl}supplierpayments/wht-remittance/${this.from},${this.to}`) // Changed: aligned with backend SupplierPaymentsController.CustomCriteria route shape
+            .subscribe(res => this.whtData = res?.data ?? res?.Data ?? []);
+    }
+    export() {
+        this.http.get(`${this.httpService.apiUrl}reports/export/vat-return?from=${this.from}&to=${this.to}`, { responseType: 'blob' })
+            .subscribe((response) => {
+            const url = window.URL.createObjectURL(new Blob([response]));
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = `vat-return-${this.from}-to-${this.to}.xlsx`;
+            link.click();
+            window.URL.revokeObjectURL(url);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: VatReturnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: VatReturnComponent, isStandalone: false, selector: "spa-vat-return", ngImport: i0, template: `
+    <div style="display: flex; align-items: center; justify-content: space-between;">
+      <h4>VAT Return</h4>
+      <button mat-stroked-button (click)="export()" [disabled]="!data">
+        <mat-icon>download</mat-icon> Export to Excel
+      </button>
+    </div>
+    <hr>
+
+    <div style="display: flex; gap: 16px; align-items: center; margin-bottom: 16px;">
+      <mat-form-field>
+        <mat-label>From</mat-label>
+        <input matInput type="date" [(ngModel)]="from">
+      </mat-form-field>
+      <mat-form-field>
+        <mat-label>To</mat-label>
+        <input matInput type="date" [(ngModel)]="to">
+      </mat-form-field>
+      <button mat-flat-button color="primary" (click)="load()">Run</button>
+    </div>
+
+    <mat-tab-group>
+      <mat-tab label="VAT Return">
+        <mat-card *ngIf="data" style="max-width: 640px; padding: 16px; margin-top: 16px;">
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr><td style="padding: 6px 0;">Standard Rated Sales (excl. VAT)</td><td style="text-align: right;">{{ data.standardRatedSales | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Zero Rated Sales</td><td style="text-align: right;">{{ data.zeroRatedSales | number:'1.2-2' }}</td></tr>
+            <tr *ngIf="data.exemptSales != null"><td style="padding: 6px 0;">Exempt Sales</td><td style="text-align: right;">{{ data.exemptSales | number:'1.2-2' }}</td></tr>
+            <tr style="border-top: 1px solid #ddd;"><td style="padding: 6px 0;"><b>Total Sales</b></td><td style="text-align: right;"><b>{{ data.totalSales | number:'1.2-2' }}</b></td></tr>
+            <tr><td style="padding: 6px 0;">Output VAT</td><td style="text-align: right;">{{ data.outputVat | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Total Purchases (excl. VAT)</td><td style="text-align: right;">{{ data.totalPurchases | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Input VAT</td><td style="text-align: right;">{{ data.inputVat | number:'1.2-2' }}</td></tr>
+            <tr style="border-top: 2px solid #333;">
+              <td style="padding: 8px 0;"><b>{{ data.isPayable ? 'VAT Payable to ZIMRA' : 'VAT Refundable' }}</b></td>
+              <td style="text-align: right;"><b [style.color]="data.isPayable ? 'red' : 'green'">{{ data.netVat | number:'1.2-2' }}</b></td>
+            </tr>
+          </table>
+        </mat-card>
+
+        <!-- Added: per-currency breakdown from byCurrency -->
+        <mat-card *ngIf="data?.byCurrency?.length" style="max-width: 900px; padding: 16px; margin-top: 16px;">
+          <h5 style="margin-top: 0;">Breakdown by Currency</h5>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr style="border-bottom: 1px solid #ddd;">
+              <th style="text-align: left; padding: 6px 0;">Currency</th>
+              <th style="text-align: right;">Standard Sales</th>
+              <th style="text-align: right;">Zero Rated</th>
+              <th style="text-align: right;">Exempt</th>
+              <th style="text-align: right;">Output VAT</th>
+              <th style="text-align: right;">Input VAT</th>
+              <th style="text-align: right;">Net VAT</th>
+            </tr>
+            <tr *ngFor="let c of data.byCurrency">
+              <td style="padding: 6px 0;">{{ c.currencyCode }}</td>
+              <td style="text-align: right;">{{ c.standardRatedSales | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.zeroRatedSales | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.exemptSales | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.outputVat | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.inputVat | number:'1.2-2' }}</td>
+              <td style="text-align: right;"><b>{{ c.netVat | number:'1.2-2' }}</b></td>
+            </tr>
+          </table>
+        </mat-card>
+
+        <!-- Added: GL reconciliation — output VAT per GL vs per documents -->
+        <mat-card *ngIf="data?.glReconciliation" style="max-width: 640px; padding: 16px; margin-top: 16px;">
+          <h5 style="margin-top: 0;">GL Reconciliation (Output VAT)</h5>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr><td style="padding: 6px 0;">Output VAT per GL</td><td style="text-align: right;">{{ data.glReconciliation.outputVatGL | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Output VAT per Documents</td><td style="text-align: right;">{{ data.glReconciliation.outputVatFromDocuments | number:'1.2-2' }}</td></tr>
+            <tr style="border-top: 1px solid #ddd;">
+              <td style="padding: 6px 0;"><b>Difference</b></td>
+              <td style="text-align: right;"><b [style.color]="(data.glReconciliation.difference | number:'1.2-2') !== '0.00' ? '#e65100' : 'inherit'">{{ data.glReconciliation.difference | number:'1.2-2' }}</b></td>
+            </tr>
+          </table>
+          <p *ngIf="(data.glReconciliation.difference | number:'1.2-2') !== '0.00'" style="color: #e65100; margin: 8px 0 0;">
+            <mat-icon style="vertical-align: middle; font-size: 18px;">warning</mat-icon>
+            GL does not agree with document totals — investigate before filing.
+          </p>
+        </mat-card>
+      </mat-tab>
+
+      <!-- Added: WHT remittance report — 30% withholding on payments to suppliers without valid ITF263 -->
+      <mat-tab label="Withholding Tax">
+        <mat-card style="max-width: 900px; padding: 16px; margin-top: 16px;">
+          <h5 style="margin-top: 0;">Withholding Tax Remittance (30% — no valid ITF263)</h5>
+          <table *ngIf="whtData?.length" style="width: 100%; border-collapse: collapse;">
+            <tr style="border-bottom: 1px solid #ddd;">
+              <th style="text-align: left; padding: 6px 0;">Supplier</th>
+              <th style="text-align: left;">Date</th>
+              <th style="text-align: right;">Gross</th>
+              <th style="text-align: right;">WHT</th>
+              <th style="text-align: right;">Net Paid</th>
+            </tr>
+            <tr *ngFor="let w of whtData">
+              <td style="padding: 6px 0;">{{ w.supplierName || w.supplier }}</td>
+              <td>{{ (w.paymentDate || w.date) | date:'mediumDate' }}</td>
+              <td style="text-align: right;">{{ (w.grossAmount ?? w.gross) | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ (w.whtAmount ?? w.wht) | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ (w.netAmount ?? w.net) | number:'1.2-2' }}</td>
+            </tr>
+          </table>
+          <p *ngIf="!whtData?.length" style="color: #757575;">No withheld supplier payments in this period.</p>
+        </mat-card>
+      </mat-tab>
+    </mat-tab-group>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i3$2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "component", type: i3$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: VatReturnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-vat-return',
+                    template: `
+    <div style="display: flex; align-items: center; justify-content: space-between;">
+      <h4>VAT Return</h4>
+      <button mat-stroked-button (click)="export()" [disabled]="!data">
+        <mat-icon>download</mat-icon> Export to Excel
+      </button>
+    </div>
+    <hr>
+
+    <div style="display: flex; gap: 16px; align-items: center; margin-bottom: 16px;">
+      <mat-form-field>
+        <mat-label>From</mat-label>
+        <input matInput type="date" [(ngModel)]="from">
+      </mat-form-field>
+      <mat-form-field>
+        <mat-label>To</mat-label>
+        <input matInput type="date" [(ngModel)]="to">
+      </mat-form-field>
+      <button mat-flat-button color="primary" (click)="load()">Run</button>
+    </div>
+
+    <mat-tab-group>
+      <mat-tab label="VAT Return">
+        <mat-card *ngIf="data" style="max-width: 640px; padding: 16px; margin-top: 16px;">
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr><td style="padding: 6px 0;">Standard Rated Sales (excl. VAT)</td><td style="text-align: right;">{{ data.standardRatedSales | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Zero Rated Sales</td><td style="text-align: right;">{{ data.zeroRatedSales | number:'1.2-2' }}</td></tr>
+            <tr *ngIf="data.exemptSales != null"><td style="padding: 6px 0;">Exempt Sales</td><td style="text-align: right;">{{ data.exemptSales | number:'1.2-2' }}</td></tr>
+            <tr style="border-top: 1px solid #ddd;"><td style="padding: 6px 0;"><b>Total Sales</b></td><td style="text-align: right;"><b>{{ data.totalSales | number:'1.2-2' }}</b></td></tr>
+            <tr><td style="padding: 6px 0;">Output VAT</td><td style="text-align: right;">{{ data.outputVat | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Total Purchases (excl. VAT)</td><td style="text-align: right;">{{ data.totalPurchases | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Input VAT</td><td style="text-align: right;">{{ data.inputVat | number:'1.2-2' }}</td></tr>
+            <tr style="border-top: 2px solid #333;">
+              <td style="padding: 8px 0;"><b>{{ data.isPayable ? 'VAT Payable to ZIMRA' : 'VAT Refundable' }}</b></td>
+              <td style="text-align: right;"><b [style.color]="data.isPayable ? 'red' : 'green'">{{ data.netVat | number:'1.2-2' }}</b></td>
+            </tr>
+          </table>
+        </mat-card>
+
+        <!-- Added: per-currency breakdown from byCurrency -->
+        <mat-card *ngIf="data?.byCurrency?.length" style="max-width: 900px; padding: 16px; margin-top: 16px;">
+          <h5 style="margin-top: 0;">Breakdown by Currency</h5>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr style="border-bottom: 1px solid #ddd;">
+              <th style="text-align: left; padding: 6px 0;">Currency</th>
+              <th style="text-align: right;">Standard Sales</th>
+              <th style="text-align: right;">Zero Rated</th>
+              <th style="text-align: right;">Exempt</th>
+              <th style="text-align: right;">Output VAT</th>
+              <th style="text-align: right;">Input VAT</th>
+              <th style="text-align: right;">Net VAT</th>
+            </tr>
+            <tr *ngFor="let c of data.byCurrency">
+              <td style="padding: 6px 0;">{{ c.currencyCode }}</td>
+              <td style="text-align: right;">{{ c.standardRatedSales | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.zeroRatedSales | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.exemptSales | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.outputVat | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ c.inputVat | number:'1.2-2' }}</td>
+              <td style="text-align: right;"><b>{{ c.netVat | number:'1.2-2' }}</b></td>
+            </tr>
+          </table>
+        </mat-card>
+
+        <!-- Added: GL reconciliation — output VAT per GL vs per documents -->
+        <mat-card *ngIf="data?.glReconciliation" style="max-width: 640px; padding: 16px; margin-top: 16px;">
+          <h5 style="margin-top: 0;">GL Reconciliation (Output VAT)</h5>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr><td style="padding: 6px 0;">Output VAT per GL</td><td style="text-align: right;">{{ data.glReconciliation.outputVatGL | number:'1.2-2' }}</td></tr>
+            <tr><td style="padding: 6px 0;">Output VAT per Documents</td><td style="text-align: right;">{{ data.glReconciliation.outputVatFromDocuments | number:'1.2-2' }}</td></tr>
+            <tr style="border-top: 1px solid #ddd;">
+              <td style="padding: 6px 0;"><b>Difference</b></td>
+              <td style="text-align: right;"><b [style.color]="(data.glReconciliation.difference | number:'1.2-2') !== '0.00' ? '#e65100' : 'inherit'">{{ data.glReconciliation.difference | number:'1.2-2' }}</b></td>
+            </tr>
+          </table>
+          <p *ngIf="(data.glReconciliation.difference | number:'1.2-2') !== '0.00'" style="color: #e65100; margin: 8px 0 0;">
+            <mat-icon style="vertical-align: middle; font-size: 18px;">warning</mat-icon>
+            GL does not agree with document totals — investigate before filing.
+          </p>
+        </mat-card>
+      </mat-tab>
+
+      <!-- Added: WHT remittance report — 30% withholding on payments to suppliers without valid ITF263 -->
+      <mat-tab label="Withholding Tax">
+        <mat-card style="max-width: 900px; padding: 16px; margin-top: 16px;">
+          <h5 style="margin-top: 0;">Withholding Tax Remittance (30% — no valid ITF263)</h5>
+          <table *ngIf="whtData?.length" style="width: 100%; border-collapse: collapse;">
+            <tr style="border-bottom: 1px solid #ddd;">
+              <th style="text-align: left; padding: 6px 0;">Supplier</th>
+              <th style="text-align: left;">Date</th>
+              <th style="text-align: right;">Gross</th>
+              <th style="text-align: right;">WHT</th>
+              <th style="text-align: right;">Net Paid</th>
+            </tr>
+            <tr *ngFor="let w of whtData">
+              <td style="padding: 6px 0;">{{ w.supplierName || w.supplier }}</td>
+              <td>{{ (w.paymentDate || w.date) | date:'mediumDate' }}</td>
+              <td style="text-align: right;">{{ (w.grossAmount ?? w.gross) | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ (w.whtAmount ?? w.wht) | number:'1.2-2' }}</td>
+              <td style="text-align: right;">{{ (w.netAmount ?? w.net) | number:'1.2-2' }}</td>
+            </tr>
+          </table>
+          <p *ngIf="!whtData?.length" style="color: #757575;">No withheld supplier payments in this period.</p>
+        </mat-card>
+      </mat-tab>
+    </mat-tab-group>
+  `,
+                    standalone: false
+                }]
+        }] });
+
+// Fiscal Periods page (C2) — period create/close/reopen/lock management
+class FiscalPeriodsComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Fiscal Periods',
+            tableConfig: this.accountingService.fiscalPeriodsTableConfig
+        };
+    }
+    ngOnInit() {
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: FiscalPeriodsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: FiscalPeriodsComponent, isStandalone: false, selector: "spa-fiscal-periods", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: FiscalPeriodsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-fiscal-periods',
+                    template: '<spa-page [config]="pageConfig"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// Customer Receipts page (C3) — receipts list with new-receipt and allocate actions
+class ReceiptsComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.dataService = inject(DataServiceLib); // Added: supplies dialogPanelClass so this dialog honours appConfig.dialogStyle
+        this.dialog = inject(MatDialog);
+        this.pageConfig = {
+            title: 'Customer Receipts',
+            tableConfig: this.accountingService.customerReceiptsTableConfig
+        };
+        // Changed: the allocate wiring is GONE from here. AccountingService now owns receiptAllocateButton.onClick,
+        // so the button works in every consumer instead of only on this page — this constructor was the single
+        // reason shift's and grip's Day Book allocate lanes could not use it. Re-assigning it here would just
+        // narrow it back to this page's dialog, and the service's handler is the same dialog with the same data.
+        // Changed: the PDF wiring is GONE from here too — AccountingService now owns receiptPdfButton.onClick via
+        // downloadReceiptPdf, so the button works in every consumer. That was the last library backlog row of the
+        // pair. This constructor is now empty of wiring and exists only to satisfy the class.
+    }
+    ngOnInit() {
+    }
+    // Changed: this is now the NEW RECEIPT path only — allocation moved to AccountingService.openReceiptAllocation.
+    // The optional row parameter is kept so the signature stays compatible for any consumer holding a reference.
+    openDialog(row) {
+        this.dialog.open(ReceiptDialogComponent, { width: '860px', maxWidth: '95vw', data: row ?? null, panelClass: this.dataService?.dialogPanelClass ?? [] }) // Changed: was missing panelClass, so this dialog never picked up the modern surface
+            .afterClosed().subscribe(saved => { if (saved)
+            this.page?.tableReload.next(true); });
+    }
+    // Changed: the blob download itself moved to AccountingService.downloadReceiptPdf. This method is kept as a
+    // thin delegate so the signature stays available to any consumer holding a reference to this component,
+    // exactly as openDialog's optional row parameter was kept in 3a681d6.
+    downloadPdf(receipt) {
+        this.accountingService.downloadReceiptPdf(receipt);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ReceiptsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ReceiptsComponent, isStandalone: false, selector: "spa-receipts", viewQueries: [{ propertyName: "page", first: true, predicate: PageComponent, descendants: true }], ngImport: i0, template: `
+    <div style="display: flex; justify-content: flex-end;">
+      <button mat-stroked-button (click)="openDialog()">
+        <mat-icon>receipt</mat-icon> New Receipt
+      </button>
+    </div>
+    <spa-page [config]="pageConfig"></spa-page>
+  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ReceiptsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-receipts',
+                    template: `
+    <div style="display: flex; justify-content: flex-end;">
+      <button mat-stroked-button (click)="openDialog()">
+        <mat-icon>receipt</mat-icon> New Receipt
+      </button>
+    </div>
+    <spa-page [config]="pageConfig"></spa-page>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [], propDecorators: { page: [{
+                type: ViewChild,
+                args: [PageComponent]
+            }] } });
+
+// Bank statement import dialog (C4) — paste CSV lines (date, description, reference, amount) for a GL cash/bank account
+class StatementImportDialogComponent {
+    constructor() {
+        this.dialogRef = inject((MatDialogRef));
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.messageService = inject(MessageService);
+        this.accountID = null;
+        this.statementFrom = '';
+        this.statementTo = '';
+        this.closingBalance = 0;
+        this.csv = '';
+        this.parseError = '';
+        this.accounts = [];
+        // Changed: materialized — parsedLines/netMovement were getters read 4x per change-detection cycle
+        // (twice in the template, plus netMovement and canSave), each call re-parsing the whole CSV, allocating a
+        // new array AND writing this.parseError from inside a getter (a side effect during change detection).
+        this.parsedLines = [];
+        this.netMovement = 0;
+    }
+    ngOnInit() {
+        this.http.get(`${this.httpService.apiUrl}accounts/list/x`)
+            .subscribe(res => this.accounts = res?.data ?? []);
+        const now = new Date();
+        this.statementFrom = new Date(now.getFullYear(), now.getMonth(), 1).toISOString().substring(0, 10);
+        this.statementTo = new Date(now.getFullYear(), now.getMonth() + 1, 0).toISOString().substring(0, 10);
+    }
+    // Added: recomputed only when the CSV text actually changes (bound via (ngModelChange))
+    parseCsv() {
+        this.parseError = '';
+        const lines = [];
+        for (const raw of this.csv.split('\n').map(l => l.trim()).filter(l => l)) {
+            const parts = raw.split(',').map(p => p.trim());
+            if (parts.length < 2) {
+                this.parseError = `Cannot parse: "${raw}"`;
+                this.parsedLines = [];
+                this.netMovement = 0;
+                return;
+            }
+            const amount = parseFloat(parts[parts.length - 1]);
+            if (isNaN(amount)) {
+                this.parseError = `Invalid amount in: "${raw}"`;
+                this.parsedLines = [];
+                this.netMovement = 0;
+                return;
+            }
+            lines.push({ date: parts[0], description: parts[1] ?? '', reference: parts.length > 3 ? parts[2] : '', amount });
+        }
+        this.parsedLines = lines;
+        this.netMovement = lines.reduce((sum, line) => sum + line.amount, 0);
+    }
+    get canSave() { return !!this.accountID && this.parsedLines.length > 0 && !this.parseError; } // Returns a primitive — safe to leave as a getter
+    save() {
+        const dto = {
+            accountID: this.accountID,
+            statementFrom: this.statementFrom,
+            statementTo: this.statementTo,
+            closingBalance: this.closingBalance,
+            lines: this.parsedLines
+        };
+        this.http.post(`${this.httpService.apiUrl}bankstatementimports/dto?action=create`, dto)
+            .subscribe(res => {
+            this.messageService.toast(res?.message ?? (res?.success ? 'Statement imported' : 'Import failed'));
+            if (res?.success)
+                this.dialogRef.close(true);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: StatementImportDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: StatementImportDialogComponent, isStandalone: false, selector: "spa-statement-import-dialog", ngImport: i0, template: `
+    <h2 mat-dialog-title>Import Bank Statement</h2>
+    <mat-dialog-content>
+      <div style="display: flex; gap: 16px; flex-wrap: wrap;">
+        <mat-form-field style="min-width: 220px;">
+          <mat-label>Account</mat-label>
+          <mat-select [(ngModel)]="accountID">
+            <mat-option *ngFor="let option of accounts" [value]="option.value">{{ option.name }}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>From</mat-label>
+          <input matInput type="date" [(ngModel)]="statementFrom">
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>To</mat-label>
+          <input matInput type="date" [(ngModel)]="statementTo">
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>Closing Balance</mat-label>
+          <input matInput type="number" [(ngModel)]="closingBalance">
+        </mat-form-field>
+      </div>
+      <mat-form-field style="width: 100%;">
+        <mat-label>Statement lines (CSV: date, description, reference, amount — money out negative)</mat-label>
+        <textarea matInput rows="10" [(ngModel)]="csv" (ngModelChange)="parseCsv()" placeholder="2026-07-01, Deposit ABC, REF001, 1500.00&#10;2026-07-03, Bank charges, , -25.50"></textarea>
+      </mat-form-field>
+      <p *ngIf="parseError" style="color: red;"><em>{{ parseError }}</em></p>
+      <p *ngIf="parsedLines.length"><em>{{ parsedLines.length }} line(s) parsed, net movement {{ netMovement | number:'1.2-2' }}</em></p>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button (click)="dialogRef.close(false)">Cancel</button>
+      <button mat-flat-button color="primary" (click)="save()" [disabled]="!canSave">Import</button>
+    </mat-dialog-actions>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i4$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i4$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i7$1.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", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: StatementImportDialogComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-statement-import-dialog',
+                    template: `
+    <h2 mat-dialog-title>Import Bank Statement</h2>
+    <mat-dialog-content>
+      <div style="display: flex; gap: 16px; flex-wrap: wrap;">
+        <mat-form-field style="min-width: 220px;">
+          <mat-label>Account</mat-label>
+          <mat-select [(ngModel)]="accountID">
+            <mat-option *ngFor="let option of accounts" [value]="option.value">{{ option.name }}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>From</mat-label>
+          <input matInput type="date" [(ngModel)]="statementFrom">
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>To</mat-label>
+          <input matInput type="date" [(ngModel)]="statementTo">
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>Closing Balance</mat-label>
+          <input matInput type="number" [(ngModel)]="closingBalance">
+        </mat-form-field>
+      </div>
+      <mat-form-field style="width: 100%;">
+        <mat-label>Statement lines (CSV: date, description, reference, amount — money out negative)</mat-label>
+        <textarea matInput rows="10" [(ngModel)]="csv" (ngModelChange)="parseCsv()" placeholder="2026-07-01, Deposit ABC, REF001, 1500.00&#10;2026-07-03, Bank charges, , -25.50"></textarea>
+      </mat-form-field>
+      <p *ngIf="parseError" style="color: red;"><em>{{ parseError }}</em></p>
+      <p *ngIf="parsedLines.length"><em>{{ parsedLines.length }} line(s) parsed, net movement {{ netMovement | number:'1.2-2' }}</em></p>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button (click)="dialogRef.close(false)">Cancel</button>
+      <button mat-flat-button color="primary" (click)="save()" [disabled]="!canSave">Import</button>
+    </mat-dialog-actions>
+  `,
+                    standalone: false
+                }]
+        }] });
+
+// Bank reconciliation match screen (C4) — statement lines vs unreconciled book entries; auto/manual match, unmatch, complete
+class ReconcileDialogComponent {
+    constructor() {
+        this.dialogRef = inject((MatDialogRef));
+        this.data = inject(MAT_DIALOG_DATA);
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.messageService = inject(MessageService);
+        this.rec = null;
+        this.selectedLine = null;
+        this.selectedEntry = null;
+        this.changed = false;
+    }
+    get difference() { return (this.rec?.bookBalance ?? 0) - (this.rec?.statementBalance ?? 0); }
+    ngOnInit() { this.load(); }
+    load() {
+        this.selectedLine = null;
+        this.selectedEntry = null;
+        this.http.get(`${this.httpService.apiUrl}bankstatementimports/reconciliation/${this.data.bankStatementImportID}`)
+            .subscribe(res => this.rec = res?.data ?? null);
+    }
+    autoMatch() {
+        this.http.post(`${this.httpService.apiUrl}bankstatementimports/dto?action=auto-match`, { bankStatementImportID: this.data.bankStatementImportID })
+            .subscribe(res => { this.messageService.toast(res?.message ?? ''); this.changed = true; this.load(); });
+    }
+    match() {
+        this.http.post(`${this.httpService.apiUrl}bankstatementimports/match?action=match`, { bankStatementLineID: this.selectedLine.bankStatementLineID, transactionEntryID: this.selectedEntry.transactionEntryID })
+            .subscribe(res => { this.messageService.toast(res?.message ?? ''); this.changed = true; this.load(); });
+    }
+    unmatch(line) {
+        this.http.post(`${this.httpService.apiUrl}bankstatementimports/match?action=unmatch`, { bankStatementLineID: line.bankStatementLineID, transactionEntryID: 0 })
+            .subscribe(res => { this.messageService.toast(res?.message ?? ''); this.changed = true; this.load(); });
+    }
+    complete() {
+        this.http.post(`${this.httpService.apiUrl}bankstatementimports/dto?action=complete`, { bankStatementImportID: this.data.bankStatementImportID })
+            .subscribe(res => {
+            this.messageService.toast(res?.message ?? '');
+            if (res?.success)
+                this.dialogRef.close(true);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ReconcileDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ReconcileDialogComponent, isStandalone: false, selector: "spa-reconcile-dialog", ngImport: i0, template: `
+    <h2 mat-dialog-title>Reconcile: {{ rec?.name }}</h2>
+    <mat-dialog-content>
+      <div *ngIf="rec" style="display: flex; gap: 32px; flex-wrap: wrap; margin-bottom: 12px;">
+        <div><small>Book Balance</small><br><b>{{ rec.bookBalance | number:'1.2-2' }}</b></div>
+        <div><small>Statement Balance</small><br><b>{{ rec.statementBalance | number:'1.2-2' }}</b></div>
+        <div><small>Difference</small><br><b [style.color]="difference ? 'red' : 'green'">{{ difference | number:'1.2-2' }}</b></div>
+        <div><small>Matched</small><br><b>{{ rec.matchedCount }} / {{ rec.lineCount }}</b></div>
+      </div>
+
+      <div style="display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap;" *ngIf="rec">
+        <div style="flex: 1; min-width: 380px;">
+          <h4>Statement Lines</h4>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr style="text-align: left; border-bottom: 1px solid #ccc;">
+              <th style="padding: 4px;"></th><th style="padding: 4px;">Date</th><th style="padding: 4px;">Description</th>
+              <th style="padding: 4px; text-align: right;">Amount</th><th style="padding: 4px;">Status</th>
+            </tr>
+            <tr *ngFor="let line of rec.lines" style="border-bottom: 1px solid #eee;"
+                [style.background]="selectedLine === line ? '#E3F2FD' : line.isMatched ? '#F1F8E9' : ''">
+              <td style="padding: 4px;">
+                <mat-checkbox *ngIf="!line.isMatched" [checked]="selectedLine === line" (change)="selectedLine = $event.checked ? line : null"></mat-checkbox>
+              </td>
+              <td style="padding: 4px;">{{ line.date }}</td>
+              <td style="padding: 4px;">{{ line.description }}</td>
+              <td style="padding: 4px; text-align: right;">{{ line.amount | number:'1.2-2' }}</td>
+              <td style="padding: 4px;">
+                <span *ngIf="line.isMatched" title="{{ line.matchedDescription }}">✔</span>
+                <button mat-button *ngIf="line.isMatched" (click)="unmatch(line)">Unmatch</button>
+              </td>
+            </tr>
+          </table>
+        </div>
+
+        <div style="flex: 1; min-width: 380px;">
+          <h4>Unreconciled Book Entries</h4>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr style="text-align: left; border-bottom: 1px solid #ccc;">
+              <th style="padding: 4px;"></th><th style="padding: 4px;">Date</th><th style="padding: 4px;">Description</th>
+              <th style="padding: 4px; text-align: right;">Amount</th>
+            </tr>
+            <tr *ngFor="let entry of rec.unreconciledEntries" style="border-bottom: 1px solid #eee;"
+                [style.background]="selectedEntry === entry ? '#E3F2FD' : ''">
+              <td style="padding: 4px;">
+                <mat-checkbox [checked]="selectedEntry === entry" (change)="selectedEntry = $event.checked ? entry : null"></mat-checkbox>
+              </td>
+              <td style="padding: 4px;">{{ entry.date }}</td>
+              <td style="padding: 4px;">{{ entry.description }}</td>
+              <td style="padding: 4px; text-align: right;">{{ entry.amount | number:'1.2-2' }}</td>
+            </tr>
+          </table>
+        </div>
+      </div>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button (click)="dialogRef.close(changed)">Close</button>
+      <button mat-stroked-button (click)="autoMatch()">Auto Match</button>
+      <button mat-stroked-button (click)="match()" [disabled]="!selectedLine || !selectedEntry">Match Selected</button>
+      <button mat-flat-button color="primary" (click)="complete()" [disabled]="!rec || rec.matchedCount != rec.lineCount">Complete Reconciliation</button>
+    </mat-dialog-actions>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i4$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i4$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ReconcileDialogComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-reconcile-dialog',
+                    template: `
+    <h2 mat-dialog-title>Reconcile: {{ rec?.name }}</h2>
+    <mat-dialog-content>
+      <div *ngIf="rec" style="display: flex; gap: 32px; flex-wrap: wrap; margin-bottom: 12px;">
+        <div><small>Book Balance</small><br><b>{{ rec.bookBalance | number:'1.2-2' }}</b></div>
+        <div><small>Statement Balance</small><br><b>{{ rec.statementBalance | number:'1.2-2' }}</b></div>
+        <div><small>Difference</small><br><b [style.color]="difference ? 'red' : 'green'">{{ difference | number:'1.2-2' }}</b></div>
+        <div><small>Matched</small><br><b>{{ rec.matchedCount }} / {{ rec.lineCount }}</b></div>
+      </div>
+
+      <div style="display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap;" *ngIf="rec">
+        <div style="flex: 1; min-width: 380px;">
+          <h4>Statement Lines</h4>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr style="text-align: left; border-bottom: 1px solid #ccc;">
+              <th style="padding: 4px;"></th><th style="padding: 4px;">Date</th><th style="padding: 4px;">Description</th>
+              <th style="padding: 4px; text-align: right;">Amount</th><th style="padding: 4px;">Status</th>
+            </tr>
+            <tr *ngFor="let line of rec.lines" style="border-bottom: 1px solid #eee;"
+                [style.background]="selectedLine === line ? '#E3F2FD' : line.isMatched ? '#F1F8E9' : ''">
+              <td style="padding: 4px;">
+                <mat-checkbox *ngIf="!line.isMatched" [checked]="selectedLine === line" (change)="selectedLine = $event.checked ? line : null"></mat-checkbox>
+              </td>
+              <td style="padding: 4px;">{{ line.date }}</td>
+              <td style="padding: 4px;">{{ line.description }}</td>
+              <td style="padding: 4px; text-align: right;">{{ line.amount | number:'1.2-2' }}</td>
+              <td style="padding: 4px;">
+                <span *ngIf="line.isMatched" title="{{ line.matchedDescription }}">✔</span>
+                <button mat-button *ngIf="line.isMatched" (click)="unmatch(line)">Unmatch</button>
+              </td>
+            </tr>
+          </table>
+        </div>
+
+        <div style="flex: 1; min-width: 380px;">
+          <h4>Unreconciled Book Entries</h4>
+          <table style="width: 100%; border-collapse: collapse;">
+            <tr style="text-align: left; border-bottom: 1px solid #ccc;">
+              <th style="padding: 4px;"></th><th style="padding: 4px;">Date</th><th style="padding: 4px;">Description</th>
+              <th style="padding: 4px; text-align: right;">Amount</th>
+            </tr>
+            <tr *ngFor="let entry of rec.unreconciledEntries" style="border-bottom: 1px solid #eee;"
+                [style.background]="selectedEntry === entry ? '#E3F2FD' : ''">
+              <td style="padding: 4px;">
+                <mat-checkbox [checked]="selectedEntry === entry" (change)="selectedEntry = $event.checked ? entry : null"></mat-checkbox>
+              </td>
+              <td style="padding: 4px;">{{ entry.date }}</td>
+              <td style="padding: 4px;">{{ entry.description }}</td>
+              <td style="padding: 4px; text-align: right;">{{ entry.amount | number:'1.2-2' }}</td>
+            </tr>
+          </table>
+        </div>
+      </div>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button (click)="dialogRef.close(changed)">Close</button>
+      <button mat-stroked-button (click)="autoMatch()">Auto Match</button>
+      <button mat-stroked-button (click)="match()" [disabled]="!selectedLine || !selectedEntry">Match Selected</button>
+      <button mat-flat-button color="primary" (click)="complete()" [disabled]="!rec || rec.matchedCount != rec.lineCount">Complete Reconciliation</button>
+    </mat-dialog-actions>
+  `,
+                    standalone: false
+                }]
+        }] });
+
+// Bank Reconciliation page (C4) — statement imports list + import/reconcile dialogs
+class BankReconciliationComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.dialog = inject(MatDialog);
+        this.dataService = inject(DataServiceLib); // Added: supplies dialogPanelClass so these dialogs honour appConfig.dialogStyle
+        this.pageConfig = {
+            title: 'Bank Reconciliation',
+            tableConfig: this.accountingService.bankStatementImportsTableConfig
+        };
+        // Reconcile row button opens the match screen (configs live in the service, dialogs in the component)
+        this.accountingService.bankReconcileButton.onClick = (row) => this.dialog.open(ReconcileDialogComponent, { width: '1100px', maxWidth: '95vw', data: row, panelClass: this.dataService?.dialogPanelClass ?? [] }) // Changed: was missing panelClass, so this dialog never picked up the modern surface
+            .afterClosed().subscribe(changed => { if (changed)
+            this.page?.tableReload.next(true); });
+    }
+    ngOnInit() {
+    }
+    newImport() {
+        this.dialog.open(StatementImportDialogComponent, { width: '860px', maxWidth: '95vw', panelClass: this.dataService?.dialogPanelClass ?? [] }) // Changed: was missing panelClass, so this dialog never picked up the modern surface
+            .afterClosed().subscribe(saved => { if (saved)
+            this.page?.tableReload.next(true); });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BankReconciliationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: BankReconciliationComponent, isStandalone: false, selector: "spa-bank-reconciliation", viewQueries: [{ propertyName: "page", first: true, predicate: PageComponent, descendants: true }], ngImport: i0, template: `
+    <div style="display: flex; justify-content: flex-end;">
+      <button mat-stroked-button (click)="newImport()">
+        <mat-icon>upload_file</mat-icon> Import Statement
+      </button>
+    </div>
+    <spa-page [config]="pageConfig"></spa-page>
+  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BankReconciliationComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-bank-reconciliation',
+                    template: `
+    <div style="display: flex; justify-content: flex-end;">
+      <button mat-stroked-button (click)="newImport()">
+        <mat-icon>upload_file</mat-icon> Import Statement
+      </button>
+    </div>
+    <spa-page [config]="pageConfig"></spa-page>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [], propDecorators: { page: [{
+                type: ViewChild,
+                args: [PageComponent]
+            }] } });
+
+// Moved (N11) from grip-spa into tin-spa, under Accounting (owner directive 2026-08-17). The design notes
+// from the Grip original hold: the two tables are one story, so an action on the arrangements table
+// refreshes the transfers list beneath it via the service's shared Subject.
+class TenantTransfersComponent {
+    constructor(tenantTransferService) {
+        this.tenantTransferService = tenantTransferService;
+    }
+    // Any successful action on an arrangement can change the transfers list — sending money adds a row, and
+    // revoking is worth re-reading the list after too. Refreshing unconditionally is correct and cheap.
+    arrangementActioned() {
+        this.tenantTransferService.transfersReload.next(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TenantTransfersComponent, deps: [{ token: TenantTransferService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: TenantTransfersComponent, isStandalone: false, selector: "spa-tenant-transfers", ngImport: i0, template: "<!-- Organisation Transfers \u2014 the handshake and the money that flows over it. Two sections in one page\n     deliberately: an arrangement is meaningless without the transfers it permits, and a transfer is\n     unreadable without the arrangement that authorised it. -->\n<h4>Organisation Transfers</h4>\n<hr>\n\n<div class=\"mt-3 tenant-transfers\" style=\"font-size: 14px;\">\n\n  <p class=\"tt-lead\">\n    Money can only move between two organisations that have <strong>agreed an arrangement</strong> first.\n    One side proposes it, the other accepts it, and only then can the proposing side send.\n  </p>\n\n  <!-- (actionSuccess) \u2014 Send Money is a button on THIS table, so without this wire the Transfers list below\n       still shows the previous rows after money has already moved. -->\n  <spa-table [config]=\"tenantTransferService.linksTableConfig\" (actionSuccess)=\"arrangementActioned()\"></spa-table>\n\n  <div class=\"tt-gap\"></div>\n\n  <spa-table [config]=\"tenantTransferService.transfersTableConfig\" [reload]=\"tenantTransferService.transfersReload\"></spa-table>\n\n</div>\n", styles: [".tenant-transfers{max-width:100%;min-width:0}.tenant-transfers .tt-lead{max-width:74ch;margin:0 0 20px;line-height:1.55;opacity:.85;overflow-wrap:break-word}.tenant-transfers spa-table{display:block;max-width:100%;min-width:0;overflow-x:auto}.tenant-transfers .tt-gap{height:28px}\n"], dependencies: [{ kind: "component", type: TableComponent, selector: "spa-table", inputs: ["data", "tileData", "config", "localMode", "parentDetails", "reload", "activeTab", "inTab", "nestingLevel"], outputs: ["dataLoad", "totalChange", "actionSuccess", "refreshClick", "searchClick", "createClick", "actionClick", "inputChange", "actionResponse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TenantTransfersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'spa-tenant-transfers', standalone: false, template: "<!-- Organisation Transfers \u2014 the handshake and the money that flows over it. Two sections in one page\n     deliberately: an arrangement is meaningless without the transfers it permits, and a transfer is\n     unreadable without the arrangement that authorised it. -->\n<h4>Organisation Transfers</h4>\n<hr>\n\n<div class=\"mt-3 tenant-transfers\" style=\"font-size: 14px;\">\n\n  <p class=\"tt-lead\">\n    Money can only move between two organisations that have <strong>agreed an arrangement</strong> first.\n    One side proposes it, the other accepts it, and only then can the proposing side send.\n  </p>\n\n  <!-- (actionSuccess) \u2014 Send Money is a button on THIS table, so without this wire the Transfers list below\n       still shows the previous rows after money has already moved. -->\n  <spa-table [config]=\"tenantTransferService.linksTableConfig\" (actionSuccess)=\"arrangementActioned()\"></spa-table>\n\n  <div class=\"tt-gap\"></div>\n\n  <spa-table [config]=\"tenantTransferService.transfersTableConfig\" [reload]=\"tenantTransferService.transfersReload\"></spa-table>\n\n</div>\n", styles: [".tenant-transfers{max-width:100%;min-width:0}.tenant-transfers .tt-lead{max-width:74ch;margin:0 0 20px;line-height:1.55;opacity:.85;overflow-wrap:break-word}.tenant-transfers spa-table{display:block;max-width:100%;min-width:0;overflow-x:auto}.tenant-transfers .tt-gap{height:28px}\n"] }]
+        }], ctorParameters: () => [{ type: TenantTransferService }] });
+
+// New revenue schedule dialog (C7) — defer a submitted invoice's net revenue over a date range
+class RevenueScheduleDialogComponent {
+    constructor() {
+        this.dialogRef = inject((MatDialogRef));
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.messageService = inject(MessageService);
+        this.invoiceID = null;
+        this.startDate = '';
+        this.endDate = '';
+        this.invoices = [];
+    }
+    ngOnInit() {
+        this.http.get(`${this.httpService.apiUrl}revenueschedules/eligible-invoices/x`)
+            .subscribe(res => this.invoices = res?.data ?? []);
+    }
+    save() {
+        const dto = { invoiceID: this.invoiceID, startDate: this.startDate, endDate: this.endDate };
+        this.http.post(`${this.httpService.apiUrl}revenueschedules/dto?action=create`, dto)
+            .subscribe(res => {
+            this.messageService.toast(res?.message ?? (res?.success ? 'Schedule created' : 'Failed'));
+            if (res?.success)
+                this.dialogRef.close(true);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: RevenueScheduleDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: RevenueScheduleDialogComponent, isStandalone: false, selector: "spa-revenue-schedule-dialog", ngImport: i0, template: `
+    <h2 mat-dialog-title>Defer Invoice Revenue</h2>
+    <mat-dialog-content>
+      <div style="display: flex; gap: 16px; flex-wrap: wrap;">
+        <mat-form-field style="min-width: 280px;">
+          <mat-label>Invoice</mat-label>
+          <mat-select [(ngModel)]="invoiceID">
+            <mat-option *ngFor="let option of invoices" [value]="option.value">{{ option.name }}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>Service Period Start</mat-label>
+          <input matInput type="date" [(ngModel)]="startDate">
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>Service Period End</mat-label>
+          <input matInput type="date" [(ngModel)]="endDate">
+        </mat-form-field>
+      </div>
+      <p><em>The invoice's net revenue (excl. VAT) moves to Deferred Revenue and is recognized monthly, pro-rata by days, as each period ends.</em></p>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button (click)="dialogRef.close(false)">Cancel</button>
+      <button mat-flat-button color="primary" (click)="save()" [disabled]="!invoiceID || !startDate || !endDate || endDate <= startDate">Defer Revenue</button>
+    </mat-dialog-actions>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i4$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i4$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i7$1.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", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: RevenueScheduleDialogComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-revenue-schedule-dialog',
+                    template: `
+    <h2 mat-dialog-title>Defer Invoice Revenue</h2>
+    <mat-dialog-content>
+      <div style="display: flex; gap: 16px; flex-wrap: wrap;">
+        <mat-form-field style="min-width: 280px;">
+          <mat-label>Invoice</mat-label>
+          <mat-select [(ngModel)]="invoiceID">
+            <mat-option *ngFor="let option of invoices" [value]="option.value">{{ option.name }}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>Service Period Start</mat-label>
+          <input matInput type="date" [(ngModel)]="startDate">
+        </mat-form-field>
+        <mat-form-field>
+          <mat-label>Service Period End</mat-label>
+          <input matInput type="date" [(ngModel)]="endDate">
+        </mat-form-field>
+      </div>
+      <p><em>The invoice's net revenue (excl. VAT) moves to Deferred Revenue and is recognized monthly, pro-rata by days, as each period ends.</em></p>
+    </mat-dialog-content>
+    <mat-dialog-actions align="end">
+      <button mat-button (click)="dialogRef.close(false)">Cancel</button>
+      <button mat-flat-button color="primary" (click)="save()" [disabled]="!invoiceID || !startDate || !endDate || endDate <= startDate">Defer Revenue</button>
+    </mat-dialog-actions>
+  `,
+                    standalone: false
+                }]
+        }] });
+
+// Revenue Schedules page (C7) — deferred revenue schedules with recognize-due sweep and cancel
+class RevenueSchedulesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.dataService = inject(DataServiceLib); // Added: supplies dialogPanelClass so this dialog honours appConfig.dialogStyle
+        this.dialog = inject(MatDialog);
+        this.pageConfig = {
+            title: 'Revenue Schedules',
+            tableConfig: this.accountingService.revenueSchedulesTableConfig
+        };
+    }
+    ngOnInit() {
+    }
+    newSchedule() {
+        this.dialog.open(RevenueScheduleDialogComponent, { width: '760px', maxWidth: '95vw', panelClass: this.dataService?.dialogPanelClass ?? [] }) // Changed: was missing panelClass, so this dialog never picked up the modern surface
+            .afterClosed().subscribe(saved => { if (saved)
+            this.page?.tableReload.next(true); });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: RevenueSchedulesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: RevenueSchedulesComponent, isStandalone: false, selector: "spa-revenue-schedules", viewQueries: [{ propertyName: "page", first: true, predicate: PageComponent, descendants: true }], ngImport: i0, template: `
+    <div style="display: flex; justify-content: flex-end;">
+      <button mat-stroked-button (click)="newSchedule()">
+        <mat-icon>schedule_send</mat-icon> Defer Invoice Revenue
+      </button>
+    </div>
+    <spa-page [config]="pageConfig"></spa-page>
+  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: RevenueSchedulesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-revenue-schedules',
+                    template: `
+    <div style="display: flex; justify-content: flex-end;">
+      <button mat-stroked-button (click)="newSchedule()">
+        <mat-icon>schedule_send</mat-icon> Defer Invoice Revenue
+      </button>
+    </div>
+    <spa-page [config]="pageConfig"></spa-page>
+  `,
+                    standalone: false
+                }]
+        }], propDecorators: { page: [{
+                type: ViewChild,
+                args: [PageComponent]
+            }] } });
+
+// Quotations page (C10) — two-step create pattern with send/accept/reject/convert lifecycle + PDF download (C8)
+class QuotesComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.httpService = inject(HttpService);
+        this.http = inject(HttpClient);
+        this.pageConfig = {
+            title: 'Quotations',
+            tableConfig: this.accountingService.quotesTableConfig
+        };
+    }
+    ngOnInit() {
+    }
+    // PDF button emits actionClick; download the blob (mirrors invoice PDF flow)
+    actionClicked(event) {
+        if (event.name === 'pdf')
+            this.download(event.data);
+    }
+    download(quote) {
+        this.http.post(`${this.httpService.apiUrl}quotes/pdf?action=x`, quote, { responseType: 'blob' })
+            .subscribe((response) => {
+            const blob = new Blob([response], { type: 'application/pdf' });
+            const url = window.URL.createObjectURL(blob);
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = `Quote_${quote.quoteID}.pdf`;
+            link.click();
+            window.URL.revokeObjectURL(url);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: QuotesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: QuotesComponent, isStandalone: false, selector: "spa-quotes", ngImport: i0, template: '<spa-page [config]="pageConfig" (actionClick)="actionClicked($event)"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: QuotesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-quotes',
+                    template: '<spa-page [config]="pageConfig" (actionClick)="actionClicked($event)"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// Quotation rate card admin page (quotations-suite) — the quotable services a quotation is priced from, with
+// their variant rates on a nested tab. Two-step create: the service header is created first, then the details
+// dialog opens on its Rates tab. Every config lives on AccountingService beside the quotations configs, so
+// this page is the same nine lines the Quotations page is.
+class RateCardComponent {
+    constructor() {
+        this.accountingService = inject(AccountingService);
+        this.pageConfig = {
+            title: 'Quotation Rate Card',
+            tableConfig: this.accountingService.quotableServicesTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: RateCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: RateCardComponent, isStandalone: false, selector: "spa-rate-card", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: RateCardComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-rate-card',
+                    template: '<spa-page [config]="pageConfig"></spa-page>',
+                    standalone: false
+                }]
+        }] });
+
+// Changed: Exported routes array for use by SpaHomeRoutingModule
+//
+// Added (F3): leaf-level data.moduleKey. INERT metadata — nothing in this library reads it and no guard is
+// attached here; a consumer opts in from its own home route. The path says "accounting" but three separate
+// ModuleCatalog modules have pages under it, so the leaves that do NOT belong to Accounting say so explicitly
+// (deepest data wins in the resolver, so a leaf overrides the area). Keys are transcribed from the CapItem
+// tree in datalib.service.ts — the same source the nav menu already gates on — not invented:
+//   invoicing  -> capInvoicing.capSubItems (datalib.service.ts:372) — dashboard, quotes, invoices,
+//                 credit notes, receipts, revenue schedules, aging, statements
+//   purchasing -> capSupplierAging (:520) is a child of capPurchasingModule (:456) despite its accounting path
+// Everything left bare here is a capAccounting sub-item (:267) and correctly inherits the area's "accounting".
+const ACCOUNTING_ROUTES = [
+    { path: "accounts", component: AccountsComponent },
+    { path: "aggregates", component: AggregatesComponent },
+    { path: "transaction-types", component: TransactionTypesComponent },
+    { path: "transactions", component: TransactionsComponent },
+    { path: "invoices", component: InvoicesComponent, data: { moduleKey: 'invoicing' } }, // Added (F3): Invoicing, not Accounting
+    { path: "aging", component: AgingComponent, data: { moduleKey: 'invoicing', capName: 'cap58' } }, // Added (F3): capAging is a capInvoicing sub-item // Changed: added INERT capName — nothing in this library reads it; cap58 is capAging, whose menu link is exactly "home/accounting/aging" (datalib.service.ts:489,491). A consumer that attaches capabilityGuard() in its OWN route table refuses the deep link; an app that never adds that line is unaffected
+    { path: "supplier-aging", component: SupplierAgingComponent, data: { moduleKey: 'purchasing', capName: 'cap63' } }, // Added (F3): AP Aging belongs to Purchasing // Changed: added INERT capName — cap63 is capSupplierAging, menu link exactly "home/accounting/supplier-aging" (datalib.service.ts:597,599)
+    { path: "statements", component: StatementComponent, data: { moduleKey: 'invoicing' } }, // Added (F3): customer statement is an Invoicing page
+    { path: "reports", component: ReportsComponent },
+    { path: "tax-rates", component: TaxRatesComponent },
+    { path: "standing-orders", component: StandingOrdersComponent },
+    { path: "currencies", component: CurrenciesComponent }, // Changed: Removed Fixed Assets routes — moved to Assets module
+    { path: "budgets", component: BudgetsComponent },
+    { path: "budget-vs-actual", component: BudgetVsActualComponent },
+    { path: "dashboard", component: AccountingDashboardComponent },
+    { path: "invoice-dashboard", component: InvoiceDashboardComponent, data: { moduleKey: 'invoicing' } }, // Added (F3): Invoicing dashboard
+    { path: "credit-notes", component: CreditNotesComponent, data: { moduleKey: 'invoicing' } }, // Changed: Credit notes route (B6) // Added (F3)
+    { path: "vat-return", component: VatReturnComponent }, // Changed: VAT return route (B2)
+    { path: "fiscal-periods", component: FiscalPeriodsComponent }, // Changed: Fiscal periods route (C2)
+    { path: "receipts", component: ReceiptsComponent, data: { moduleKey: 'invoicing' } }, // Changed: Customer receipts route (C3) // Added (F3)
+    { path: "bank-reconciliation", component: BankReconciliationComponent }, // Changed: Bank reconciliation route (C4)
+    { path: "tenant-transfers", component: TenantTransfersComponent }, // Added (N11): Organisation Transfers
+    { path: "revenue-schedules", component: RevenueSchedulesComponent, data: { moduleKey: 'invoicing' } }, // Changed: Deferred revenue route (C7) // Added (F3)
+    { path: "quotes", component: QuotesComponent, data: { moduleKey: 'invoicing' } }, // Changed: Quotations route (C10) // Added (F3)
+    { path: "rate-card", component: RateCardComponent, data: { moduleKey: 'invoicing' } } // Added (quotations-suite): the rate card the guided quote builder prices from — same module key and same cap53 server gate as Quotations
+];
+class AccountingRoutingModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: AccountingRoutingModule, imports: [i1$2.RouterModule], exports: [RouterModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingRoutingModule, imports: [RouterModule.forChild(ACCOUNTING_ROUTES), RouterModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingRoutingModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [RouterModule.forChild(ACCOUNTING_ROUTES)],
+                    exports: [RouterModule]
+                }]
+        }] });
+
+class AccountingModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: AccountingModule, declarations: [AccountsComponent,
+            AggregatesComponent,
+            AgingComponent,
+            SupplierAgingComponent,
+            TransactionTypesComponent,
+            TransactionsComponent,
+            InvoicesComponent,
+            StatementComponent,
+            ReportsComponent,
+            BudgetsComponent,
+            BudgetVsActualComponent,
+            AccountingDashboardComponent,
+            InvoiceDashboardComponent,
+            CreditNotesComponent, // Changed: Credit notes page (B6)
+            VatReturnComponent, // Changed: VAT return page (B2)
+            FiscalPeriodsComponent, // Changed: Fiscal periods page (C2)
+            ReceiptsComponent, // Changed: Customer receipts page (C3)
+            BankReconciliationComponent, // Changed: Bank reconciliation page (C4)
+            TenantTransfersComponent, // Added (N11): Organisation Transfers page
+            StatementImportDialogComponent, // Changed: Statement import dialog (C4)
+            ReconcileDialogComponent, // Changed: Reconcile match screen (C4)
+            RevenueSchedulesComponent, // Changed: Deferred revenue page (C7)
+            RevenueScheduleDialogComponent, // Changed: Defer revenue dialog (C7)
+            QuotesComponent, // Changed: Quotations page (C10)
+            RateCardComponent // Added (quotations-suite): quotation rate card admin page
+        ], imports: [AccountingRoutingModule,
+            CommonModule,
+            SpaAdminModule,
+            // Changed: Standalone components must be imported, not declared
+            TaxRatesComponent,
+            StandingOrdersComponent,
+            CurrenciesComponent // Changed: Removed Fixed Assets — moved to Assets module
+        ] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingModule, imports: [AccountingRoutingModule,
+            CommonModule,
+            SpaAdminModule,
+            // Changed: Standalone components must be imported, not declared
+            TaxRatesComponent,
+            StandingOrdersComponent,
+            CurrenciesComponent // Changed: Removed Fixed Assets — moved to Assets module
+        ] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AccountingModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        AccountsComponent,
+                        AggregatesComponent,
+                        AgingComponent,
+                        SupplierAgingComponent,
+                        TransactionTypesComponent,
+                        TransactionsComponent,
+                        InvoicesComponent,
+                        StatementComponent,
+                        ReportsComponent,
+                        BudgetsComponent,
+                        BudgetVsActualComponent,
+                        AccountingDashboardComponent,
+                        InvoiceDashboardComponent,
+                        CreditNotesComponent, // Changed: Credit notes page (B6)
+                        VatReturnComponent, // Changed: VAT return page (B2)
+                        FiscalPeriodsComponent, // Changed: Fiscal periods page (C2)
+                        ReceiptsComponent, // Changed: Customer receipts page (C3)
+                        BankReconciliationComponent, // Changed: Bank reconciliation page (C4)
+                        TenantTransfersComponent, // Added (N11): Organisation Transfers page
+                        StatementImportDialogComponent, // Changed: Statement import dialog (C4)
+                        ReconcileDialogComponent, // Changed: Reconcile match screen (C4)
+                        RevenueSchedulesComponent, // Changed: Deferred revenue page (C7)
+                        RevenueScheduleDialogComponent, // Changed: Defer revenue dialog (C7)
+                        QuotesComponent, // Changed: Quotations page (C10)
+                        RateCardComponent // Added (quotations-suite): quotation rate card admin page
+                    ],
+                    imports: [
+                        AccountingRoutingModule,
+                        CommonModule,
+                        SpaAdminModule,
+                        // Changed: Standalone components must be imported, not declared
+                        TaxRatesComponent,
+                        StandingOrdersComponent,
+                        CurrenciesComponent // Changed: Removed Fixed Assets — moved to Assets module
+                    ]
+                }]
+        }] });
+
+export { AccountingModule };
+//# sourceMappingURL=tin-spa-accounting.module-Cg4vWaJE.mjs.map