Фронтенд

Фронтенд ms3PromoCode состоит из двух уровней:

Уровень	Описание
Headless-ядро	Глобальный объект `window.ms3PromoCode` — `apply` / `remove` / `validate` / `getCurrent` / события
UI-слой	Готовая форма ввода, монтируется по `[data-ms3-promocode="form"]`

UI-слой не обязателен. Headless-ядро работает без него — для своих JS-интеграций (Vue/React/Svelte/любой SPA).

Что подключается

Управляется системной настройкой ms3promocode.frontend_assets_preset:

Пресет	Подключаемые файлы
`core_ui`	Headless + UI + CSS (по умолчанию)
`core`	Только headless — для собственных SPA-интеграций
`none`	Ничего — шаблон сам подключает нужные файлы

Файлы пакета

assets/components/ms3promocode/
├── css/web/
│   └── ms3promocode.css            # стили UI-формы
├── js/web/
│   ├── core/
│   │   ├── ApiClient.js            # HTTP-обёртка
│   │   └── PromoCodeAPI.js         # маппинг на REST-эндпоинты
│   ├── ms3promocode.headless.js    # глобал window.ms3PromoCode
│   ├── ui/
│   │   └── PromoCodeUI.js          # класс готовой UI-формы
│   └── ms3promocode.js             # автомонтаж UI по data-атрибутам

Разделы

Документ	Описание
Шаблон формы	Чанк, data-атрибуты, папка переопределений
JS API	`window.ms3PromoCode` — методы и события

Сценарии использования

1. Готовая форма «из коробки»

Пресет core_ui (по умолчанию). В шаблоне корзины:

fenom

{'!ms3PromoCodeForm' | snippet}

Всё работает — форма видна, применение и снятие по клику, цены пересчитываются.

2. Своя форма, наша логика

Пресет core_ui. В шаблоне — свой HTML с data-ms3-promocode="form" и блоками data-ms3pc-state="empty/applied". UI-слой подхватит форму автоматически.

См. Шаблон формы.

3. Полный headless

Пресет core — UI-слой не загружается. Свой компонент (Vue/React) обращается к window.ms3PromoCode.apply(...) напрямую.

См. JS API.

Фронтенд ​

Что подключается ​

Файлы пакета ​

Разделы ​

Сценарии использования ​

1. Готовая форма «из коробки» ​

2. Своя форма, наша логика ​

3. Полный headless ​