4. Integrace: Vanilla JavaScript

Pro e-shopy s vlastním JavaScriptem — dynamická konfigurace, zachytávání událostí, imperativní ovládání.

Widget lze získat několika způsoby:

4.2 Zachytávání událostí

Widget emituje čtyři typy událostí. Všechny mají prefix ppl-accesspointwidget- a prochází přes Shadow DOM (díky composed: true).

Kompletní příklad integrace do pokladny e-shopu:

4.4 Dynamické vytvoření widgetu přes JavaScript

Widget lze vytvořit kompletně z JavaScriptu bez předchozího HTML zápisu. To je užitečné, když chcete widget načíst až po výběru typu doručení zákazníkem.

Varianta A — konfigurace přes HTML atribut (JSON string)

Varianta B — konfigurace přes JavaScript property (objekt)

Poznámka: Při dynamickém vytvoření je doporučeno přidat event listenery před vložením elementu do DOM (pomocí appendChild), aby nedošlo ke ztrátě událostí.

4.5 Dynamická konfigurace za běhu

Metoda configure() umožňuje změnit konfiguraci za běhu. Provádí partial merge — změní pouze zadané parametry a ostatní zachová.

4.6 Získání vybraného výdejního místa

Kromě zachytávání události select lze poslední výběr získat i imperativně:

4.7 Reset widgetu

Resetuje widget do výchozího stavu — odstraní výběr a resetuje filtry:

4. Integrace: Vanilla JavaScript

4.1 Získání reference na widget#

4.2 Zachytávání událostí#

4.3 Modal checkout flow — typický scénář e-shopu#

4.4 Dynamické vytvoření widgetu přes JavaScript#

Varianta A — konfigurace přes HTML atribut (JSON string)#

Varianta B — konfigurace přes JavaScript property (objekt)#

4.5 Dynamická konfigurace za běhu#

4.6 Získání vybraného výdejního místa#

4.7 Reset widgetu#

4.8 Přepínání mezi inline a modal režimem#

4.1 Získání reference na widget