PRO
widget.js

Widget precompletare firme

Input embeddable pentru formulare: caută după nume sau CUI, selectează firma și completează câmpurile clientului.

https://demoanaf.ro/widget.js
Vanilla JS, Shadow DOM, fără React

Discovery

Caută firme după nume prin indexul ONRC și acceptă CUI numeric direct.

Autofill

Completează câmpuri uzuale după `name`, `id` sau atribute `data-demoanaf-target`.

Mapping

Permite mapare explicită prin selectorii site-ului care integrează widgetul.

Demo live

Widgetul de mai jos completează formularul de test după selecția firmei.

actual widget.js

Se încarcă widgetul...

Integrare automată

Câmpurile comune precum `company_name`, `cui`, `company_address`, `locality`, `county` sunt detectate automat în același formular.

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>

Mapare explicită

Pentru checkout-uri și CRM-uri cu nume proprii de câmpuri, transmite selectorii în `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>

Config aspect și detalii

Implicit, widgetul arată cardul firmei după selecție. Pentru checkout-uri compacte, `showDetails: false` lasă doar autocomplete + autofill. `compact` și `badge` sunt opt-in.

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 normalizat

Normalizarea este dezactivată implicit. Când este activată, widgetul scrie un JSON canonic într-un câmp ascuns existent sau creat în formular.

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

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

Eveniment client

După completare, widgetul emite `demoanaf:prefill` cu firma normalizată și lista câmpurilor completate.

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