@moatamed-sce/feature-contracts

The SCE Platform contracts domain: the multi-step contract wizard, the contract detail panels, and the contract-document PDF pipeline — packaged as routes, components and utilities you can mount into an Angular app.

Status — cannot be installed from npm today

This package declares @moatamed-sce/shared-state as a peer dependency, and shared-state is not published on npmjs.org. Installing @moatamed-sce/feature-contracts from the public registry therefore fails to resolve its peers. Until shared-state ships, this package is usable only from inside the SCE monorepo.

The combination that does work from npm today is @moatamed-sce/core + @moatamed-sce/ui-components.

What's in it

• Routes — documentContractRoutes and requestContractRoutes, ready to drop into a lazy route config.
• Wizard — the immersive wizard layout (SceContractWizardImmersiveLayoutComponent), its step components (SceFirstPartyStepComponent, SceSecondPartyStepComponent, the second-party type selector and its individual/organization panels, SceContractCreateSuccessComponent), and the entry, exit and validation dialogs.
• Detail panels — a panel per section of a contract: basic info, parties, phases table, payments, boundaries, timeline, documents, comments, additional terms, force majeure, team work, plus the detail actions bar.
• Request-offer and request-contract views — offer header, info grid, attachments, notes and timeline panels; invitation, property and details form sections.
• Editor dialogs — ScePhaseEditorDialogComponent and SceInstallmentEditorDialogComponent.
• Contract-document PDF system — the typed document model (ContractDocumentModel, sections, tables, signature pages), the pagination engine (paginateSectionsWithOverflow and friends), QR generation, watermark resolution, the renderer components, and ContractPdfExportService / exportContractDocumentPdfFile for producing the final PDF.
• Domain utilities and services — field-validation rules (isFieldRequired, validateContractFormDtoForSubmit), supporting-document configuration, contract duration formatting, form snapshot mapping, ContractValidationService, PropertyMainTypesService, ServiceItemsByTemplateService.

Install

Once shared-state is published:

npm install @moatamed-sce/feature-contracts @moatamed-sce/features @moatamed-sce/shared-state @moatamed-sce/ui-components @moatamed-sce/core
ng add @moatamed-sce/core

Peer dependencies

Angular 21, @ngrx/store 21, PrimeNG 21, @ngx-translate/core 18, RxJS 7.8, and the SCE packages core, ui-components and shared-state. jspdf, @zumer/snapdom and qrcode are optional peers — they are only needed if you use the contract-document PDF export.

Quick start

Mount the contract routes lazily:

import { Routes } from '@angular/router';

export const appRoutes: Routes = [
  {
    path: 'contracts',
    loadChildren: () => import('@moatamed-sce/feature-contracts').then(m => m.documentContractRoutes),
  },
];

Or use a single panel on your own page:

import { Component, signal } from '@angular/core';
import { SceContractPaymentsPanelComponent, type ContractPayment } from '@moatamed-sce/feature-contracts';

@Component({
  selector: 'app-contract-summary',
  standalone: true,
  imports: [SceContractPaymentsPanelComponent],
  template: `<sce-contract-payments-panel [payments]="payments()" />`,
})
export class ContractSummaryComponent {
  readonly payments = signal<ContractPayment[]>([]);
}

These components expect the SCE store and API services in DI, so they are not drop-in for a non-SCE backend.

Translations are not included

The published tarballs ship no i18n JSON. Every label in the wizard and the detail panels is a translation key; without your own ngx-translate dictionary, they render raw keys such as CONTRACT.PARTIES_TITLE.

Docs

• Consuming the packages in an external app
• Design tokens
• Component catalog

License

MIT