Schnellstart

So bekommen Sie einen funktionierenden Import-Ablauf auf Ihre Seite. Sie benötigen Zugriff auf die veröffentlichten Pakete und einen selbstgehosteten (oder Pilot-)Engine-Endpunkt mit einem signierten Lizenzschlüssel.

Zugriff

Pakete werden in GitHub Packages veröffentlicht (npm.pkg.github.com, Scope @capitality-io, eingeschränkt). Ein einfaches npm install gegen die öffentliche Registry funktioniert nicht — Zugriff kommt mit einem Piloten oder einer Lizenz. Schreiben Sie an [email protected].

1. Paket installieren

npm install @capitality-io/import-suite-ng

2. Custom Element definieren

main.ts

import { defineImportSuiteElement } from '@capitality-io/import-suite-ng';

// Framework-agnostic — registers <mildport-import> once, for the whole app.
await defineImportSuiteElement('mildport-import');

3. Einbauen und auf Ihre Engine zeigen

<mildport-import
  api-base-url="https://imports.your-infra.example"
  license-key="SIGNED_TENANT_KEY"
></mildport-import>

wire-it-up.ts

const el = document.querySelector('mildport-import')!;

// The target data model — what a clean row looks like in your product.
el.columnSchema = yourTargetSchema;

// Receive clean rows in the browser…
el.addEventListener('import-applied', e => sync(e.detail));
// …or, in production, take a signed apply webhook on your backend instead.

Das ist die gesamte Integrationsfläche: Attribute rein, DOM-Events raus. Kein SDK-Lock-in, kein iframe.

Weiter

• Widget konfigurieren — columnSchema, Attribute, Apply-Modi.
• Events & Apply — die Lifecycle-Events und wie Zeilen Ihre App erreichen.
• Theming — das Widget an Ihr Designsystem anpassen.