Настройка

Зарегистрируйте элемент один раз, затем настройте каждый экземпляр атрибутами (строки) и свойствами (объекты/функции).

import { defineImportSuiteElement, mountImportFlow } from '@capitality-io/mildport-widget';
await defineImportSuiteElement('mildport-import');

Одна поверхность конфигурации: `targets`

Объявите, какие типы записей можно создавать и какие поля несёт каждый из них. Mildport внутренне выводит сопоставление, валидацию и capture-first UX из этого каталога.

Сценарий	Пример
Capture-first (PDF, фото, заметки)	Несколько targets — Contact, Lead, Task…
Таблица с несколькими сущностями	`{ id: 'person', fields: [...] }`, `{ id: 'organization', fields: [...] }`
Один плоский CSV	Один target — `{ id: 'contact', fields: [...] }`

Рекомендуется: используйте mountImportFlow(), чтобы объединить targets, флаги загрузки, режим применения и память сопоставлений. См. Capture-first импорты.

Атрибуты

Атрибут	Описание
`api-base-url`	Origin вашего самостоятельно размещаемого (или пилотного) движка, напр. `https://imports.your-infra.example`.
`license-key`	Подписанный ключ лицензии тенанта, который движок проверяет офлайн.
`grid-impl`	Реализация сетки проверки (напр. `slickgrid`).

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

Свойства

Свойство	Тип	Описание
`targets`	`TargetCatalog`	Обязательно — типы записей + метаданные полей (типы, валидаторы, алиасы сопоставления).
`applyMode`	`'webhook' \| 'browser'`	Доставка через подписанный вебхук применения или возврат строк прямо на странице.
`mappingIdentifier`	`string \| null`	Стабильный id, чтобы подтверждённые сопоставления запоминались между импортами.
`hostConfig`	`ImportSuiteHostConfig`	Принимаемые форматы, объединения файлов, хуки очистки, примеры данных, уровень ИИ-очистки (`aiTransforms: 'off' \| 'suggest' \| 'full'`) и `actor` для аудита.
`profile`	`ImportProfile`	Версионируемый профиль импорта (`{mapping?, recipe?}`): маппинг применяется автоматически, рецепт появляется как подсказка очистки в один клик на шаге проверки.
`onResults`	`(rows, mapping) => void`	Колбэк в режиме браузера с доставленными строками + сопоставлением.

Пример — `mountImportFlow` (рекомендуется)

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

mountImportFlow(el, {
  id: 'tenant-contacts',
  version: 'v1',
  targets: [
    {
      id: 'person',
      label: 'Человек',
      fields: [
        {
          key: 'person.firstName',
          label: 'Имя',
          alternativeMatches: ['given name', 'vorname'],
        },
        {
          key: 'person.email',
          label: 'Эл. почта',
          columnType: 'email',
          required: true,
        },
      ],
    },
    {
      id: 'organization',
      label: 'Организация',
      fields: [{ key: 'organization.name', label: 'Название компании' }],
    },
  ],
  input: { acceptedFormats: ['spreadsheet', 'text', 'pdf', 'image'] },
  delivery: { mode: 'browser' },
});

el.onResults = (rows, mapping) => sync(rows, mapping);

Пример — задать `targets` напрямую

el.targets = [
  {
    id: 'contact',
    label: 'Контакт',
    fields: [
      { key: 'contact.email', label: 'Эл. почта', columnType: 'email', required: true },
      { key: 'contact.name', label: 'Имя' },
    ],
  },
];
el.applyMode = 'browser';
el.hostConfig = { acceptedFormats: ['pdf', 'image', 'text', 'spreadsheet'] };

Дальше: События и применение.