PRO
widget.js

Віджет автозаповнення компанії

Вбудовуване поле для форм: пошук за назвою або CUI, вибір компанії та заповнення полів клієнта.

https://demoanaf.ro/widget.js
Vanilla JS, Shadow DOM, без React

Виявлення

Пошук компаній за назвою через індекс ONRC та прийом числового CUI безпосередньо.

Автозаповнення

Заповнює загальні поля за атрибутами `name`, `id` або `data-demoanaf-target`.

Маппінг

Дозволяє явний маппінг за допомогою селекторів сайту, що інтегрує віджет.

Живе демо

Віджет нижче заповнює тестову форму після вибору компанії.

actual widget.js

Завантаження віджета…

Автоматична інтеграція

Загальні поля, такі як `company_name`, `cui`, `company_address`, `locality`, `county`, виявляються автоматично в межах тієї самої форми.

JavaScript
<form>
  <div data-demoanaf-cui></div>

  <input name="company_name" />
  <input name="cui" />
  <input name="registration_number" />
  <input name="company_address" />
  <input name="locality" />
  <input name="county" />
</form>
<script src="https://demoanaf.ro/widget.js" async></script>

Явний маппінг

Для кас та CRM із власними назвами полів передавайте селектори в `fields`.

JavaScript
<div id="demoanaf-company"></div>

<input id="billing-company" />
<input id="billing-cui" />
<input id="billing-address" />

<script src="https://demoanaf.ro/widget.js"></script>
<script>
  DemoANAF.init('#demoanaf-company', {
    fields: {
      name: '#billing-company',
      cui: '#billing-cui',
      address: '#billing-address'
    }
  });
</script>

Конфігурація вигляду та деталей

За замовчуванням після вибору віджет показує картку компанії. Для компактних кас `showDetails: false` залишає лише автодоповнення + автозаповнення. `compact` і `badge` включаються за бажанням.

JavaScript
DemoANAF.init('#demoanaf-company', {
  showDetails: false,
  compact: true,
  placeholder: 'Caută firma pentru facturare...',
  badge: {
    enabled: true,
    text: 'Firmă verificată'
  },
  styles: {
    primary: '#003B73',
    primarySoft: '#E6EEF5',
    background: '#ffffff',
    text: '#111827',
    border: '#d1d5db',
    focusBorder: '#003B73',
    radius: '8px'
  }
});

Нормалізований payload

Нормалізація вимкнена за замовчуванням. Коли увімкнена, віджет записує канонічний JSON у наявне або новостворене приховане поле форми.

JavaScript
DemoANAF.init('#demoanaf-company', {
  normalize: {
    enabled: true,
    name: 'demoanaf_company_json'
  }
});

// Creează sau completează:
// <input type="hidden" name="demoanaf_company_json">

Клієнтська подія

Після заповнення віджет генерує `demoanaf:prefill` з нормалізованою компанією та списком заповнених полів.

JavaScript
document
  .querySelector('#demoanaf-company')
  .addEventListener('demoanaf:prefill', (event) => {
    console.log(event.detail.company);
  });