npm - @feugene/granularity - Versions diffs - 0.11.0 → 0.13.0 - Mend

@feugene/granularity 0.11.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (527) hide show

package/dist/components/GrForm/chunks/GrForm-CdaFjcyl.js ADDED Viewed

@@ -0,0 +1,234 @@
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-SH0I--GW.js";
+import { t as GR_FORM_KEY } from "../../../chunks/context-Bfrgsluh.js";
+import { computed, createElementBlock, defineComponent, onBeforeUnmount, openBlock, provide, ref, renderSlot, watch, withModifiers } from "vue";
+//#region src/components/GrForm/validation.ts
+var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+function isUrl(value) {
+	return URL.canParse(value);
+}
+/** Пустое значение: `null`/`undefined`/пустая (или пробельная) строка/пустой массив. */
+function isEmpty(value) {
+	if (value == null) return true;
+	if (typeof value === "string") return value.trim() === "";
+	if (Array.isArray(value)) return value.length === 0;
+	return false;
+}
+/** Мера значения для min/max/len: число → само значение, строка/массив → длина. */
+function measure(value) {
+	if (typeof value === "number") return value;
+	if (typeof value === "string") return value.length;
+	if (Array.isArray(value)) return value.length;
+	return Number(value);
+}
+/** Достаёт значение из объекта по dot-path (`address.city`). */
+function getByPath(obj, path) {
+	if (!path.includes(".")) return obj[path];
+	return path.split(".").reduce((acc, key) => {
+		if (acc && typeof acc === "object") return acc[key];
+	}, obj);
+}
+/** Записывает значение в объект по dot-path (создаёт промежуточные объекты). */
+function setByPath(obj, path, value) {
+	const keys = path.split(".");
+	const last = keys.pop();
+	let target = obj;
+	for (const key of keys) {
+		if (!target[key] || typeof target[key] !== "object") target[key] = {};
+		target = target[key];
+	}
+	target[last] = value;
+}
+/** Нормализует правило(а) поля в массив. */
+function toRuleArray(rules) {
+	if (!rules) return [];
+	return Array.isArray(rules) ? rules : [rules];
+}
+function ruleMatchesTrigger(rule, trigger) {
+	if (!trigger) return true;
+	if (!rule.trigger) return true;
+	return (Array.isArray(rule.trigger) ? rule.trigger : [rule.trigger]).includes(trigger);
+}
+/** Правила поля, применимые для данного триггера (undefined = все). */
+function rulesForTrigger(rules, trigger) {
+	return rules.filter((rule) => ruleMatchesTrigger(rule, trigger));
+}
+/** Есть ли среди правил `required` (для маркера обязательности в поле). */
+function rulesRequired(rules) {
+	return rules.some((rule) => rule.required === true);
+}
+/**
+* Прогоняет правила по порядку, возвращает первое сообщение об ошибке или `undefined`.
+* Пустое необязательное значение проходит все проверки (кроме `required`).
+*/
+async function runFieldRules(value, rules, model, resolveMessage) {
+	for (const rule of rules) {
+		const empty = isEmpty(value);
+		if (rule.required && empty) return resolveMessage("required", rule, {});
+		if (empty) continue;
+		if (rule.type === "email" && !EMAIL_RE.test(String(value))) return resolveMessage("email", rule, {});
+		if (rule.type === "url" && !isUrl(String(value))) return resolveMessage("url", rule, {});
+		if (rule.len != null && measure(value) !== rule.len) return resolveMessage("len", rule, { len: rule.len });
+		if (rule.min != null && measure(value) < rule.min) return resolveMessage("min", rule, { min: rule.min });
+		if (rule.max != null && measure(value) > rule.max) return resolveMessage("max", rule, { max: rule.max });
+		if (rule.pattern && !rule.pattern.test(String(value))) return resolveMessage("pattern", rule, {});
+		if (rule.validator) {
+			const result = await rule.validator(value, model);
+			if (result === false) return rule.message ?? resolveMessage("invalid", rule, {});
+			if (typeof result === "string") return result;
+		}
+	}
+}
+//#endregion
+//#region src/components/GrForm/GrForm.vue
+var GrForm_default = /* @__PURE__ */ defineComponent({
+	__name: "GrForm",
+	props: {
+		model: {},
+		rules: { default: void 0 },
+		validateOnBlur: {
+			type: Boolean,
+			default: true
+		},
+		validateOnChange: {
+			type: Boolean,
+			default: false
+		},
+		scrollToError: {
+			type: Boolean,
+			default: true
+		},
+		scrollBehavior: { default: "smooth" }
+	},
+	emits: ["submit", "validate"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { t } = useGranularityTranslations();
+		const errors = ref({});
+		const fieldRegistry = /* @__PURE__ */ new Map();
+		function getRules(name) {
+			return toRuleArray(props.rules?.[name]);
+		}
+		function getValue(name) {
+			return getByPath(props.model, name);
+		}
+		const requiredFields = computed(() => {
+			const set = /* @__PURE__ */ new Set();
+			for (const name of Object.keys(props.rules ?? {})) if (rulesRequired(getRules(name))) set.add(name);
+			return set;
+		});
+		const resolveMessage = (kind, rule, params) => {
+			if (rule.message) return rule.message;
+			return t(`gr.form.${kind}`, {
+				required: "This field is required",
+				min: "Minimum is {min}",
+				max: "Maximum is {max}",
+				len: "Length must be {len}",
+				pattern: "Invalid format",
+				email: "Enter a valid email",
+				url: "Enter a valid URL",
+				invalid: "Invalid value"
+			}[kind], params);
+		};
+		async function validateField(name, trigger) {
+			if (trigger === "blur" && !props.validateOnBlur) return !errors.value[name];
+			const rules = rulesForTrigger(getRules(name), trigger);
+			if (!rules.length) return !errors.value[name];
+			const message = await runFieldRules(getValue(name), rules, props.model, resolveMessage);
+			errors.value = {
+				...errors.value,
+				[name]: message
+			};
+			emit("validate", name, !message, message);
+			return !message;
+		}
+		async function validate() {
+			const names = Object.keys(props.rules ?? {});
+			const valid = (await Promise.all(names.map((name) => validateField(name)))).every(Boolean);
+			if (!valid && props.scrollToError) scrollToFirstError();
+			return valid;
+		}
+		function clearValidate(names) {
+			if (!names) {
+				errors.value = {};
+				return;
+			}
+			const list = Array.isArray(names) ? names : [names];
+			const next = { ...errors.value };
+			for (const name of list) delete next[name];
+			errors.value = next;
+		}
+		function cloneData(value) {
+			return value === void 0 ? value : JSON.parse(JSON.stringify(value));
+		}
+		const initialSnapshot = ref(cloneData(props.model));
+		function resetFields() {
+			const snapshot = initialSnapshot.value;
+			for (const key of Object.keys(props.model)) setByPath(props.model, key, cloneData(snapshot[key]));
+			clearValidate();
+		}
+		function scrollToField(name) {
+			const el = fieldRegistry.get(name)?.();
+			if (!el) return;
+			el.scrollIntoView({
+				behavior: props.scrollBehavior,
+				block: "center"
+			});
+			el.querySelector("input, select, textarea, button, [tabindex]:not([tabindex=\"-1\"])")?.focus?.();
+		}
+		function scrollToFirstError() {
+			const elements = [...fieldRegistry.entries()].filter(([name]) => errors.value[name]).map(([, getEl]) => getEl()).filter((el) => Boolean(el));
+			elements.sort((a, b) => a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1);
+			const first = elements[0];
+			if (!first) return;
+			first.scrollIntoView({
+				behavior: props.scrollBehavior,
+				block: "center"
+			});
+			first.querySelector("input, select, textarea, button, [tabindex]:not([tabindex=\"-1\"])")?.focus?.();
+		}
+		let stopWatchers = [];
+		watch(() => Object.keys(props.rules ?? {}), (names) => {
+			stopWatchers.forEach((stop) => stop());
+			stopWatchers = names.map((name) => watch(() => getValue(name), () => {
+				if (props.validateOnChange) validateField(name, "change");
+				else if (errors.value[name]) validateField(name);
+			}, { deep: true }));
+		}, { immediate: true });
+		onBeforeUnmount(() => stopWatchers.forEach((stop) => stop()));
+		provide(GR_FORM_KEY, {
+			errors,
+			requiredFields,
+			hasField: (name) => getRules(name).length > 0,
+			registerField: (name, getEl) => {
+				fieldRegistry.set(name, getEl);
+				return () => fieldRegistry.delete(name);
+			},
+			validateField
+		});
+		function onSubmit() {
+			validate().then((valid) => {
+				if (valid) emit("submit", props.model);
+			});
+		}
+		__expose({
+			validate,
+			validateField,
+			clearValidate,
+			resetFields,
+			scrollToField
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("form", {
+				"data-gr-form": "",
+				novalidate: "",
+				onSubmit: withModifiers(onSubmit, ["prevent"])
+			}, [renderSlot(_ctx.$slots, "default", {
+				validate,
+				errors: errors.value
+			})], 32);
+		};
+	}
+});
+//#endregion
+export { runFieldRules as i, getByPath as n, isEmpty as r, GrForm_default as t };

package/dist/components/GrForm/chunks/GrForm-CdaFjcyl.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"GrForm-CdaFjcyl.js","names":[],"sources":["../../../../src/components/GrForm/validation.ts","../../../../src/components/GrForm/GrForm.vue","../../../../src/components/GrForm/GrForm.vue"],"sourcesContent":["/**\n * Движок валидации `GrForm` — чистый (без Vue/i18n), тестируется изолированно.\n *\n * Правило описывает набор проверок значения поля; `runFieldRules` прогоняет их по\n * порядку и возвращает первое сообщение об ошибке (или `undefined`, если валидно).\n * Сообщения резолвит потребитель (компонент) через `resolveMessage` — так i18n и\n * дефолтные тексты остаются в компоненте, а движок ничего о них не знает.\n */\n\nexport type GrFormTrigger = 'blur' | 'change' | 'submit'\n\n/** Результат кастомного валидатора: `true`/void — ок; `false` — ошибка (дефолт-текст); строка — текст ошибки. */\nexport type GrFormValidatorResult = boolean | string | void\n\nexport interface GrFormRule {\n /** Значение обязательно (не пустое). */\n required?: boolean\n /** Готовый текст ошибки — перекрывает дефолтное сообщение любой проверки этого правила. */\n message?: string\n /** Минимум: длина для строки/массива, значение для числа. */\n min?: number\n /** Максимум: длина для строки/массива, значение для числа. */\n max?: number\n /** Точная длина/значение. */\n len?: number\n /** Регулярное выражение (проверяется по `String(value)`). */\n pattern?: RegExp\n /** Встроенный тип-валидатор. */\n type?: 'email' | 'url'\n /** Кастомный (в т.ч. async) валидатор. Второй аргумент — весь `model`. */\n validator?: (value: unknown, model: Record<string, unknown>) => GrFormValidatorResult | Promise<GrFormValidatorResult>\n /** Когда правило срабатывает. По умолчанию — на любом триггере (blur/change/submit). */\n trigger?: GrFormTrigger | GrFormTrigger[]\n}\n\nexport type GrFormRules = Record<string, GrFormRule | GrFormRule[]>\n\n/** Вид сработавшей проверки — ключ для дефолтного i18n-сообщения. */\nexport type GrFormRuleFailure = 'required' | 'min' | 'max' | 'len' | 'pattern' | 'email' | 'url' | 'invalid'\n\nexport type GrFormMessageResolver = (\n kind: GrFormRuleFailure,\n rule: GrFormRule,\n params: Record<string, unknown>,\n) => string\n\nconst EMAIL_RE = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/\n\nfunction isUrl(value: string): boolean {\n return URL.canParse(value)\n}\n\n/** Пустое значение: `null`/`undefined`/пустая (или пробельная) строка/пустой массив. */\nexport function isEmpty(value: unknown): boolean {\n if (value == null) return true\n if (typeof value === 'string') return value.trim() === ''\n if (Array.isArray(value)) return value.length === 0\n return false\n}\n\n/** Мера значения для min/max/len: число → само значение, строка/массив → длина. */\nfunction measure(value: unknown): number {\n if (typeof value === 'number') return value\n if (typeof value === 'string') return value.length\n if (Array.isArray(value)) return value.length\n return Number(value)\n}\n\n/** Достаёт значение из объекта по dot-path (`address.city`). */\nexport function getByPath(obj: Record<string, unknown>, path: string): unknown {\n if (!path.includes('.')) return obj[path]\n return path.split('.').reduce<unknown>((acc, key) => {\n if (acc && typeof acc === 'object') return (acc as Record<string, unknown>)[key]\n return undefined\n }, obj)\n}\n\n/** Записывает значение в объект по dot-path (создаёт промежуточные объекты). */\nexport function setByPath(obj: Record<string, unknown>, path: string, value: unknown): void {\n const keys = path.split('.')\n const last = keys.pop() as string\n let target = obj\n for (const key of keys) {\n if (!target[key] || typeof target[key] !== 'object') target[key] = {}\n target = target[key] as Record<string, unknown>\n }\n target[last] = value\n}\n\n/** Нормализует правило(а) поля в массив. */\nexport function toRuleArray(rules: GrFormRule | GrFormRule[] | undefined): GrFormRule[] {\n if (!rules) return []\n return Array.isArray(rules) ? rules : [rules]\n}\n\nfunction ruleMatchesTrigger(rule: GrFormRule, trigger?: GrFormTrigger): boolean {\n if (!trigger) return true // полная валидация (validate()) — все правила\n if (!rule.trigger) return true // правило без триггера срабатывает на любом\n const triggers = Array.isArray(rule.trigger) ? rule.trigger : [rule.trigger]\n return triggers.includes(trigger)\n}\n\n/** Правила поля, применимые для данного триггера (undefined = все). */\nexport function rulesForTrigger(rules: GrFormRule[], trigger?: GrFormTrigger): GrFormRule[] {\n return rules.filter(rule => ruleMatchesTrigger(rule, trigger))\n}\n\n/** Есть ли среди правил `required` (для маркера обязательности в поле). */\nexport function rulesRequired(rules: GrFormRule[]): boolean {\n return rules.some(rule => rule.required === true)\n}\n\n/**\n * Прогоняет правила по порядку, возвращает первое сообщение об ошибке или `undefined`.\n * Пустое необязательное значение проходит все проверки (кроме `required`).\n */\nexport async function runFieldRules(\n value: unknown,\n rules: GrFormRule[],\n model: Record<string, unknown>,\n resolveMessage: GrFormMessageResolver,\n): Promise<string | undefined> {\n for (const rule of rules) {\n const empty = isEmpty(value)\n\n if (rule.required && empty) return resolveMessage('required', rule, {})\n // Необязательное пустое значение — остальные проверки этого правила пропускаем.\n if (empty) continue\n\n if (rule.type === 'email' && !EMAIL_RE.test(String(value))) return resolveMessage('email', rule, {})\n if (rule.type === 'url' && !isUrl(String(value))) return resolveMessage('url', rule, {})\n\n if (rule.len != null && measure(value) !== rule.len) return resolveMessage('len', rule, { len: rule.len })\n if (rule.min != null && measure(value) < rule.min) return resolveMessage('min', rule, { min: rule.min })\n if (rule.max != null && measure(value) > rule.max) return resolveMessage('max', rule, { max: rule.max })\n\n if (rule.pattern && !rule.pattern.test(String(value))) return resolveMessage('pattern', rule, {})\n\n if (rule.validator) {\n const result = await rule.validator(value, model)\n if (result === false) return rule.message ?? resolveMessage('invalid', rule, {})\n if (typeof result === 'string') return result\n }\n }\n\n return undefined\n}\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, provide, ref, watch } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { GR_FORM_KEY } from './context'\nimport {\n getByPath,\n rulesForTrigger,\n rulesRequired,\n runFieldRules,\n setByPath,\n toRuleArray,\n type GrFormMessageResolver,\n type GrFormRule,\n type GrFormRules,\n type GrFormTrigger,\n} from './validation'\n\nexport type {\n GrFormRule,\n GrFormRules,\n GrFormTrigger,\n GrFormValidatorResult,\n} from './validation'\n\n/**\n * Публичный GR-примитив «Form» — оркестрация валидации над `GrFormField`.\n *\n * Модель формы (`v-model`-объект приложения) + декларативные `rules` по имени поля.\n * Форма прогоняет правила, раскладывает ошибки по контексту, скроллит к первой\n * ошибке и эмитит `submit` только при валидной форме. Императивный API — через\n * template ref (`validate` / `validateField` / `clearValidate` / `resetFields` /\n * `scrollToField`).\n */\nexport interface GrFormProps {\n /** Реактивный объект данных формы. Поля адресуются по `name` (`GrFormField`), в т.ч. dot-path. */\n model: Record<string, unknown>\n /** Правила валидации по имени поля: `{ email: [{ required: true, type: 'email' }] }`. */\n rules?: GrFormRules\n /** Валидировать поле при потере фокуса. */\n validateOnBlur?: boolean\n /** Валидировать поле при каждом изменении значения. */\n validateOnChange?: boolean\n /** Скроллить к первому невалидному полю после `validate()`. */\n scrollToError?: boolean\n scrollBehavior?: ScrollBehavior\n}\n\nconst props = withDefaults(\n defineProps<GrFormProps>(),\n {\n rules: undefined,\n validateOnBlur: true,\n validateOnChange: false,\n scrollToError: true,\n scrollBehavior: 'smooth',\n },\n)\n\nconst emit = defineEmits<{\n /** Форма прошла валидацию по submit. Отдаёт `model`. */\n (e: 'submit', model: Record<string, unknown>): void\n /** Результат валидации одного поля. */\n (e: 'validate', name: string, valid: boolean, message: string | undefined): void\n}>()\n\nconst { t } = useGranularityTranslations()\n\n// ————— Ошибки и реестр полей.\nconst errors = ref<Record<string, string | undefined>>({})\nconst fieldRegistry = new Map<string, () => HTMLElement | null>()\n\nfunction getRules(name: string): GrFormRule[] {\n return toRuleArray(props.rules?.[name])\n}\n\nfunction getValue(name: string): unknown {\n return getByPath(props.model, name)\n}\n\nconst requiredFields = computed(() => {\n const set = new Set<string>()\n for (const name of Object.keys(props.rules ?? {})) {\n if (rulesRequired(getRules(name))) set.add(name)\n }\n return set\n})\n\n// Дефолтные i18n-сообщения (перекрываются `rule.message`).\nconst resolveMessage: GrFormMessageResolver = (kind, rule, params) => {\n if (rule.message) return rule.message\n const fallback: Record<string, string> = {\n required: 'This field is required',\n min: 'Minimum is {min}',\n max: 'Maximum is {max}',\n len: 'Length must be {len}',\n pattern: 'Invalid format',\n email: 'Enter a valid email',\n url: 'Enter a valid URL',\n invalid: 'Invalid value',\n }\n return t(`gr.form.${kind}`, fallback[kind], params)\n}\n\n// ————— Валидация.\nasync function validateField(name: string, trigger?: GrFormTrigger): Promise<boolean> {\n if (trigger === 'blur' && !props.validateOnBlur) return !errors.value[name]\n\n const rules = rulesForTrigger(getRules(name), trigger)\n if (!rules.length) return !errors.value[name]\n\n const message = await runFieldRules(getValue(name), rules, props.model, resolveMessage)\n errors.value = { ...errors.value, [name]: message }\n emit('validate', name, !message, message)\n return !message\n}\n\nasync function validate(): Promise<boolean> {\n const names = Object.keys(props.rules ?? {})\n const results = await Promise.all(names.map(name => validateField(name)))\n const valid = results.every(Boolean)\n if (!valid && props.scrollToError) scrollToFirstError()\n return valid\n}\n\nfunction clearValidate(names?: string | string[]): void {\n if (!names) {\n errors.value = {}\n return\n }\n const list = Array.isArray(names) ? names : [names]\n const next = { ...errors.value }\n for (const name of list) delete next[name]\n errors.value = next\n}\n\n// Снимок начальных значений для `resetFields`. JSON-клон читает «сквозь» reactive-\n// прокси и даёт простой снимок (модель формы — JSON-данные); `structuredClone` на\n// прокси падает с DataCloneError.\nfunction cloneData<T>(value: T): T {\n return value === undefined ? value : (JSON.parse(JSON.stringify(value)) as T)\n}\n\nconst initialSnapshot = ref<Record<string, unknown>>(cloneData(props.model))\n\nfunction resetFields(): void {\n const snapshot = initialSnapshot.value\n for (const key of Object.keys(props.model)) {\n setByPath(props.model, key, cloneData(snapshot[key]))\n }\n clearValidate()\n}\n\n// ————— Scroll-to-error.\nfunction scrollToField(name: string): void {\n const el = fieldRegistry.get(name)?.()\n if (!el) return\n el.scrollIntoView({ behavior: props.scrollBehavior, block: 'center' })\n const focusable = el.querySelector<HTMLElement>('input, select, textarea, button, [tabindex]:not([tabindex=\"-1\"])')\n focusable?.focus?.()\n}\n\nfunction scrollToFirstError(): void {\n const elements = [...fieldRegistry.entries()]\n .filter(([name]) => errors.value[name])\n .map(([, getEl]) => getEl())\n .filter((el): el is HTMLElement => Boolean(el))\n\n // Первое по порядку в DOM — «самое верхнее» невалидное поле на экране.\n elements.sort((a, b) =>\n (a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING) ? -1 : 1,\n )\n\n const first = elements[0]\n if (!first) return\n first.scrollIntoView({ behavior: props.scrollBehavior, block: 'center' })\n first.querySelector<HTMLElement>('input, select, textarea, button, [tabindex]:not([tabindex=\"-1\"])')?.focus?.()\n}\n\n// ————— «Умный» change: чистим ошибку по мере исправления; валидируем при validateOnChange.\nlet stopWatchers: Array<() => void> = []\nwatch(\n () => Object.keys(props.rules ?? {}),\n (names) => {\n stopWatchers.forEach(stop => stop())\n stopWatchers = names.map(name =>\n watch(\n () => getValue(name),\n () => {\n if (props.validateOnChange) void validateField(name, 'change')\n else if (errors.value[name]) void validateField(name) // ре-валидация, чтобы снять ошибку\n },\n { deep: true },\n ),\n )\n },\n { immediate: true },\n)\n\nonBeforeUnmount(() => stopWatchers.forEach(stop => stop()))\n\n// ————— Контекст для `GrFormField`.\nprovide(GR_FORM_KEY, {\n errors,\n requiredFields,\n hasField: (name: string) => getRules(name).length > 0,\n registerField: (name, getEl) => {\n fieldRegistry.set(name, getEl)\n return () => fieldRegistry.delete(name)\n },\n validateField,\n})\n\nfunction onSubmit(): void {\n void validate().then((valid) => {\n if (valid) emit('submit', props.model)\n })\n}\n\ndefineExpose({\n validate,\n validateField,\n clearValidate,\n resetFields,\n scrollToField,\n})\n</script>\n\n<template>\n <form data-gr-form novalidate @submit.prevent=\"onSubmit\">\n <slot :validate=\"validate\" :errors=\"errors\" />\n </form>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, provide, ref, watch } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { GR_FORM_KEY } from './context'\nimport {\n getByPath,\n rulesForTrigger,\n rulesRequired,\n runFieldRules,\n setByPath,\n toRuleArray,\n type GrFormMessageResolver,\n type GrFormRule,\n type GrFormRules,\n type GrFormTrigger,\n} from './validation'\n\nexport type {\n GrFormRule,\n GrFormRules,\n GrFormTrigger,\n GrFormValidatorResult,\n} from './validation'\n\n/**\n * Публичный GR-примитив «Form» — оркестрация валидации над `GrFormField`.\n *\n * Модель формы (`v-model`-объект приложения) + декларативные `rules` по имени поля.\n * Форма прогоняет правила, раскладывает ошибки по контексту, скроллит к первой\n * ошибке и эмитит `submit` только при валидной форме. Императивный API — через\n * template ref (`validate` / `validateField` / `clearValidate` / `resetFields` /\n * `scrollToField`).\n */\nexport interface GrFormProps {\n /** Реактивный объект данных формы. Поля адресуются по `name` (`GrFormField`), в т.ч. dot-path. */\n model: Record<string, unknown>\n /** Правила валидации по имени поля: `{ email: [{ required: true, type: 'email' }] }`. */\n rules?: GrFormRules\n /** Валидировать поле при потере фокуса. */\n validateOnBlur?: boolean\n /** Валидировать поле при каждом изменении значения. */\n validateOnChange?: boolean\n /** Скроллить к первому невалидному полю после `validate()`. */\n scrollToError?: boolean\n scrollBehavior?: ScrollBehavior\n}\n\nconst props = withDefaults(\n defineProps<GrFormProps>(),\n {\n rules: undefined,\n validateOnBlur: true,\n validateOnChange: false,\n scrollToError: true,\n scrollBehavior: 'smooth',\n },\n)\n\nconst emit = defineEmits<{\n /** Форма прошла валидацию по submit. Отдаёт `model`. */\n (e: 'submit', model: Record<string, unknown>): void\n /** Результат валидации одного поля. */\n (e: 'validate', name: string, valid: boolean, message: string | undefined): void\n}>()\n\nconst { t } = useGranularityTranslations()\n\n// ————— Ошибки и реестр полей.\nconst errors = ref<Record<string, string | undefined>>({})\nconst fieldRegistry = new Map<string, () => HTMLElement | null>()\n\nfunction getRules(name: string): GrFormRule[] {\n return toRuleArray(props.rules?.[name])\n}\n\nfunction getValue(name: string): unknown {\n return getByPath(props.model, name)\n}\n\nconst requiredFields = computed(() => {\n const set = new Set<string>()\n for (const name of Object.keys(props.rules ?? {})) {\n if (rulesRequired(getRules(name))) set.add(name)\n }\n return set\n})\n\n// Дефолтные i18n-сообщения (перекрываются `rule.message`).\nconst resolveMessage: GrFormMessageResolver = (kind, rule, params) => {\n if (rule.message) return rule.message\n const fallback: Record<string, string> = {\n required: 'This field is required',\n min: 'Minimum is {min}',\n max: 'Maximum is {max}',\n len: 'Length must be {len}',\n pattern: 'Invalid format',\n email: 'Enter a valid email',\n url: 'Enter a valid URL',\n invalid: 'Invalid value',\n }\n return t(`gr.form.${kind}`, fallback[kind], params)\n}\n\n// ————— Валидация.\nasync function validateField(name: string, trigger?: GrFormTrigger): Promise<boolean> {\n if (trigger === 'blur' && !props.validateOnBlur) return !errors.value[name]\n\n const rules = rulesForTrigger(getRules(name), trigger)\n if (!rules.length) return !errors.value[name]\n\n const message = await runFieldRules(getValue(name), rules, props.model, resolveMessage)\n errors.value = { ...errors.value, [name]: message }\n emit('validate', name, !message, message)\n return !message\n}\n\nasync function validate(): Promise<boolean> {\n const names = Object.keys(props.rules ?? {})\n const results = await Promise.all(names.map(name => validateField(name)))\n const valid = results.every(Boolean)\n if (!valid && props.scrollToError) scrollToFirstError()\n return valid\n}\n\nfunction clearValidate(names?: string | string[]): void {\n if (!names) {\n errors.value = {}\n return\n }\n const list = Array.isArray(names) ? names : [names]\n const next = { ...errors.value }\n for (const name of list) delete next[name]\n errors.value = next\n}\n\n// Снимок начальных значений для `resetFields`. JSON-клон читает «сквозь» reactive-\n// прокси и даёт простой снимок (модель формы — JSON-данные); `structuredClone` на\n// прокси падает с DataCloneError.\nfunction cloneData<T>(value: T): T {\n return value === undefined ? value : (JSON.parse(JSON.stringify(value)) as T)\n}\n\nconst initialSnapshot = ref<Record<string, unknown>>(cloneData(props.model))\n\nfunction resetFields(): void {\n const snapshot = initialSnapshot.value\n for (const key of Object.keys(props.model)) {\n setByPath(props.model, key, cloneData(snapshot[key]))\n }\n clearValidate()\n}\n\n// ————— Scroll-to-error.\nfunction scrollToField(name: string): void {\n const el = fieldRegistry.get(name)?.()\n if (!el) return\n el.scrollIntoView({ behavior: props.scrollBehavior, block: 'center' })\n const focusable = el.querySelector<HTMLElement>('input, select, textarea, button, [tabindex]:not([tabindex=\"-1\"])')\n focusable?.focus?.()\n}\n\nfunction scrollToFirstError(): void {\n const elements = [...fieldRegistry.entries()]\n .filter(([name]) => errors.value[name])\n .map(([, getEl]) => getEl())\n .filter((el): el is HTMLElement => Boolean(el))\n\n // Первое по порядку в DOM — «самое верхнее» невалидное поле на экране.\n elements.sort((a, b) =>\n (a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING) ? -1 : 1,\n )\n\n const first = elements[0]\n if (!first) return\n first.scrollIntoView({ behavior: props.scrollBehavior, block: 'center' })\n first.querySelector<HTMLElement>('input, select, textarea, button, [tabindex]:not([tabindex=\"-1\"])')?.focus?.()\n}\n\n// ————— «Умный» change: чистим ошибку по мере исправления; валидируем при validateOnChange.\nlet stopWatchers: Array<() => void> = []\nwatch(\n () => Object.keys(props.rules ?? {}),\n (names) => {\n stopWatchers.forEach(stop => stop())\n stopWatchers = names.map(name =>\n watch(\n () => getValue(name),\n () => {\n if (props.validateOnChange) void validateField(name, 'change')\n else if (errors.value[name]) void validateField(name) // ре-валидация, чтобы снять ошибку\n },\n { deep: true },\n ),\n )\n },\n { immediate: true },\n)\n\nonBeforeUnmount(() => stopWatchers.forEach(stop => stop()))\n\n// ————— Контекст для `GrFormField`.\nprovide(GR_FORM_KEY, {\n errors,\n requiredFields,\n hasField: (name: string) => getRules(name).length > 0,\n registerField: (name, getEl) => {\n fieldRegistry.set(name, getEl)\n return () => fieldRegistry.delete(name)\n },\n validateField,\n})\n\nfunction onSubmit(): void {\n void validate().then((valid) => {\n if (valid) emit('submit', props.model)\n })\n}\n\ndefineExpose({\n validate,\n validateField,\n clearValidate,\n resetFields,\n scrollToField,\n})\n</script>\n\n<template>\n <form data-gr-form novalidate @submit.prevent=\"onSubmit\">\n <slot :validate=\"validate\" :errors=\"errors\" />\n </form>\n</template>\n"],"mappings":"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"}

package/dist/components/GrForm/index.js ADDED Viewed

@@ -0,0 +1,4 @@
+import { n as useGrFormContext, t as GR_FORM_KEY } from "../../chunks/context-Bfrgsluh.js";
+import { i as runFieldRules, n as getByPath, r as isEmpty, t as GrForm_default } from "./chunks/GrForm-CdaFjcyl.js";
+import { t as grFormConfig } from "../../chunks/config-Droqn55j.js";
+export { GR_FORM_KEY, GrForm_default as GrForm, GrForm_default as default, getByPath, grFormConfig, isEmpty, runFieldRules, useGrFormContext };

package/dist/components/GrFormField/chunks/GrFormField-CXCDBd99.js ADDED Viewed

@@ -0,0 +1,100 @@
+import { t as GR_FORM_FIELD_KEY } from "../../../chunks/context-DdNIxa1w.js";
+import { n as useGrFormContext } from "../../../chunks/context-Bfrgsluh.js";
+import { computed, createCommentVNode, createElementBlock, createTextVNode, defineComponent, normalizeClass, onBeforeUnmount, onMounted, openBlock, provide, ref, renderSlot, toDisplayString, unref, useId, useSlots } from "vue";
+//#region src/components/GrFormField/GrFormField.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["for"];
+var _hoisted_2 = {
+	key: 0,
+	"data-gr-form-field-required": "",
+	"aria-hidden": "true",
+	class: "text-[var(--gr-danger)]"
+};
+var _hoisted_3 = ["id"];
+var _hoisted_4 = ["id"];
+//#endregion
+//#region src/components/GrFormField/GrFormField.vue
+var GrFormField_default = /* @__PURE__ */ defineComponent({
+	__name: "GrFormField",
+	props: {
+		label: { default: void 0 },
+		name: { default: void 0 },
+		forId: { default: void 0 },
+		error: { default: void 0 },
+		hint: { default: void 0 },
+		required: {
+			type: Boolean,
+			default: false
+		},
+		labelClass: { default: void 0 }
+	},
+	setup(__props) {
+		const props = __props;
+		const slots = useSlots();
+		const form = useGrFormContext();
+		const boundToForm = computed(() => Boolean(form && props.name && form.hasField(props.name)));
+		const generatedId = useId();
+		const fieldId = computed(() => props.forId ?? generatedId);
+		const errorId = useId();
+		const hintId = useId();
+		const resolvedError = computed(() => {
+			if (props.error) return props.error;
+			if (boundToForm.value && props.name) return form.errors.value[props.name];
+		});
+		const isRequired = computed(() => {
+			if (props.required) return true;
+			if (boundToForm.value && props.name) return form.requiredFields.value.has(props.name);
+			return false;
+		});
+		const hasHint = computed(() => Boolean(props.hint) || Boolean(slots.hint));
+		const hasError = computed(() => Boolean(resolvedError.value));
+		provide(GR_FORM_FIELD_KEY, {
+			id: fieldId,
+			describedById: computed(() => {
+				const ids = [hasHint.value ? hintId : null, hasError.value ? errorId : null].filter(Boolean);
+				return ids.length ? ids.join(" ") : void 0;
+			}),
+			invalid: hasError,
+			required: isRequired
+		});
+		const fieldRootEl = ref(null);
+		let unregister;
+		onMounted(() => {
+			if (form && props.name) unregister = form.registerField(props.name, () => fieldRootEl.value);
+		});
+		onBeforeUnmount(() => unregister?.());
+		function onFocusOut() {
+			if (form && props.name) form.validateField(props.name, "blur");
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "fieldRootEl",
+				ref: fieldRootEl,
+				"data-gr-form-field": "",
+				class: "flex flex-col gap-2",
+				onFocusout: onFocusOut
+			}, [
+				props.label ? (openBlock(), createElementBlock("label", {
+					key: 0,
+					for: fieldId.value,
+					class: normalizeClass(["text-sm text-[var(--gr-muted-fg)]", props.labelClass])
+				}, [createTextVNode(toDisplayString(props.label) + " ", 1), isRequired.value ? (openBlock(), createElementBlock("span", _hoisted_2, "*")) : createCommentVNode("", true)], 10, _hoisted_1)) : createCommentVNode("", true),
+				hasHint.value ? (openBlock(), createElementBlock("p", {
+					key: 1,
+					id: unref(hintId),
+					"data-gr-form-field-hint": "",
+					class: "text-xs text-[var(--gr-muted-fg)]"
+				}, [renderSlot(_ctx.$slots, "hint", {}, () => [createTextVNode(toDisplayString(props.hint), 1)])], 8, _hoisted_3)) : createCommentVNode("", true),
+				renderSlot(_ctx.$slots, "default"),
+				hasError.value ? (openBlock(), createElementBlock("div", {
+					key: 2,
+					id: unref(errorId),
+					"data-gr-form-field-error": "",
+					role: "alert",
+					class: "text-sm text-[var(--gr-danger)]"
+				}, toDisplayString(resolvedError.value), 9, _hoisted_4)) : createCommentVNode("", true)
+			], 544);
+		};
+	}
+});
+//#endregion
+export { GrFormField_default as t };

package/dist/components/GrFormField/chunks/GrFormField-CXCDBd99.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"GrFormField-CXCDBd99.js","names":[],"sources":["../../../../src/components/GrFormField/GrFormField.vue","../../../../src/components/GrFormField/GrFormField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, provide, ref, useId, useSlots } from 'vue'\n\nimport { useGrFormContext } from '../GrForm/context'\nimport { GR_FORM_FIELD_KEY } from './context'\n\ntype LabelClass = string | string[] | Record<string, boolean>\n\nconst props = withDefaults(\n defineProps<{\n label?: string\n /**\n * Имя поля в модели `GrForm` (в т.ч. dot-path `address.city`). Когда поле внутри\n * `GrForm` и задан `name`, ошибка и признак обязательности берутся из формы по\n * этому имени, а потеря фокуса триггерит валидацию поля.\n */\n name?: string\n /** Явный id контрола. Если не задан — генерируется автоматически. */\n forId?: string\n /** Явная ошибка. Перекрывает ошибку из `GrForm` (ручной режим без формы — тоже здесь). */\n error?: string\n /** Подсказка под лейблом/над контролом (можно также через слот `#hint`). */\n hint?: string\n /** Помечает поле обязательным (маркер `*` + `aria-required` у контрола). */\n required?: boolean\n labelClass?: LabelClass\n }>(),\n {\n label: undefined,\n name: undefined,\n forId: undefined,\n error: undefined,\n hint: undefined,\n required: false,\n labelClass: undefined,\n },\n)\n\nconst slots = useSlots()\n\n// Контекст `GrForm` (если поле внутри формы). Контролы про форму не знают —\n// оркестрация подключается здесь, на уровне поля.\nconst form = useGrFormContext()\nconst boundToForm = computed(() => Boolean(form && props.name && form.hasField(props.name)))\n\n// Автогенерация id: контрол внутри читает его через inject и связывается с\n// лейблом (`for`) без ручного дублирования `forId`.\nconst generatedId = useId()\nconst fieldId = computed(() => props.forId ?? generatedId)\n\nconst errorId = useId()\nconst hintId = useId()\n\n// Ошибка: явный проп `error` имеет приоритет, иначе — из формы по `name`.\nconst resolvedError = computed(() => {\n if (props.error) return props.error\n if (boundToForm.value && props.name) return form!.errors.value[props.name]\n return undefined\n})\n\n// Обязательность: проп `required` ИЛИ наличие `required`-правила в форме.\nconst isRequired = computed(() => {\n if (props.required) return true\n if (boundToForm.value && props.name) return form!.requiredFields.value.has(props.name)\n return false\n})\n\nconst hasHint = computed(() => Boolean(props.hint) || Boolean(slots.hint))\nconst hasError = computed(() => Boolean(resolvedError.value))\n\n// `aria-describedby` контрола: подсказка и/или ошибка.\nconst describedById = computed(() => {\n const ids = [hasHint.value ? hintId : null, hasError.value ? errorId : null].filter(Boolean)\n return ids.length ? ids.join(' ') : undefined\n})\n\nprovide(GR_FORM_FIELD_KEY, {\n id: fieldId,\n describedById,\n invalid: hasError,\n required: isRequired,\n})\n\n// ————— Интеграция с формой: регистрация (scroll-to-error) + валидация по blur.\nconst fieldRootEl = ref<HTMLElement | null>(null)\nlet unregister: (() => void) | undefined\n\nonMounted(() => {\n if (form && props.name) unregister = form.registerField(props.name, () => fieldRootEl.value)\n})\nonBeforeUnmount(() => unregister?.())\n\n// `focusout` всплывает от любого фокусируемого контрола внутри поля (native и\n// кастомного) — единый способ поймать blur без правок самих контролов.\nfunction onFocusOut(): void {\n if (form && props.name) void form.validateField(props.name, 'blur')\n}\n</script>\n\n<template>\n <div\n ref=\"fieldRootEl\"\n data-gr-form-field\n class=\"flex flex-col gap-2\"\n @focusout=\"onFocusOut\"\n >\n <label\n v-if=\"props.label\"\n :for=\"fieldId\"\n class=\"text-sm text-[var(--gr-muted-fg)]\"\n :class=\"props.labelClass\"\n >\n {{ props.label }}\n <span v-if=\"isRequired\" data-gr-form-field-required aria-hidden=\"true\" class=\"text-[var(--gr-danger)]\">*</span>\n </label>\n\n <p\n v-if=\"hasHint\"\n :id=\"hintId\"\n data-gr-form-field-hint\n class=\"text-xs text-[var(--gr-muted-fg)]\"\n >\n <slot name=\"hint\">\n {{ props.hint }}\n </slot>\n </p>\n\n <slot />\n\n <div\n v-if=\"hasError\"\n :id=\"errorId\"\n data-gr-form-field-error\n role=\"alert\"\n class=\"text-sm text-[var(--gr-danger)]\"\n >\n {{ resolvedError }}\n </div>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, provide, ref, useId, useSlots } from 'vue'\n\nimport { useGrFormContext } from '../GrForm/context'\nimport { GR_FORM_FIELD_KEY } from './context'\n\ntype LabelClass = string | string[] | Record<string, boolean>\n\nconst props = withDefaults(\n defineProps<{\n label?: string\n /**\n * Имя поля в модели `GrForm` (в т.ч. dot-path `address.city`). Когда поле внутри\n * `GrForm` и задан `name`, ошибка и признак обязательности берутся из формы по\n * этому имени, а потеря фокуса триггерит валидацию поля.\n */\n name?: string\n /** Явный id контрола. Если не задан — генерируется автоматически. */\n forId?: string\n /** Явная ошибка. Перекрывает ошибку из `GrForm` (ручной режим без формы — тоже здесь). */\n error?: string\n /** Подсказка под лейблом/над контролом (можно также через слот `#hint`). */\n hint?: string\n /** Помечает поле обязательным (маркер `*` + `aria-required` у контрола). */\n required?: boolean\n labelClass?: LabelClass\n }>(),\n {\n label: undefined,\n name: undefined,\n forId: undefined,\n error: undefined,\n hint: undefined,\n required: false,\n labelClass: undefined,\n },\n)\n\nconst slots = useSlots()\n\n// Контекст `GrForm` (если поле внутри формы). Контролы про форму не знают —\n// оркестрация подключается здесь, на уровне поля.\nconst form = useGrFormContext()\nconst boundToForm = computed(() => Boolean(form && props.name && form.hasField(props.name)))\n\n// Автогенерация id: контрол внутри читает его через inject и связывается с\n// лейблом (`for`) без ручного дублирования `forId`.\nconst generatedId = useId()\nconst fieldId = computed(() => props.forId ?? generatedId)\n\nconst errorId = useId()\nconst hintId = useId()\n\n// Ошибка: явный проп `error` имеет приоритет, иначе — из формы по `name`.\nconst resolvedError = computed(() => {\n if (props.error) return props.error\n if (boundToForm.value && props.name) return form!.errors.value[props.name]\n return undefined\n})\n\n// Обязательность: проп `required` ИЛИ наличие `required`-правила в форме.\nconst isRequired = computed(() => {\n if (props.required) return true\n if (boundToForm.value && props.name) return form!.requiredFields.value.has(props.name)\n return false\n})\n\nconst hasHint = computed(() => Boolean(props.hint) || Boolean(slots.hint))\nconst hasError = computed(() => Boolean(resolvedError.value))\n\n// `aria-describedby` контрола: подсказка и/или ошибка.\nconst describedById = computed(() => {\n const ids = [hasHint.value ? hintId : null, hasError.value ? errorId : null].filter(Boolean)\n return ids.length ? ids.join(' ') : undefined\n})\n\nprovide(GR_FORM_FIELD_KEY, {\n id: fieldId,\n describedById,\n invalid: hasError,\n required: isRequired,\n})\n\n// ————— Интеграция с формой: регистрация (scroll-to-error) + валидация по blur.\nconst fieldRootEl = ref<HTMLElement | null>(null)\nlet unregister: (() => void) | undefined\n\nonMounted(() => {\n if (form && props.name) unregister = form.registerField(props.name, () => fieldRootEl.value)\n})\nonBeforeUnmount(() => unregister?.())\n\n// `focusout` всплывает от любого фокусируемого контрола внутри поля (native и\n// кастомного) — единый способ поймать blur без правок самих контролов.\nfunction onFocusOut(): void {\n if (form && props.name) void form.validateField(props.name, 'blur')\n}\n</script>\n\n<template>\n <div\n ref=\"fieldRootEl\"\n data-gr-form-field\n class=\"flex flex-col gap-2\"\n @focusout=\"onFocusOut\"\n >\n <label\n v-if=\"props.label\"\n :for=\"fieldId\"\n class=\"text-sm text-[var(--gr-muted-fg)]\"\n :class=\"props.labelClass\"\n >\n {{ props.label }}\n <span v-if=\"isRequired\" data-gr-form-field-required aria-hidden=\"true\" class=\"text-[var(--gr-danger)]\">*</span>\n </label>\n\n <p\n v-if=\"hasHint\"\n :id=\"hintId\"\n data-gr-form-field-hint\n class=\"text-xs text-[var(--gr-muted-fg)]\"\n >\n <slot name=\"hint\">\n {{ props.hint }}\n </slot>\n </p>\n\n <slot />\n\n <div\n v-if=\"hasError\"\n :id=\"errorId\"\n data-gr-form-field-error\n role=\"alert\"\n class=\"text-sm text-[var(--gr-danger)]\"\n >\n {{ resolvedError }}\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EA8Bd,MAAM,QAAQ,SAAS;EAIvB,MAAM,OAAO,iBAAiB;EAC9B,MAAM,cAAc,eAAe,QAAQ,QAAQ,MAAM,QAAQ,KAAK,SAAS,MAAM,IAAI,CAAC,CAAC;EAI3F,MAAM,cAAc,MAAM;EAC1B,MAAM,UAAU,eAAe,MAAM,SAAS,WAAW;EAEzD,MAAM,UAAU,MAAM;EACtB,MAAM,SAAS,MAAM;EAGrB,MAAM,gBAAgB,eAAe;GACnC,IAAI,MAAM,OAAO,OAAO,MAAM;GAC9B,IAAI,YAAY,SAAS,MAAM,MAAM,OAAO,KAAM,OAAO,MAAM,MAAM;EAEvE,CAAC;EAGD,MAAM,aAAa,eAAe;GAChC,IAAI,MAAM,UAAU,OAAO;GAC3B,IAAI,YAAY,SAAS,MAAM,MAAM,OAAO,KAAM,eAAe,MAAM,IAAI,MAAM,IAAI;GACrF,OAAO;EACT,CAAC;EAED,MAAM,UAAU,eAAe,QAAQ,MAAM,IAAI,KAAK,QAAQ,MAAM,IAAI,CAAC;EACzE,MAAM,WAAW,eAAe,QAAQ,cAAc,KAAK,CAAC;EAQ5D,QAAQ,mBAAmB;GACzB,IAAI;GACJ,eAPoB,eAAe;IACnC,MAAM,MAAM,CAAC,QAAQ,QAAQ,SAAS,MAAM,SAAS,QAAQ,UAAU,IAAI,CAAC,CAAC,OAAO,OAAO;IAC3F,OAAO,IAAI,SAAS,IAAI,KAAK,GAAG,IAAI,KAAA;GACtC,CAIE;GACA,SAAS;GACT,UAAU;EACZ,CAAC;EAGD,MAAM,cAAc,IAAwB,IAAI;EAChD,IAAI;EAEJ,gBAAgB;GACd,IAAI,QAAQ,MAAM,MAAM,aAAa,KAAK,cAAc,MAAM,YAAY,YAAY,KAAK;EAC7F,CAAC;EACD,sBAAsB,aAAa,CAAC;EAIpC,SAAS,aAAmB;GAC1B,IAAI,QAAQ,MAAM,MAAM,KAAU,cAAc,MAAM,MAAM,MAAM;EACpE;;uBAIE,mBAsCM,OAAA;aArCA;IAAJ,KAAI;IACJ,sBAAA;IACA,OAAM;IACL,YAAU;;IAGH,MAAM,SAAA,UAAA,GADd,mBAQQ,SAAA;;KANL,KAAK,QAAA;KACN,OAAK,eAAA,CAAC,qCACE,MAAM,UAAU,CAAA;wCAErB,MAAM,KAAK,IAAG,KACjB,CAAA,GAAY,WAAA,SAAA,UAAA,GAAZ,mBAA+G,QAA/G,YAAuG,GAAC,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,IAAA,UAAA,KAAA,mBAAA,IAAA,IAAA;IAIlG,QAAA,SAAA,UAAA,GADR,mBASI,KAAA;;KAPD,IAAI,MAAA,MAAA;KACL,2BAAA;KACA,OAAM;QAEN,WAEO,KAAA,QAAA,QAAA,CAAA,SAAA,CAAA,gBAAA,gBADF,MAAM,IAAI,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,GAAA,UAAA,KAAA,mBAAA,IAAA,IAAA;IAIjB,WAAQ,KAAA,QAAA,SAAA;IAGA,SAAA,SAAA,UAAA,GADR,mBAQM,OAAA;;KANH,IAAI,MAAA,OAAA;KACL,4BAAA;KACA,MAAK;KACL,OAAM;uBAEH,cAAA,KAAa,GAAA,GAAA,UAAA,KAAA,mBAAA,IAAA,IAAA"}

package/dist/components/GrFormField/index.js CHANGED Viewed

@@ -1,3 +1,4 @@
-import { t as GrFormField_default } from "./chunks/GrFormField-BujNQrw8.js";
+import { n as useGrFormFieldContext, t as GR_FORM_FIELD_KEY } from "../../chunks/context-DdNIxa1w.js";
+import { t as GrFormField_default } from "./chunks/GrFormField-CXCDBd99.js";
 import { t as grFormFieldConfig } from "../../chunks/config-PFg39mYo.js";
-export { GrFormField_default as GrFormField, GrFormField_default as default, grFormFieldConfig };
+export { GR_FORM_FIELD_KEY, GrFormField_default as GrFormField, GrFormField_default as default, grFormFieldConfig, useGrFormFieldContext };

package/dist/components/GrFormFile/chunks/{GrFormFile-CXcqqdvV.js → GrFormFile-CqacSbUl.js} RENAMED Viewed

@@ -1,10 +1,10 @@
 import { t as x_default } from "../../../chunks/x-2KXnqxiD.js";
-import { t as useGranularityTranslations } from "../../../chunks/granularityI18n-DoV7Ca2m.js";
-import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
-import { t as GrButton_default } from "../../GrButton/chunks/GrButton-BlffdeJr.js";
-import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-D9AWQLk2.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-SH0I--GW.js";
 import { l as runFileValidators, o as acceptValidator, u as FileValidationError } from "../../../chunks/fileValidation-C3WFaWU2.js";
 import { vDropzone } from "../../../directives/dropzone.js";
+import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
+import { t as GrButton_default } from "../../GrButton/chunks/GrButton-DCi4CUpo.js";
+import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-D9AWQLk2.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, markRaw, nextTick, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, unref, watch, withCtx, withDirectives, withModifiers } from "vue";
 import '../../../GrFormFile.css';//#region ~icons/lucide/upload
 var _hoisted_1$1 = {
@@ -41,7 +41,7 @@ var _hoisted_6 = { class: "ml-2" };
 var _hoisted_7 = ["title"];
 var _hoisted_8 = {
 	key: 3,
-	class: "text-sm text-[var(--muted-fg)]",
+	class: "text-sm text-[var(--gr-muted-fg)]",
 	"data-gr-form-file-placeholder": ""
 };
 var _hoisted_9 = {
@@ -283,7 +283,7 @@ var GrFormFile_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 					}, 8, ["disabled"])) : createCommentVNode("", true),
 					!__props.multiple && hasFiles.value ? (openBlock(), createElementBlock("span", {
 						key: 2,
-						class: "text-sm text-[var(--muted-fg)] truncate max-w-[240px]",
+						class: "text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]",
 						"data-gr-form-file-single-name": "",
 						title: files.value[0]?.name
 					}, toDisplayString(files.value[0]?.name), 9, _hoisted_7)) : createCommentVNode("", true),
@@ -295,12 +295,12 @@ var GrFormFile_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 						class: "flex items-center gap-2",
 						"data-gr-form-file-item": ""
 					}, [createElementVNode("span", {
-						class: "text-sm text-[var(--muted-fg)] truncate max-w-[240px]",
+						class: "text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]",
 						title: file.name,
 						"data-gr-form-file-item-name": ""
 					}, toDisplayString(file.name), 9, _hoisted_10), createElementVNode("button", {
 						type: "button",
-						class: "text-xs text-[var(--muted-fg)] hover:text-[var(--fg)]",
+						class: "text-xs text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)]",
 						"data-gr-form-file-item-remove": "",
 						disabled: __props.disabled,
 						onClick: withModifiers(($event) => removeAt(index), ["prevent"])
@@ -315,6 +315,6 @@ var GrFormFile_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			])], 2)), [[unref(vDropzone), dropzone.value]]);
 		};
 	}
-}), [["__scopeId", "data-v-ff219d2a"]]);
+}), [["__scopeId", "data-v-e96c4b59"]]);
 //#endregion
 export { GrFormFile_default as t };

package/dist/components/GrFormFile/chunks/GrFormFile-CqacSbUl.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"GrFormFile-CqacSbUl.js","names":[],"sources":["../../../../src/components/GrFormFile/GrFormFile.vue","../../../../src/components/GrFormFile/GrFormFile.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport IconUpload from '~icons/lucide/upload'\nimport IconX from '~icons/lucide/x'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { vDropzone } from '../../directives'\nimport { acceptValidator, FileValidationError, runFileValidators } from '../../fileValidation'\nimport type { FileValidationIssue, FileValidator } from '../../fileValidation'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\ndefineOptions({\n name: 'GrFormFile',\n})\n\nexport type GrFormFileError = FileValidationIssue\n\n/**\n * Пропы `GrFormFile` — форма-поле для выбора файлов с встроенной валидацией,\n * drag&drop (через `v-dropzone`) и списком выбранных файлов.\n *\n * Все `*Text`/`placeholder` — i18n-friendly, принимают готовые строки локали.\n */\nexport interface GrFormFileProps {\n modelValue: File | File[] | null\n multiple?: boolean\n disabled?: boolean\n /** W3C `accept` для `<input type=\"file\">` + sugar к `acceptValidator(...)`. */\n accept?: string\n validators?: FileValidator[]\n uploadText?: string\n changeText?: string\n removeText?: string\n clearAllText?: string\n placeholder?: string\n /** Дополнительная (кастомная) валидация на стороне потребителя. */\n validate?: (files: File[]) => GrFormFileError[] | Promise<GrFormFileError[]>\n}\n\nconst props = withDefaults(\n defineProps<GrFormFileProps>(),\n {\n multiple: false,\n disabled: false,\n accept: undefined,\n uploadText: undefined,\n changeText: undefined,\n removeText: undefined,\n clearAllText: undefined,\n placeholder: undefined,\n validators: undefined,\n validate: undefined,\n },\n)\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: File | File[] | null): void\n (e: 'change', value: File | File[] | null): void\n (e: 'clear'): void\n (e: 'validation', errors: GrFormFileError[]): void\n (e: 'update:errors', errors: GrFormFileError[]): void\n}>()\n\nconst { t } = useGranularityTranslations()\nconst resolvedUploadText = computed(() => props.uploadText ?? t('gr.formFile.upload', 'Upload file'))\nconst resolvedChangeText = computed(() => props.changeText ?? t('gr.formFile.change', 'Change file'))\nconst resolvedRemoveText = computed(() => props.removeText ?? t('gr.formFile.remove', 'Remove'))\nconst resolvedClearAllText = computed(() => props.clearAllText ?? t('gr.formFile.clearAll', 'Clear all'))\nconst resolvedPlaceholder = computed(() => props.placeholder ?? t('gr.formFile.placeholder', 'No files selected'))\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst localErrors = ref<GrFormFileError[]>([])\n\nconst files = computed<File[]>(() => {\n if (props.multiple) {\n return Array.isArray(props.modelValue) ? props.modelValue : []\n }\n\n return props.modelValue instanceof File ? [props.modelValue] : []\n})\n\nconst hasFiles = computed(() => files.value.length > 0)\n\nfunction clearInputValue() {\n if (!inputRef.value) return\n inputRef.value.value = ''\n}\n\nfunction setErrors(next: GrFormFileError[]) {\n localErrors.value = next\n emit('validation', next)\n emit('update:errors', next)\n}\n\nfunction clearErrors() {\n if (localErrors.value.length === 0) return\n setErrors([])\n}\n\nfunction openDialog() {\n if (props.disabled) return\n inputRef.value?.click()\n}\n\nfunction emitModel(nextFiles: File[]) {\n const value: File | File[] | null = props.multiple\n ? nextFiles\n : (nextFiles[0] ?? null)\n\n emit('update:modelValue', value)\n emit('change', value)\n}\n\nasync function applyFiles(nextFiles: File[]) {\n const isPromiseLike = (value: unknown): value is PromiseLike<any> => {\n return !!value && typeof (value as any).then === 'function'\n }\n\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n const res = runFileValidators(nextFiles, validators, {\n source: 'input',\n multiple: props.multiple,\n })\n\n const { files: picked, issues } = isPromiseLike(res) ? await res : res\n\n if (issues.length > 0) {\n setErrors(issues)\n clearInputValue()\n await nextTick()\n return\n }\n\n clearErrors()\n emitModel(picked)\n clearInputValue()\n await nextTick()\n}\n\nasync function onInputChange(event: Event) {\n if (props.disabled) return\n\n const target = event.target as HTMLInputElement | null\n const nextFiles = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n // Reset value so selecting the same file twice triggers change.\n if (target) target.value = ''\n await nextTick()\n\n await applyFiles(nextFiles)\n}\n\nfunction clearAll() {\n if (props.disabled) return\n clearErrors()\n clearInputValue()\n emit('clear')\n\n emit('update:modelValue', props.multiple ? [] : null)\n emit('change', props.multiple ? [] : null)\n}\n\nfunction removeAt(index: number) {\n if (props.disabled) return\n if (!props.multiple) {\n clearAll()\n return\n }\n\n const next = files.value.slice()\n next.splice(index, 1)\n\n emit('update:modelValue', next)\n emit('change', next)\n}\n\nfunction issueMessage(issue: GrFormFileError): string {\n if (issue.fileName) return `${issue.fileName}: ${issue.message}`\n return issue.message\n}\n\nconst dropzone = computed(() => {\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n return {\n enabled: !props.disabled,\n multiple: props.multiple,\n validators,\n onFiles: async (dropped: File[]) => {\n // `v-dropzone` уже выполнил валидаторы и нормализацию по `multiple`.\n clearErrors()\n emitModel(dropped)\n clearInputValue()\n await nextTick()\n },\n onError: (error: unknown) => {\n if (error instanceof FileValidationError) {\n setErrors(error.issues)\n }\n else {\n setErrors([\n {\n code: 'accept',\n message: t('gr.formFile.validateError', 'Failed to validate dropped files'),\n },\n ])\n }\n },\n }\n})\n\nwatch(\n () => props.modelValue,\n (value) => {\n if (!inputRef.value) return\n\n if (!value || (Array.isArray(value) && value.length === 0)) {\n // Позволяет выбрать тот же файл снова после внешнего сброса.\n inputRef.value.value = ''\n }\n },\n)\n</script>\n\n<template>\n <div\n v-dropzone=\"dropzone\"\n data-gr-form-file\n class=\"rounded-[var(--gr-radius-md)]\"\n :class=\"disabled ? 'opacity-60 cursor-not-allowed' : ''\"\n >\n <input\n ref=\"inputRef\"\n data-gr-form-file-input\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n class=\"absolute opacity-0 w-px h-px pointer-events-none\"\n :multiple=\"multiple\"\n :accept=\"accept\"\n :disabled=\"disabled\"\n @change=\"onInputChange\"\n >\n\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex flex-wrap items-center gap-3\">\n <GrButton\n variant=\"secondary\"\n size=\"sm\"\n data-gr-form-file-upload-btn\n :disabled=\"disabled\"\n @click.prevent=\"openDialog\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconUpload />\n </GrIcon>\n <span class=\"ml-2\">{{ hasFiles ? resolvedChangeText : resolvedUploadText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"hasFiles && !multiple\"\n variant=\"secondary\"\n size=\"sm\"\n data-gr-form-file-clear-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ resolvedRemoveText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"multiple && hasFiles\"\n variant=\"secondary\"\n size=\"sm\"\n data-gr-form-file-clear-all-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ resolvedClearAllText }}</span>\n </GrButton>\n\n <span\n v-if=\"!multiple && hasFiles\"\n class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n data-gr-form-file-single-name\n :title=\"files[0]?.name\"\n >\n {{ files[0]?.name }}\n </span>\n\n <span\n v-if=\"!hasFiles\"\n class=\"text-sm text-[var(--gr-muted-fg)]\"\n data-gr-form-file-placeholder\n >\n {{ resolvedPlaceholder }}\n </span>\n </div>\n\n <div v-if=\"multiple && hasFiles\" class=\"flex flex-col gap-2\">\n <div\n v-for=\"(file, index) in files\"\n :key=\"`${file.name}-${file.size}-${index}`\"\n class=\"flex items-center gap-2\"\n data-gr-form-file-item\n >\n <span\n class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n :title=\"file.name\"\n data-gr-form-file-item-name\n >\n {{ file.name }}\n </span>\n\n <button\n type=\"button\"\n class=\"text-xs text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)]\"\n data-gr-form-file-item-remove\n :disabled=\"disabled\"\n @click.prevent=\"removeAt(index)\"\n >\n {{ removeText }}\n </button>\n </div>\n </div>\n\n <slot name=\"errors\" :errors=\"localErrors\">\n <div v-if=\"localErrors.length\" class=\"text-sm text-[var(--gr-danger)]\" data-gr-form-file-errors>\n <div v-for=\"(e, i) in localErrors\" :key=\"i\" data-gr-form-file-error>\n {{ issueMessage(e) }}\n </div>\n </div>\n </slot>\n </div>\n </div>\n</template>\n\n<style scoped>\n[data-gr-form-file].gr-dropzone--over {\n outline: 2px solid var(--gr-ring);\n outline-offset: 2px;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport IconUpload from '~icons/lucide/upload'\nimport IconX from '~icons/lucide/x'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { vDropzone } from '../../directives'\nimport { acceptValidator, FileValidationError, runFileValidators } from '../../fileValidation'\nimport type { FileValidationIssue, FileValidator } from '../../fileValidation'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\ndefineOptions({\n name: 'GrFormFile',\n})\n\nexport type GrFormFileError = FileValidationIssue\n\n/**\n * Пропы `GrFormFile` — форма-поле для выбора файлов с встроенной валидацией,\n * drag&drop (через `v-dropzone`) и списком выбранных файлов.\n *\n * Все `*Text`/`placeholder` — i18n-friendly, принимают готовые строки локали.\n */\nexport interface GrFormFileProps {\n modelValue: File | File[] | null\n multiple?: boolean\n disabled?: boolean\n /** W3C `accept` для `<input type=\"file\">` + sugar к `acceptValidator(...)`. */\n accept?: string\n validators?: FileValidator[]\n uploadText?: string\n changeText?: string\n removeText?: string\n clearAllText?: string\n placeholder?: string\n /** Дополнительная (кастомная) валидация на стороне потребителя. */\n validate?: (files: File[]) => GrFormFileError[] | Promise<GrFormFileError[]>\n}\n\nconst props = withDefaults(\n defineProps<GrFormFileProps>(),\n {\n multiple: false,\n disabled: false,\n accept: undefined,\n uploadText: undefined,\n changeText: undefined,\n removeText: undefined,\n clearAllText: undefined,\n placeholder: undefined,\n validators: undefined,\n validate: undefined,\n },\n)\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: File | File[] | null): void\n (e: 'change', value: File | File[] | null): void\n (e: 'clear'): void\n (e: 'validation', errors: GrFormFileError[]): void\n (e: 'update:errors', errors: GrFormFileError[]): void\n}>()\n\nconst { t } = useGranularityTranslations()\nconst resolvedUploadText = computed(() => props.uploadText ?? t('gr.formFile.upload', 'Upload file'))\nconst resolvedChangeText = computed(() => props.changeText ?? t('gr.formFile.change', 'Change file'))\nconst resolvedRemoveText = computed(() => props.removeText ?? t('gr.formFile.remove', 'Remove'))\nconst resolvedClearAllText = computed(() => props.clearAllText ?? t('gr.formFile.clearAll', 'Clear all'))\nconst resolvedPlaceholder = computed(() => props.placeholder ?? t('gr.formFile.placeholder', 'No files selected'))\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst localErrors = ref<GrFormFileError[]>([])\n\nconst files = computed<File[]>(() => {\n if (props.multiple) {\n return Array.isArray(props.modelValue) ? props.modelValue : []\n }\n\n return props.modelValue instanceof File ? [props.modelValue] : []\n})\n\nconst hasFiles = computed(() => files.value.length > 0)\n\nfunction clearInputValue() {\n if (!inputRef.value) return\n inputRef.value.value = ''\n}\n\nfunction setErrors(next: GrFormFileError[]) {\n localErrors.value = next\n emit('validation', next)\n emit('update:errors', next)\n}\n\nfunction clearErrors() {\n if (localErrors.value.length === 0) return\n setErrors([])\n}\n\nfunction openDialog() {\n if (props.disabled) return\n inputRef.value?.click()\n}\n\nfunction emitModel(nextFiles: File[]) {\n const value: File | File[] | null = props.multiple\n ? nextFiles\n : (nextFiles[0] ?? null)\n\n emit('update:modelValue', value)\n emit('change', value)\n}\n\nasync function applyFiles(nextFiles: File[]) {\n const isPromiseLike = (value: unknown): value is PromiseLike<any> => {\n return !!value && typeof (value as any).then === 'function'\n }\n\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n const res = runFileValidators(nextFiles, validators, {\n source: 'input',\n multiple: props.multiple,\n })\n\n const { files: picked, issues } = isPromiseLike(res) ? await res : res\n\n if (issues.length > 0) {\n setErrors(issues)\n clearInputValue()\n await nextTick()\n return\n }\n\n clearErrors()\n emitModel(picked)\n clearInputValue()\n await nextTick()\n}\n\nasync function onInputChange(event: Event) {\n if (props.disabled) return\n\n const target = event.target as HTMLInputElement | null\n const nextFiles = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n // Reset value so selecting the same file twice triggers change.\n if (target) target.value = ''\n await nextTick()\n\n await applyFiles(nextFiles)\n}\n\nfunction clearAll() {\n if (props.disabled) return\n clearErrors()\n clearInputValue()\n emit('clear')\n\n emit('update:modelValue', props.multiple ? [] : null)\n emit('change', props.multiple ? [] : null)\n}\n\nfunction removeAt(index: number) {\n if (props.disabled) return\n if (!props.multiple) {\n clearAll()\n return\n }\n\n const next = files.value.slice()\n next.splice(index, 1)\n\n emit('update:modelValue', next)\n emit('change', next)\n}\n\nfunction issueMessage(issue: GrFormFileError): string {\n if (issue.fileName) return `${issue.fileName}: ${issue.message}`\n return issue.message\n}\n\nconst dropzone = computed(() => {\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n return {\n enabled: !props.disabled,\n multiple: props.multiple,\n validators,\n onFiles: async (dropped: File[]) => {\n // `v-dropzone` уже выполнил валидаторы и нормализацию по `multiple`.\n clearErrors()\n emitModel(dropped)\n clearInputValue()\n await nextTick()\n },\n onError: (error: unknown) => {\n if (error instanceof FileValidationError) {\n setErrors(error.issues)\n }\n else {\n setErrors([\n {\n code: 'accept',\n message: t('gr.formFile.validateError', 'Failed to validate dropped files'),\n },\n ])\n }\n },\n }\n})\n\nwatch(\n () => props.modelValue,\n (value) => {\n if (!inputRef.value) return\n\n if (!value || (Array.isArray(value) && value.length === 0)) {\n // Позволяет выбрать тот же файл снова после внешнего сброса.\n inputRef.value.value = ''\n }\n },\n)\n</script>\n\n<template>\n <div\n v-dropzone=\"dropzone\"\n data-gr-form-file\n class=\"rounded-[var(--gr-radius-md)]\"\n :class=\"disabled ? 'opacity-60 cursor-not-allowed' : ''\"\n >\n <input\n ref=\"inputRef\"\n data-gr-form-file-input\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n class=\"absolute opacity-0 w-px h-px pointer-events-none\"\n :multiple=\"multiple\"\n :accept=\"accept\"\n :disabled=\"disabled\"\n @change=\"onInputChange\"\n >\n\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex flex-wrap items-center gap-3\">\n <GrButton\n variant=\"secondary\"\n size=\"sm\"\n data-gr-form-file-upload-btn\n :disabled=\"disabled\"\n @click.prevent=\"openDialog\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconUpload />\n </GrIcon>\n <span class=\"ml-2\">{{ hasFiles ? resolvedChangeText : resolvedUploadText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"hasFiles && !multiple\"\n variant=\"secondary\"\n size=\"sm\"\n data-gr-form-file-clear-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ resolvedRemoveText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"multiple && hasFiles\"\n variant=\"secondary\"\n size=\"sm\"\n data-gr-form-file-clear-all-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ resolvedClearAllText }}</span>\n </GrButton>\n\n <span\n v-if=\"!multiple && hasFiles\"\n class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n data-gr-form-file-single-name\n :title=\"files[0]?.name\"\n >\n {{ files[0]?.name }}\n </span>\n\n <span\n v-if=\"!hasFiles\"\n class=\"text-sm text-[var(--gr-muted-fg)]\"\n data-gr-form-file-placeholder\n >\n {{ resolvedPlaceholder }}\n </span>\n </div>\n\n <div v-if=\"multiple && hasFiles\" class=\"flex flex-col gap-2\">\n <div\n v-for=\"(file, index) in files\"\n :key=\"`${file.name}-${file.size}-${index}`\"\n class=\"flex items-center gap-2\"\n data-gr-form-file-item\n >\n <span\n class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n :title=\"file.name\"\n data-gr-form-file-item-name\n >\n {{ file.name }}\n </span>\n\n <button\n type=\"button\"\n class=\"text-xs text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)]\"\n data-gr-form-file-item-remove\n :disabled=\"disabled\"\n @click.prevent=\"removeAt(index)\"\n >\n {{ removeText }}\n </button>\n </div>\n </div>\n\n <slot name=\"errors\" :errors=\"localErrors\">\n <div v-if=\"localErrors.length\" class=\"text-sm text-[var(--gr-danger)]\" data-gr-form-file-errors>\n <div v-for=\"(e, i) in localErrors\" :key=\"i\" data-gr-form-file-error>\n {{ issueMessage(e) }}\n </div>\n </div>\n </slot>\n </div>\n </div>\n</template>\n\n<style scoped>\n[data-gr-form-file].gr-dropzone--over {\n outline: 2px solid var(--gr-ring);\n outline-offset: 2px;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/GrFormFile/index.js CHANGED Viewed

@@ -1,3 +1,3 @@
-import { t as GrFormFile_default } from "./chunks/GrFormFile-CXcqqdvV.js";
+import { t as GrFormFile_default } from "./chunks/GrFormFile-CqacSbUl.js";
 import { t as grFormFileConfig } from "../../chunks/config-D7GZO-Dx.js";
 export { GrFormFile_default as GrFormFile, GrFormFile_default as default, grFormFileConfig };

package/dist/components/GrFormSection/chunks/{GrFormSection-Ce21jcgo.js → GrFormSection-C3w9DQJf.js} RENAMED Viewed

@@ -26,7 +26,7 @@ var GrFormSection_default = /* @__PURE__ */ defineComponent({
 			}, toDisplayString(__props.title), 9, _hoisted_2), __props.description ? (openBlock(), createElementBlock("div", {
 				key: 0,
 				id: unref(descriptionId),
-				class: "mt-1 text-[13px] text-[var(--muted-fg)]"
+				class: "mt-1 text-[13px] text-[var(--gr-muted-fg)]"
 			}, toDisplayString(__props.description), 9, _hoisted_3)) : createCommentVNode("", true)]), renderSlot(_ctx.$slots, "default")], 8, _hoisted_1);
 		};
 	}

package/dist/components/GrFormSection/chunks/GrFormSection-C3w9DQJf.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"GrFormSection-C3w9DQJf.js","names":[],"sources":["../../../../src/components/GrFormSection/GrFormSection.vue","../../../../src/components/GrFormSection/GrFormSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\n/**\n * GrFormSection — секция формы с заголовком, опциональным описанием и контентом.\n *\n * - `section` связан с заголовком через `aria-labelledby` и c описанием\n * (если есть) через `aria-describedby` — для a11y.\n */\nexport interface GrFormSectionProps {\n title: string\n description?: string\n}\n\nwithDefaults(defineProps<GrFormSectionProps>(), {\n description: undefined,\n})\n\nconst titleId = useId()\nconst descriptionId = useId()\n</script>\n\n<template>\n <section\n data-gr-form-section\n class=\"grid gap-4\"\n :aria-labelledby=\"titleId\"\n :aria-describedby=\"description ? descriptionId : undefined\"\n >\n <div>\n <div :id=\"titleId\" class=\"text-[14px] font-700\">\n {{ title }}\n </div>\n <div\n v-if=\"description\"\n :id=\"descriptionId\"\n class=\"mt-1 text-[13px] text-[var(--gr-muted-fg)]\"\n >\n {{ description }}\n </div>\n </div>\n <slot />\n </section>\n</template>\n","<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\n/**\n * GrFormSection — секция формы с заголовком, опциональным описанием и контентом.\n *\n * - `section` связан с заголовком через `aria-labelledby` и c описанием\n * (если есть) через `aria-describedby` — для a11y.\n */\nexport interface GrFormSectionProps {\n title: string\n description?: string\n}\n\nwithDefaults(defineProps<GrFormSectionProps>(), {\n description: undefined,\n})\n\nconst titleId = useId()\nconst descriptionId = useId()\n</script>\n\n<template>\n <section\n data-gr-form-section\n class=\"grid gap-4\"\n :aria-labelledby=\"titleId\"\n :aria-describedby=\"description ? descriptionId : undefined\"\n >\n <div>\n <div :id=\"titleId\" class=\"text-[14px] font-700\">\n {{ title }}\n </div>\n <div\n v-if=\"description\"\n :id=\"descriptionId\"\n class=\"mt-1 text-[13px] text-[var(--gr-muted-fg)]\"\n >\n {{ description }}\n </div>\n </div>\n <slot />\n </section>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAkBA,MAAM,UAAU,MAAM;EACtB,MAAM,gBAAgB,MAAM;;uBAI1B,mBAmBU,WAAA;IAlBR,wBAAA;IACA,OAAM;IACL,mBAAiB,MAAA,OAAA;IACjB,oBAAkB,QAAA,cAAc,MAAA,aAAA,IAAgB,KAAA;OAEjD,mBAWM,OAAA,MAAA,CAVJ,mBAEM,OAAA;IAFA,IAAI,MAAA,OAAA;IAAS,OAAM;sBACpB,QAAA,KAAK,GAAA,GAAA,UAAA,GAGF,QAAA,eAAA,UAAA,GADR,mBAMM,OAAA;;IAJH,IAAI,MAAA,aAAA;IACL,OAAM;sBAEH,QAAA,WAAW,GAAA,GAAA,UAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA,GAGlB,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,GAAA,UAAA"}

package/dist/components/GrFormSection/index.js CHANGED Viewed

@@ -1,3 +1,3 @@
-import { t as GrFormSection_default } from "./chunks/GrFormSection-Ce21jcgo.js";
+import { t as GrFormSection_default } from "./chunks/GrFormSection-C3w9DQJf.js";
 import { t as grFormSectionConfig } from "../../chunks/config-B0qIpo8m.js";
 export { GrFormSection_default as GrFormSection, GrFormSection_default as default, grFormSectionConfig };