CoreForm

Примеры использования и документация.

Конфигурируемая форма фидбек-класса (с заголовком формы — title в конфиге): поля, лейаут (1–4 колонки, ширина поля span) и валидации описываются декларативным конфигом — объектом, JSON-строкой или YAML-props-блоком (фенс yaml с метой [props]) прямо внутри контейнера ::core-form в markdown, без экранирования. Подписи чекбоксов поддерживают markdown-ссылки [текст](URL) — например, на политику персональных данных. Валидации — mini-DSL из встроенного реестра (required, checked, email, tel, minLength:N, maxLength:N, minValue:N, maxValue:N, pattern:, oneOf:a,b) с готовой локализацией; через MDC передаются только имена правил. Отправка — fetch на заданный action (критерий успеха — response.ok), инлайн-статус с role="status"/"alert" и программным фокусом, события success/error — для интеграции с useNotices. Гид по валидации — техническая страница /dev/regle. В проде-статике server-роутов нет: несуществующий action честно показывает errorText.

Тот же конфиг в YAML — CoreForm принимает и строку.

Настройки

Путь отправки

Метод

Колонки

Заголовок формы

Текст кнопки

Текст успеха

Текст ошибки

Сброс после успехаПунктирная обводка групп

Заголовок группы
3 поля
- Имя · text
- Email · email
- Роль · select
Заголовок группы
1 поле
- Сообщение · textarea
Заголовок группы
1 поле
- Согласен с [политикой конфиденциальности](/privacy) · checkbox

Предпросмотр

Роут /api/__dev/form-echo существует только в dev-режиме: на статике отправка вернёт ошибку, и форма покажет текст ошибки.

VUE

<script setup lang="ts">
const formConfig: CoreFormConfig = {
  "action": "/api/__dev/form-echo",
  "method": "POST",
  "columns": 2,
  "groups": [
    {
      "id": "g-1",
      "fields": [
        {
          "name": "name",
          "type": "text",
          "label": "Имя",
          "rules": [
            "required",
            "minLength:2"
          ]
        },
        {
          "name": "email",
          "type": "email",
          "label": "Email",
          "rules": [
            "required",
            "email"
          ]
        },
        {
          "name": "role",
          "type": "select",
          "label": "Роль",
          "rules": [
            "required"
          ],
          "options": [
            "Dev",
            "Design",
            "Other"
          ]
        }
      ]
    },
    {
      "id": "g-5",
      "fields": [
        {
          "name": "message",
          "type": "textarea",
          "label": "Сообщение",
          "placeholder": "Ваше сообщение",
          "span": 2,
          "rules": [
            "maxLength:200"
          ]
        }
      ]
    },
    {
      "id": "g-7",
      "fields": [
        {
          "name": "consent",
          "type": "checkbox",
          "label": "Согласен с [политикой конфиденциальности](/privacy)",
          "rules": [
            "required"
          ]
        }
      ]
    }
  ],
  "fields": [],
  "submitLabel": "Отправить",
  "successText": "Отправлено!",
  "errorText": "Ошибка отправки",
  "resetOnSuccess": true
}
</script>

<template>
  <CoreForm
    :config="formConfig"
  />
</template>

MDC

::core-form
```yaml [props]
action: /api/__dev/form-echo
method: POST
columns: 2
submitLabel: Отправить
successText: Отправлено!
errorText: Ошибка отправки
resetOnSuccess: true
groups:
  -
    fields:
      - name: name
        type: text
        label: Имя
        rules:
          - required
          - 'minLength:2'
      - name: email
        type: email
        label: Email
        rules:
          - required
          - email
      - name: role
        type: select
        label: Роль
        rules:
          - required
        options:
          - Dev
          - Design
          - Other
  -
    fields:
      - name: message
        type: textarea
        label: Сообщение
        placeholder: Ваше сообщение
        span: 2
        rules:
          - 'maxLength:200'
  -
    fields:
      - name: consent
        type: checkbox
        label: 'Согласен с [политикой конфиденциальности](/privacy)'
        rules:
          - required
```

Опции
Имя	Тип	Варианты	По умолчанию	Описание
config	CoreFormConfig \| string	—	—	Конфигурация формы: объект, JSON-строка или YAML-props из MDC

Пройдено 21 из 21прогон 8 ноября 2026 г.

CoreForm — рендер по конфигу › рендерит title формы как h3; без title — не рендерит

CoreForm — рендер по конфигу › рендерит поля всех типов с лейблами и связкой label↔контрол

CoreForm — рендер по конфигу › лейаут: span >= columns → --full, span < columns → --span-N

CoreForm — рендер по конфигу › лейаут: 3 колонки — span 1 база, span 2 в 2 колонки, span 3 вся строка

CoreForm — рендер по конфигу › лейаут: 4 колонки — span 3 в 3 колонки, span 4 вся строка

CoreForm — рендер по конфигу › группы: fieldset+legend на группу, своя сетка колонок

CoreForm — рендер по конфигу › без groups — одна неявная группа (единый fieldset, плоские поля)

CoreForm — рендер по конфигу › groups выигрывают у fields при задаче обоих

CoreForm — рендер по конфигу › конфиг-строка (JSON) эквивалентна объекту

CoreForm — рендер по конфигу › динамическое добавление поля в конфиг рендерит его (живое редактирование)

CoreForm — валидация › пустой сабмит: ошибки у required-полей, fetch не вызван, фокус-таргет aria-invalid

CoreForm — валидация › checkbox checked-семантика: unchecked невалиден, checked валиден

CoreForm — валидация › подпись чекбокса: [текст](URL) рендерится ссылкой

CoreForm — валидация › опасная схема в ссылке рендерится plain-текстом без якоря

CoreForm — сабмит › успех: POST JSON, success-текст из конфига, reset, emit success

CoreForm — сабмит › HTTP 500: error-текст из конфига, emit error со статусом

CoreForm — сабмит › сетевая ошибка: error-текст, emit error без статуса

CoreForm — сабмит › emit submit происходит до валидации и до fetch

CoreForm a11y (axe) › pristine форма — без axe-нарушений

CoreForm a11y (axe) › после пустого сабмита: ошибки полей — без нарушений, один alert на поле

CoreForm a11y (axe) › после успешного сабмита: статус role="status" — без нарушений