form-father 0.6.0 → 0.7.1

package/README.md

@@ -410,9 +410,12 @@ registerSchemaValidator('company-email', z.string().email(), 'Введите к
 
 ## Демо и рецепты
 
-- `demos/index.html` — статическое демо login/callback/search/upload после `npm run build`.
+- `demos/index.html` — статическое демо login/callback/search/upload/public API после `npm run build`.
 - `npm run demos` — сборка и запуск Vite-сервера для демо.
+- `docs/api/README.md` — компактный справочник публичного API, опций, методов и экспортов.
+- `docs/demo/README.md` — сценарии ручной проверки демо и описание demo forms.
 - `docs/recipes/README.md` — короткие рецепты по API, data-атрибутам, adapters и server errors.
+- `CHANGELOG.md` — история релизов и baseline покрытия.
 
 ## Сборка и разработка
 
@@ -420,6 +423,7 @@ registerSchemaValidator('company-email', z.string().email(), 'Введите к
 
 - **npm run build**: Сборка проекта.
 - **npm run watch**: Сборка в режиме наблюдения.
+- **npm run docs:check**: Проверка версии, ссылок документации, demo-файлов и package README.
 - **npm run demos**: Запуск демо-версии с использованием Vite.
 
 ## Вклад

package/package.json

@@ -1,25 +1,35 @@
 {
 	"name": "form-father",
-	"version": "0.6.0",
+	"version": "0.7.1",
 	"description": "Form Father: Библиотека для обработки форм",
 	"type": "module",
-	"files": ["dist", "README.md", "LICENSE", "RESPONSE_API.md", "CHANGELOG.md", "docs", "demos"],
+	"main": "index.js",
+	"module": "index.js",
+	"types": "index.d.ts",
 	"exports": {
 		".": {
-			"import": "./dist/index.js",
-			"types": "./dist/index.d.ts"
-		}
+			"types": "./index.d.ts",
+			"import": "./index.js",
+			"default": "./index.js"
+		},
+		"./FormFather.min.js": "./FormFather.min.js"
 	},
+	"unpkg": "./FormFather.min.js",
+	"jsdelivr": "./FormFather.min.js",
+	"files": [
+		"index.js",
+		"index.d.ts",
+		"FormFather.min.js",
+		"*.map",
+		"types",
+		"README.md",
+		"LICENSE",
+		"RESPONSE_API.md"
+	],
 	"scripts": {
 		"build": "rollup -c",
 		"watch": "rollup -c -w",
 		"release": "node scripts/release.js",
-		"release:check": "npm test -- --runInBand --watchman=false && npm run build && npm run smoke:package && npm run pack:dry-run",
-		"test": "jest --coverage",
-		"prepublishOnly": "npm test -- --runInBand --watchman=false && npm run build",
-		"pack:dry-run": "npm_config_cache=/tmp/form-father-npm-cache npm pack --dry-run",
-		"smoke:package": "node scripts/smoke-package.mjs",
-		"versions:sync": "node scripts/sync-version.js",
 		"demos": "BUILD_TARGET=demos npm run build && concurrently --kill-others \"vite\" \"npm run watch\""
 	},
 	"repository": {
@@ -47,15 +57,10 @@
 		"@rollup/plugin-json": "^6.1.0",
 		"@rollup/plugin-node-resolve": "^15.3.0",
 		"@rollup/plugin-terser": "^0.4.4",
-		"@types/jest": "^30.0.0",
-		"@types/jsdom": "^21.1.7",
 		"chalk": "^5.3.0",
 		"concurrently": "^9.0.1",
 		"fs-extra": "^11.2.0",
 		"inquirer": "^12.1.0",
-		"jest": "^30.0.5",
-		"jest-environment-jsdom": "^30.0.5",
-		"jsdom": "^26.1.0",
 		"ora": "^8.1.1",
 		"postcss-preset-env": "^10.0.8",
 		"prettier-plugin-jsdoc": "^1.3.0",
@@ -65,9 +70,7 @@
 		"rollup-plugin-dts": "^6.1.1",
 		"rollup-plugin-typescript2": "^0.36.0",
 		"sass-embedded": "^1.80.5",
-		"ts-jest": "^29.4.0",
-		"ts-node": "^10.9.2",
 		"typescript": "^5.6.3",
 		"vite": "^5.4.10"
 	}
-}
+}

package/CHANGELOG.md

@@ -1,135 +0,0 @@
-# Changelog
-
-All notable changes to this project are documented here.
-
-## 0.6.0 - 2026-04-27
-
-### Added
-
-- Added accessible field error wiring via `aria-describedby` with safe preservation of existing descriptions.
-- Added `errorSummary` option with default rendering, custom selector support, focus control, and custom renderers.
-- Added `ariaDescribeErrors` and `errorIdPrefix` options for UI/a11y integration control.
-
-### Changed
-
-- Field, form-level, backend, and manual errors can now share one visible summary while keeping the existing inline error
-  rendering path.
-- Demo forms now include accessible error summaries.
-
-### Tests
-
-- Test suite expanded to 122 tests.
-- Coverage baseline: 98.30% statements, 86.88% branches, 97.25% functions, 100% lines.
-
-## 0.5.0 - 2026-04-27
-
-### Added
-
-- Added field validator DX helpers: `registerFieldValidator()`, `createPatternValidator()`, and
-  `createLengthValidator()`.
-- Added form validator DX helpers: `createFormValidator()`, `sameAsField()`, `requiredIf()`, and `dateOrder()`.
-- Added helper types for reusable form validator predicates and issue factories.
-
-### Changed
-
-- Demo and documentation now use higher-level helper APIs for common password-confirm and validation rule recipes.
-
-### Tests
-
-- Test suite expanded to 115 tests.
-- Coverage baseline: 98.19% statements, 86.91% branches, 97.04% functions, 100% lines.
-
-## 0.4.0 - 2026-04-27
-
-### Added
-
-- Added form-level and cross-field validation via `formValidators`.
-- Added `setErrors()` for backend maps, `ErrorResponse[]`, global form errors, and custom validation issue objects.
-- Added `FORM_ERROR_FIELD` constant for form-level errors in `getErrors()`.
-- Added public TypeScript types for form validation contexts and issues.
-
-### Changed
-
-- `validate()` now runs field-level rules first, then form-level validators over `getValues()`.
-- Cross-field and backend errors share the same rendering path as field validation errors.
-
-### Tests
-
-- Test suite expanded to 113 tests.
-- Coverage baseline: 98.31% statements, 87.05% branches, 96.34% functions, 100% lines.
-
-## 0.3.0 - 2026-04-25
-
-### Added
-
-- Added convenience API: `Form.initAll()`, `updateOptions()`, public `submit()`, `validateField()`, `showFieldError()`,
-  `getErrors()`, `getValues()`, `setValues()`, `clearErrors()`, and `reset()`.
-- Added client validation hooks: `onValidationError`, `onBeforeSubmit`, and `onSubmitError`.
-- Added live validation options: `validateOn`, `revalidateOn`, `validationDebounce`, and `focusFirstErroredInput`.
-- Added `data-validate`, `data-error-*`, and `data-error-container` support while keeping `data-custom-validate`.
-- Added optional mutation observing for dynamic fields and submit buttons.
-- Added race-safe async field validation state with `aria-busy` and configurable field state attributes.
-- Added dependency-free schema adapters: `createSchemaValidator()`, `registerSchemaValidator()`, and
-  `createFieldValidator()`.
-- Added static demos for login, callback/server errors, GET search, and multipart upload.
-- Added recipes documentation for common API, data-attribute, adapter, and server-error flows.
-
-### Changed
-
-- Validation now merges every matching schema rule for a field before applying data-attribute rules.
-- Server-side field errors now populate the public `getErrors()` list.
-- Package contents now include docs, demos, and the changelog.
-
-### Tests
-
-- Test suite expanded to 109 tests.
-- Coverage baseline: 98.10% statements, 86.15% branches, 95.69% functions, 100% lines.
-
-## 0.2.11 - 2026-04-25
-
-### Added
-
-- Added release checklist, package smoke checks, CI workflow, and release gate scripts.
-- Added npm pack dry-run script with a temporary npm cache for local cache permission issues.
-
-### Changed
-
-- Updated package metadata and release workflow after `0.2.10` had already been published.
-
-## 0.2.10 - 2026-04-25
-
-### Added
-
-- Exported public helper APIs from the package entrypoint: `serializeToFormData`, validators, URL/email/phone helpers, scroll helpers, and response helpers.
-- Exported TypeScript types for public consumers: `FormOptions`, `ValidationRule`, `ValidationSchema`, `ErrorResponse`, and `ResponseBody`.
-- Added package smoke checks for built files and public exports.
-- Added CI workflow for tests, build, smoke checks, and npm pack dry-run.
-- Added coverage thresholds to keep the stabilization baseline from regressing.
-
-### Changed
-
-- `new Form(formEl)` now works without an options object.
-- Submit detection now supports implicit submit buttons (`<button>`) and `input[type="image"]`.
-- `GET` and `HEAD` forms now append form data to the action query string and do not send a request body.
-- `wrapData` now applies consistently across supported encodings: `application/x-www-form-urlencoded`, `multipart/form-data`, `text/plain`, and `application/json`.
-- Non-200 HTTP responses, `success !== true`, and invalid JSON responses now flow through `onResponseUnsuccess`.
-- Server-side field errors can be applied to `input`, `textarea`, and `select`.
-- `serializeToFormData` now skips disabled controls, controls marked with `data-no-serialize`, and button controls.
-- Built-in validators are registered idempotently across repeated module imports.
-
-### Fixed
-
-- Loader and `waitResponse` cleanup now runs when `fetch` or response parsing fails.
-- Required radio groups now produce one validation error per group.
-- Field error rendering no longer requires a wrapper-level `showError()` method.
-- Release script now exits with `0` on success and handles missing temporary files during cleanup.
-- Rollup IIFE build no longer warns about mixed default and named exports.
-
-### Tests
-
-- Test coverage baseline: 98.32% statements, 86.34% branches, 93.18% functions, 100% lines.
-- Test suite baseline: 93 tests passing.
-
-## 0.2.9
-
-- Previous published patch release.

package/RESPONSE_API.md

@@ -1,233 +0,0 @@
-## Краткое введение
-
-Эй, ребята! Собрались здесь для того, чтобы понять, как у нас отвечает сервер после того, как отправляем формы через
-AJAX. Это будет не какая-то скучная докуха, а всё по-кубански, с размахом и только по сути!
-
-## Что и как 🛠️
-
-### `success`
-
-- **Тип**: boolean.
-- **Описание**: Флаг, показывающий, всё ли круто.
-- **Как Работает**: Если сервер справился, то `true`, а если нет – `false`.
-
-### `redirect-url`
-
-- **Тип**: string (опционально).
-- **Описание**: Куда пойти, если всё зашибись.
-- **Когда Появляется**: Только если `success` равно `true`.
-
-### `redirect-url-delay`
-
-- **Тип**: number (опционально).
-- **Описание**: Задержка в ms перед редиректом.
-
-### `reload`
-
-- **Тип**: boolean (опционально).
-- **Описание**: Как перезагрузить страничку.
-- **Когда Используем**: Когда сервер скажет "обновись".
-
-### `reload-delay`
-
-- **Тип**: number (опционально).
-- **Описание**: Задержка в ms перед перезагрузкой страницы.
-
-### `error`
-
-- **Тип**: boolean (опционально).
-- **Описание**: Флаг о проблемах.
-- **Как Работает**: Если есть косяк, то `true`.
-
-### `error-msg`
-
-- **Тип**: string (опционально).
-- **Описание**: Пояснения от сервера о косяке.
-- **Пример**: "Тут беда, братишка".
-
-### `errors`
-
-- **Тип**: array (опционально).
-- **Описание**: Список мелких недоразумений.
-- **Содержание**: Конкретные поля и тексты ошибок.
-
-Каждый объект в массиве содержит:
-
-- `name` (string): Имя поля, в котором произошла ошибка.
-- `error-msg` (string): Текст ошибки для данного поля.
-
-### `error-toast`
-
-- Тип: string (опционально).
-- Описание: Выводится всплывашка(toast) с ошибкой.
-- Пример: "Тут беда, братишка".
-
-> [!Caution]
-> `error-toast` DEPRECATED!!!
-
-### `toast`
-- Тип: объект | массив объектов.
-- Описание: Выводит определённый тип тоста и передаёт опции.
-- Пример, один тост:
-```
-{
-  type: 'success',
-  title: 'Успешно',
-}
-```
-
-- Пример, несколько тостов за раз:
-```
-[
-  {
-    type: 'success',
-    title: 'Успешно',
-  },
-  {
-    type: 'error',
-    title: 'Ошибка',
-  }
-]
-```
-
-
-## Примеры ответов 📝
-
-### `Когда всё чик-пук, и можно идти дальше.`
-
-```json
-{
-  "success": true,
-}
-```
-
-### `Если нужен редирект.`
-
-```json
-{
-  "success": true,
-  "redirect-url": "https://example.com/success",
-  "redirect-url-delay": 5000, // если нужна задержка перед редиректом
-}
-```
-
-### `Если нужна перезагрузка страницы.`
-
-```json
-{
-  "success": true,
-  "reload": true,
-  "reload-delay": 5000, // если нужна задержка перед обновлением страницы
-}
-```
-
-### `Когда надо что-то менять.`
-
-```json
-{
-  "success": false,
-  "error": true,
-  "error-msg": "Тут беда, братишка",
-  "errors": [
-    {
-      "name": "email",
-      "error-msg": "Эй, мэйл какой-то кривой"
-    }
-  ]
-}
-```
-
-Вот и всё, ребятки! Теперь вы знаете, как наш сервер отзывается на ваши AJAX-формы. Дерзайте!
-
-# Как работать с e-commerce
-
-- В сниппете #src/snippets/\_ym-metrika.html лежит пример кода инициализации Яндекс.Метрики.
-- В скрипте с id='ecommerceScript' есть 2 важных момента: первый - это пример запуска необходимого кода сразу после
-  инициализации Яндекс.метрики, а второй - это функция, которая принимает данные и с учётом этого происходят действия
-  необходимые для метрик.
-- На данный момент существует только 4 события: `click`, `submit`, `ajax-success` и `ajax-fail`.
-- Атрибут `data-ecom-data` нужно указывать, только для тех событий, которые не ожидают ответа от сервера.
-
-## Примеры использования атрибутов:
-
-### Обычный клик на ссылке
-
-```html
-<a
-  href="#"
-  data-ecom-action="click"
-  data-ecom-data='{
-        "click": {
-            "ymCounter123123123": "pull-right",
-            "dataLayer": []
-        }
-    }'
->
-  Оформить заказ
-</a>
-```
-
-### Множественное количество событий на Форме-кнопке
-
-```html
-<button
-  data-form-button
-  data-form-button-action="/endpoint"
-  data-form-button-method="POST"
-  data-form-button-data='{"someProperties": "1234"}'
-  data-ecom-action="click,ajax-success,submit"
-  data-ecom-data='{
-        "click": {
-            "ymCounter123123123": "pull-right",
-            "dataLayer": []
-        },
-        "submit": {
-            "ymCounter123123123": "pull-right",
-            "dataLayer": []
-        }
-    }'
->
-  Оформить заказ
-</button>
-```
-
-### Cобытие у элемента формы
-
-```html
-<form
-  class="ordering-page__body"
-  action="/api/order/"
-  method="POST"
-  name="ORDER_FORM"
-  enctype="multipart/form-data"
-  novalidate
-  data-ecom-action="ajax-success"
->
-  ...
-</form>
-```
-
-# Сериализация форм и полей
-
-## Работа с атрибутом `data-no-serialize-before-changes`
-
-### Общее описание
-
-Атрибут `data-no-serialize-before-changes` предназначен для контроля сериализации полей формы в AJAX-запросах. С его
-помощью можно указать, какие поля формы не должны быть сериализованы и отправлены на сервер до того момента, как в них
-произойдут изменения со стороны пользователя.
-
-### Применение
-
-Для использования атрибута достаточно добавить его к любому элементу формы, например, `<input>`, `<select>` или
-`<textarea>`. Пока пользователь не изменит значение такого поля, оно не будет включено в сериализованные данные формы
-при AJAX-запросе.
-
-### Пример
-
-```html
-<input type="text" name="user-email" data-no-serialize-before-changes />
-```
-
-В данном случае, поле для ввода email пользователя не будет сериализовано и отправлено на сервер до тех пор, пока
-пользователь явно не изменит его содержимое.

package/demos/index.html

@@ -1,161 +0,0 @@
-<!doctype html>
-<html lang="ru">
-	<head>
-		<meta charset="UTF-8" />
-		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-		<title>Form Father demos</title>
-		<link rel="stylesheet" href="./styles.css" />
-	</head>
-	<body>
-		<header class="demo-header">
-			<div>
-				<p class="eyebrow">Form Father</p>
-				<h1>Демо форм, валидации и ответов сервера</h1>
-			</div>
-			<a class="github-link" href="https://github.com/Poliklot/form-father">GitHub</a>
-		</header>
-
-		<main class="demo-grid">
-			<section class="demo-panel">
-				<div class="panel-title">
-					<p class="eyebrow">Login</p>
-					<h2>Live validation</h2>
-				</div>
-				<form data-form-father action="/demo/login" method="post" enctype="application/json" data-demo="login" novalidate>
-					<div data-form-father-summary hidden></div>
-
-					<label class="field">
-						<span>Email</span>
-						<input
-							class="input"
-							name="email"
-							type="email"
-							autocomplete="email"
-							data-validate="required|email|available-email"
-							data-error-required="Email обязателен"
-							data-error-email="Введите корректный email"
-							data-error-available-email="Этот email уже занят"
-							data-error-container="#login-email-error"
-						/>
-						<small id="login-email-error" class="field-error" hidden></small>
-					</label>
-
-					<label class="field">
-						<span>Password</span>
-						<input
-							class="input"
-							name="password"
-							type="password"
-							autocomplete="current-password"
-							data-validate="required|min-length:6"
-							data-error-required="Пароль обязателен"
-							data-error-min-length="Минимум 6 символов"
-						/>
-					</label>
-
-					<label class="field">
-						<span>Repeat password</span>
-						<input
-							class="input"
-							name="passwordConfirm"
-							type="password"
-							autocomplete="current-password"
-							data-validate="required"
-							data-error-required="Повторите пароль"
-						/>
-					</label>
-
-					<button type="submit">Войти</button>
-				</form>
-			</section>
-
-			<section class="demo-panel">
-				<div class="panel-title">
-					<p class="eyebrow">Callback</p>
-					<h2>Server field errors</h2>
-				</div>
-				<form data-form-father action="/demo/callback" method="post" data-demo="callback" novalidate>
-					<div data-form-father-summary hidden></div>
-
-					<label class="field">
-						<span>Имя</span>
-						<input class="input" name="name" data-validate="required" data-error-required="Укажите имя" />
-					</label>
-
-					<label class="field">
-						<span>Телефон</span>
-						<input
-							class="input"
-							name="tel"
-							type="tel"
-							placeholder="+79991234567"
-							data-validate="required|tel"
-							data-error-tel="Телефон в формате +7XXXXXXXXXX"
-						/>
-					</label>
-
-					<button type="submit">Заказать звонок</button>
-				</form>
-			</section>
-
-			<section class="demo-panel">
-				<div class="panel-title">
-					<p class="eyebrow">Search</p>
-					<h2>GET query</h2>
-				</div>
-				<form data-form-father action="/demo/search?source=demos" method="get" data-demo="search" novalidate>
-					<div data-form-father-summary hidden></div>
-
-					<label class="field">
-						<span>Запрос</span>
-						<input class="input" name="q" value="form father" data-validate="required" />
-					</label>
-
-					<label class="field">
-						<span>Раздел</span>
-						<select class="input" name="section">
-							<option value="docs">Docs</option>
-							<option value="api">API</option>
-							<option value="examples">Examples</option>
-						</select>
-					</label>
-
-					<button type="submit">Найти</button>
-				</form>
-			</section>
-
-			<section class="demo-panel">
-				<div class="panel-title">
-					<p class="eyebrow">Multipart</p>
-					<h2>FormData upload</h2>
-				</div>
-				<form data-form-father action="/demo/upload" method="post" enctype="multipart/form-data" data-demo="upload" novalidate>
-					<div data-form-father-summary hidden></div>
-
-					<label class="field">
-						<span>Название</span>
-						<input class="input" name="title" data-validate="required" />
-					</label>
-
-					<label class="field">
-						<span>Файл</span>
-						<input class="input" name="attachment" type="file" />
-					</label>
-
-					<button type="submit">Отправить</button>
-				</form>
-			</section>
-		</main>
-
-		<section class="demo-output">
-			<div class="panel-title">
-				<p class="eyebrow">Output</p>
-				<h2>Последний ответ</h2>
-			</div>
-			<pre id="demo-output">Заполните любую форму.</pre>
-		</section>
-
-		<script src="../dist/FormFather.min.js"></script>
-		<script src="./main.js"></script>
-	</body>
-</html>